Skip to content

Commit d3672f0

Browse files
Teos VerdiTeos Verdi
Teos Verdi
authored and
Teos Verdi
committed
Init
0 parents  commit d3672f0

File tree

1 file changed

+143
-0
lines changed

1 file changed

+143
-0
lines changed

‎index.html

Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Новогодняя IT-ёлочка 2025</title>
5+
<meta charset="utf-8">
6+
<style>
7+
body {
8+
background: #0a0a0a;
9+
color: #00ff00;
10+
font-family: monospace;
11+
display: flex;
12+
flex-direction: column;
13+
align-items: center;
14+
min-height: 100vh;
15+
margin: 0;
16+
padding: 20px;
17+
}
18+
19+
.tree {
20+
font-size: 16px;
21+
white-space: pre;
22+
text-align: center;
23+
position: relative;
24+
cursor: pointer;
25+
padding: 20px;
26+
line-height: 1.2;
27+
}
28+
29+
.message {
30+
position: fixed;
31+
top: 50%;
32+
left: 50%;
33+
transform: translate(-50%, -50%);
34+
background: rgba(0, 0, 0, 0.9);
35+
padding: 20px;
36+
border-radius: 10px;
37+
border: 1px solid #00ff00;
38+
display: none;
39+
color: #00ff00;
40+
max-width: 300px;
41+
text-align: center;
42+
z-index: 1000;
43+
}
44+
45+
.star {
46+
color: yellow;
47+
animation: twinkle 1s infinite;
48+
}
49+
50+
.ornament {
51+
display: inline;
52+
cursor: pointer;
53+
animation: colorChange 3s infinite;
54+
padding: 0 1px;
55+
}
56+
57+
@keyframes twinkle {
58+
0% { opacity: 0.5; }
59+
50% { opacity: 1; }
60+
100% { opacity: 0.5; }
61+
}
62+
63+
@keyframes colorChange {
64+
0% { color: #ff0000; }
65+
33% { color: #00ff00; }
66+
66% { color: #0000ff; }
67+
100% { color: #ff0000; }
68+
}
69+
70+
h1 {
71+
color: #ff0000;
72+
text-shadow: 0 0 5px #ff0000;
73+
margin-bottom: 30px;
74+
}
75+
</style>
76+
</head>
77+
<body>
78+
<h1>🎄 С Новым Годом, разработчики! 🎄</h1>
79+
<div class="tree" id="tree">
80+
<span class="star">★</span>
81+
/\\
82+
/ \\
83+
/o \\
84+
/ o \\
85+
/ o \\
86+
/o o \\
87+
/ o o \\
88+
/ o o \\
89+
/o o o \\
90+
/ o o o \\
91+
/o o o o \\
92+
/ o o o o \\
93+
/o o o o \\
94+
/ o o o o o \\
95+
/o o o o o \\
96+
/ o o o o o \\
97+
/o o o o o \\
98+
/_________________________________\\
99+
| | |
100+
|_____|_____|</div>
101+
<div id="message" class="message"></div>
102+
103+
<script>
104+
const messages = [
105+
"function christmas() {\n return '🎄 Счастья в новом году! 🎄';\n}",
106+
"// TODO: Закончить все баги до нового года\n// FIXME: Не получилось...",
107+
"if (newYear) {\n happiness++;\n bugs--;\n}",
108+
"try {\n openChampagne();\n} catch (hangover) {\n coffee.drink();\n}",
109+
"// Рекурсивная пьянка:\nfunction party() {\n drink();\n party(); // Максимум стека превышен!",
110+
"git commit -m 'Новогодние обещания'\ngit push origin master",
111+
"while (isNewYear) {\n celebrate();\n // Бесконечный цикл праздника",
112+
"const решения = [\n 'Учить TypeScript',\n 'Закрыть все таски',\n 'Не править прод по пятницам'\n];",
113+
"npm install christmas-spirit\n// Downloaded 1254 packages in 3m",
114+
"// Конфликт слияния с веткой master:\n<<<<<<< HEAD\nпраздник = true;\n=======\nработа = true;\n>>>>>>> master",
115+
];
116+
117+
const ornaments = document.querySelectorAll('.ornament');
118+
const messageBox = document.getElementById('message');
119+
const tree = document.getElementById('tree');
120+
121+
// Добавляем интерактивные украшения
122+
tree.innerHTML = tree.innerHTML.replace(/o/g, (match, offset) => {
123+
return `<span class="ornament" data-message="${Math.floor(Math.random() * messages.length)}">o</span>`;
124+
});
125+
126+
// Обработчик наведения на украшения
127+
document.addEventListener('mouseover', (e) => {
128+
if (e.target.classList.contains('ornament')) {
129+
const messageIndex = e.target.dataset.message;
130+
messageBox.innerText = messages[messageIndex];
131+
messageBox.style.display = 'block';
132+
}
133+
});
134+
135+
// Обработчик ухода мыши с украшения
136+
document.addEventListener('mouseout', (e) => {
137+
if (e.target.classList.contains('ornament')) {
138+
messageBox.style.display = 'none';
139+
}
140+
});
141+
</script>
142+
</body>
143+
</html>

0 commit comments

Comments
 (0)