Skip to content

Commit 1f104cc

Browse files
ABERsaraLaurelineP
ABERsara
and
LaurelineP
authored
Donuts animation for a happy Hanukah (#2897)
* Add a funny donuts animation special for hanucka! * Add a funny donuts animation special for hanucka!!! * Add a funny donuts animation special for a happy Hanukkah!!! --------- Co-authored-by: Laureline Paris <[email protected]>
1 parent 4e982a4 commit 1f104cc

File tree

3 files changed

+504
-0
lines changed

3 files changed

+504
-0
lines changed

‎Art/ABERsara-Donuts-Animation/index.html‎

Lines changed: 161 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,161 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Donut Animation</title>
8+
<link rel="stylesheet" href="styles.css">
9+
</head>
10+
11+
<body>
12+
<div class="Happy-Hanukkah">Happy Hanukkah!!!</div>
13+
<div class="donut-container">
14+
<div class="donut1">
15+
<!-- ספרילנקים רבים מפוזרים על כל שטח הדונאט -->
16+
<div class="sprinkle" style="--angle: 15deg; --top: 10px; --left: 30px;"></div>
17+
<div class="sprinkle dark" style="--angle: -30deg; --top: 25px; --left: 40px;"></div>
18+
<div class="sprinkle light" style="--angle: 60deg; --top: 130px; --left: 60px;"></div>
19+
<div class="sprinkle" style="--angle: -60deg; --top: 80px; --left: 120px;"></div>
20+
<div class="sprinkle dark" style="--angle: 35deg; --top: 110px; --left: 90px;"></div>
21+
<div class="sprinkle pink" style="--angle: 10deg; --top: 45px; --left: 50px;"></div>
22+
<div class="sprinkle" style="--angle: -45deg; --top: 35px; --left: 80px;"></div>
23+
<div class="sprinkle dark" style="--angle: 60deg; --top: 70px; --left: 110px;"></div>
24+
<div class="sprinkle pink" style="--angle: -30deg; --top: 60px; --left: 40px;"></div>
25+
<div class="sprinkle light" style="--angle: 15deg; --top: 80px; --left: 20px;"></div>
26+
<div class="sprinkle" style="--angle: -10deg; --top: 20px; --left: 80px;"></div>
27+
<div class="sprinkle light" style="--angle: -45deg; --top: 40px; --left: 120px;"></div>
28+
<div class="sprinkle" style="--angle: -45deg; --top: 30px; --left: 115px;"></div>
29+
<div class="sprinkle dark" style="--angle: -25deg; --top: 85px; --left: 20px;"></div>
30+
<div class="sprinkle pink" style="--angle: -25deg; --top: 95px; --left: 30px;"></div>
31+
<div class="sprinkle light" style="--angle: 60deg; --top: 120px; --left: 120px;"></div>
32+
<div class="sprinkle" style="--angle: -35deg; --top: 30px; --left: 115px;"></div>
33+
<div class="sprinkle dark" style="--angle: 55deg; --top: 115px; --left: 20px;"></div>
34+
<div class="sprinkle pink" style="--angle: -5deg; --top: 95px; --left: 30px;"></div>
35+
36+
<div class="arm left">
37+
<div class="hand left"></div>
38+
</div>
39+
<div class="arm right">
40+
<div class="hand right"></div>
41+
</div>
42+
43+
<div class="leg left">
44+
<div class="foot left"></div>
45+
</div>
46+
<div class="leg right">
47+
<div class="foot right"></div>
48+
</div>
49+
50+
<div class="face">
51+
<div class="eyes">
52+
<div class="eye-to">
53+
<div class="eye"></div>
54+
</div>
55+
<div class="eye-to">
56+
<div class="eye"></div>
57+
</div>
58+
</div>
59+
<div class="smile"></div>
60+
</div>
61+
</div>
62+
<div class="donut2">
63+
<!-- ספרילנקים רבים מפוזרים על כל שטח הדונאט -->
64+
<div class="sprinkle" style="--angle: 15deg; --top: 10px; --left: 30px;"></div>
65+
<div class="sprinkle dark" style="--angle: -30deg; --top: 25px; --left: 40px;"></div>
66+
<div class="sprinkle light" style="--angle: 60deg; --top: 130px; --left: 60px;"></div>
67+
<div class="sprinkle" style="--angle: -60deg; --top: 80px; --left: 120px;"></div>
68+
<div class="sprinkle dark" style="--angle: 35deg; --top: 110px; --left: 90px;"></div>
69+
<div class="sprinkle pink" style="--angle: 10deg; --top: 45px; --left: 50px;"></div>
70+
<div class="sprinkle" style="--angle: -45deg; --top: 35px; --left: 80px;"></div>
71+
<div class="sprinkle dark" style="--angle: 60deg; --top: 70px; --left: 110px;"></div>
72+
<div class="sprinkle pink" style="--angle: -30deg; --top: 60px; --left: 40px;"></div>
73+
<div class="sprinkle light" style="--angle: 15deg; --top: 80px; --left: 20px;"></div>
74+
<div class="sprinkle" style="--angle: -10deg; --top: 20px; --left: 80px;"></div>
75+
<div class="sprinkle light" style="--angle: -45deg; --top: 40px; --left: 120px;"></div>
76+
<div class="sprinkle" style="--angle: -45deg; --top: 30px; --left: 115px;"></div>
77+
<div class="sprinkle dark" style="--angle: -25deg; --top: 85px; --left: 20px;"></div>
78+
<div class="sprinkle pink" style="--angle: -25deg; --top: 95px; --left: 30px;"></div>
79+
<div class="sprinkle light" style="--angle: 60deg; --top: 120px; --left: 120px;"></div>
80+
<div class="sprinkle" style="--angle: -35deg; --top: 30px; --left: 115px;"></div>
81+
<div class="sprinkle dark" style="--angle: 55deg; --top: 115px; --left: 20px;"></div>
82+
<div class="sprinkle pink" style="--angle: -5deg; --top: 95px; --left: 30px;"></div>
83+
84+
<div class="arm left">
85+
<div class="hand left"></div>
86+
</div>
87+
<div class="arm right">
88+
<div class="hand right"></div>
89+
</div>
90+
91+
<div class="leg left">
92+
<div class="foot left"></div>
93+
</div>
94+
<div class="leg right">
95+
<div class="foot right"></div>
96+
</div>
97+
98+
<div class="face">
99+
<div class="eyes">
100+
<div class="eye-to">
101+
<div class="eye"></div>
102+
</div>
103+
<div class="eye-to">
104+
<div class="eye"></div>
105+
</div>
106+
</div>
107+
<div class="smile"></div>
108+
</div>
109+
</div>
110+
<div class="donut3">
111+
<!-- ספרילנקים רבים מפוזרים על כל שטח הדונאט -->
112+
<div class="sprinkle" style="--angle: 15deg; --top: 10px; --left: 30px;"></div>
113+
<div class="sprinkle dark" style="--angle: -30deg; --top: 25px; --left: 40px;"></div>
114+
<div class="sprinkle light" style="--angle: 60deg; --top: 130px; --left: 60px;"></div>
115+
<div class="sprinkle" style="--angle: -60deg; --top: 80px; --left: 120px;"></div>
116+
<div class="sprinkle dark" style="--angle: 35deg; --top: 110px; --left: 90px;"></div>
117+
<div class="sprinkle pink" style="--angle: 10deg; --top: 45px; --left: 50px;"></div>
118+
<div class="sprinkle" style="--angle: -45deg; --top: 35px; --left: 80px;"></div>
119+
<div class="sprinkle dark" style="--angle: 60deg; --top: 70px; --left: 110px;"></div>
120+
<div class="sprinkle pink" style="--angle: -30deg; --top: 60px; --left: 40px;"></div>
121+
<div class="sprinkle light" style="--angle: 15deg; --top: 80px; --left: 20px;"></div>
122+
<div class="sprinkle" style="--angle: -10deg; --top: 20px; --left: 80px;"></div>
123+
<div class="sprinkle light" style="--angle: -45deg; --top: 40px; --left: 120px;"></div>
124+
<div class="sprinkle" style="--angle: -45deg; --top: 30px; --left: 115px;"></div>
125+
<div class="sprinkle dark" style="--angle: -25deg; --top: 85px; --left: 20px;"></div>
126+
<div class="sprinkle pink" style="--angle: -25deg; --top: 95px; --left: 30px;"></div>
127+
<div class="sprinkle light" style="--angle: 60deg; --top: 120px; --left: 120px;"></div>
128+
<div class="sprinkle" style="--angle: -35deg; --top: 30px; --left: 115px;"></div>
129+
<div class="sprinkle dark" style="--angle: 55deg; --top: 115px; --left: 20px;"></div>
130+
<div class="sprinkle pink" style="--angle: -5deg; --top: 95px; --left: 30px;"></div>
131+
132+
<div class="arm left">
133+
<div class="hand left"></div>
134+
</div>
135+
<div class="arm right">
136+
<div class="hand right"></div>
137+
</div>
138+
139+
<div class="leg left">
140+
<div class="foot left"></div>
141+
</div>
142+
<div class="leg right">
143+
<div class="foot right"></div>
144+
</div>
145+
146+
<div class="face">
147+
<div class="eyes">
148+
<div class="eye-to">
149+
<div class="eye"></div>
150+
</div>
151+
<div class="eye-to">
152+
<div class="eye"></div>
153+
</div>
154+
</div>
155+
<div class="smile"></div>
156+
</div>
157+
</div>
158+
</div>
159+
</body>
160+
161+
</html>

‎Art/ABERsara-Donuts-Animation/meta.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"artName": "Donuts Animation",
3+
"githubHandle": "ABERsara"
4+
}

0 commit comments

Comments
 (0)