-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
124 lines (111 loc) · 5.39 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Rudolf - The SAP Guru</title>
<style>
body {
font-family: 'Arial', sans-serif;
background-color: #1e1e2e;
color: #ffffff;
text-align: center;
padding: 50px;
overflow-y: auto;
}
.container {
max-width: 800px;
margin: auto;
background: rgba(0, 0, 0, 0.6);
padding: 20px;
border-radius: 10px;
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.2);
}
h1 {
font-size: 2.5em;
background: linear-gradient(90deg, #ffcc00, #ff6600);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.wizard {
font-size: 5em;
}
.btn {
background: #ff6600;
color: white;
padding: 10px 20px;
border: none;
cursor: pointer;
font-size: 1.2em;
margin-top: 20px;
border-radius: 5px;
}
.btn:hover {
background: #ffcc00;
}
.hidden-message {
display: none;
margin-top: 20px;
font-size: 1.2em;
color: #ffcc00;
}
.story {
text-align: left;
margin-top: 30px;
font-size: 1.2em;
line-height: 1.6;
padding: 20px;
background: rgba(255, 255, 255, 0.1);
border-radius: 10px;
}
.language-switch {
margin-bottom: 20px;
}
</style>
</head>
<body>
<div class="language-switch">
<button class="btn" onclick="setLanguage('en')">English 🇬🇧</button>
<button class="btn" onclick="setLanguage('sk')">Slovensky 🇸🇰</button>
</div>
<div class="container">
<div class="wizard">🧙♂️</div>
<h1 data-en="Rudolf - The SAP Guru" data-sk="Rudolf - SAP Guru">Rudolf - The SAP Guru</h1>
<p data-en="He casts spells and debugs with his magic staff. All hail the mighty SAP sorcerer!"
data-sk="Kúzli kúzla a odstraňuje chyby svojou magickou palicou. Sláva mocnému SAP čarodejovi!">
He casts spells and debugs with his magic staff. All hail the mighty SAP sorcerer!
</p>
<button class="btn" onclick="showSecret()" data-en="Reveal the Guru's Secret"
data-sk="Odhaľ tajomstvo Guru">Reveal the Guru's Secret</button>
<p class="hidden-message" id="secret" data-en="The best SAP debugger is... a good night's sleep!"
data-sk="Najlepší SAP debugger je... dobrý nočný spánok!">
"The best SAP debugger is... a good night's sleep!"
</p>
</div>
<div class="story">
<h2 data-en="The Legend of the SAP Wizard" data-sk="Legenda o SAP čarodejovi">The Legend of the SAP Wizard</h2>
<p data-en="In the mystical realm of EnterpriseLand, where processes are tangled like ancient vines, there arose a wise and powerful wizard known as Rudolf. With a mere flick of his enchanted debugging staff, he could tame the wildest of SAP systems, banishing errors into the void and restoring harmony to the kingdom."
data-sk="V mystickej ríši EnterpriseLand, kde sú procesy zamotané ako starobylé vínne révy, povstal múdry a mocný čarodej Rudolf. S jediným mávnutím svojho očarovaného debuggerového žezla dokázal skrotiť najdivokejšie SAP systémy, vyháňať chyby do prázdna a obnovovať harmóniu v kráľovstve.">
In the mystical realm of EnterpriseLand, where processes are tangled like ancient vines, there arose a wise
and powerful wizard known as Rudolf. With a mere flick of his enchanted debugging staff, he could tame the
wildest of SAP systems, banishing errors into the void and restoring harmony to the kingdom.
</p>
<p data-en="Yet, beyond his wizardly prowess, there was a tale whispered among the clerks and scribes—a story of a noble knight. Clad not in robes, but in shining armor of logic and steel, he ventured forth, not only to slay the demons of misconfiguration but to guard the fair Lady Gabriela, a maiden of great grace and wisdom."
data-sk="Avšak, za jeho čarodejníckou mocou sa medzi úradníkmi a pisármi šepkala legenda o ušľachtilom rytierovi. Neobliekal si rúcho, ale lesklé brnenie logiky a ocele. Nevydával sa len na boj s démonmi nesprávnych konfigurácií, ale aj chrániť krásnu Lady Gabrielu, pannu plnú múdrosti a pôvabu.">
Yet, beyond his wizardly prowess, there was a tale whispered among the clerks and scribes—a story of a noble
knight. Clad not in robes, but in shining armor of logic and steel, he ventured forth, not only to slay the
demons of misconfiguration but to guard the fair Lady Gabriela, a maiden of great grace and wisdom.
</p>
</div>
<script>
function showSecret() {
document.getElementById('secret').style.display = 'block';
}
function setLanguage(lang) {
document.querySelectorAll('[data-en]').forEach(element => {
element.innerText = element.getAttribute(`data-${lang}`);
});
}
</script>
</body>
</html>