-
Notifications
You must be signed in to change notification settings - Fork 3.6k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
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]>
- Loading branch information
1 parent
4e982a4
commit 1f104cc
Showing
3 changed files
with
504 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,161 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
|
||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Donut Animation</title> | ||
<link rel="stylesheet" href="styles.css"> | ||
</head> | ||
|
||
<body> | ||
<div class="Happy-Hanukkah">Happy Hanukkah!!!</div> | ||
<div class="donut-container"> | ||
<div class="donut1"> | ||
<!-- ספרילנקים רבים מפוזרים על כל שטח הדונאט --> | ||
<div class="sprinkle" style="--angle: 15deg; --top: 10px; --left: 30px;"></div> | ||
<div class="sprinkle dark" style="--angle: -30deg; --top: 25px; --left: 40px;"></div> | ||
<div class="sprinkle light" style="--angle: 60deg; --top: 130px; --left: 60px;"></div> | ||
<div class="sprinkle" style="--angle: -60deg; --top: 80px; --left: 120px;"></div> | ||
<div class="sprinkle dark" style="--angle: 35deg; --top: 110px; --left: 90px;"></div> | ||
<div class="sprinkle pink" style="--angle: 10deg; --top: 45px; --left: 50px;"></div> | ||
<div class="sprinkle" style="--angle: -45deg; --top: 35px; --left: 80px;"></div> | ||
<div class="sprinkle dark" style="--angle: 60deg; --top: 70px; --left: 110px;"></div> | ||
<div class="sprinkle pink" style="--angle: -30deg; --top: 60px; --left: 40px;"></div> | ||
<div class="sprinkle light" style="--angle: 15deg; --top: 80px; --left: 20px;"></div> | ||
<div class="sprinkle" style="--angle: -10deg; --top: 20px; --left: 80px;"></div> | ||
<div class="sprinkle light" style="--angle: -45deg; --top: 40px; --left: 120px;"></div> | ||
<div class="sprinkle" style="--angle: -45deg; --top: 30px; --left: 115px;"></div> | ||
<div class="sprinkle dark" style="--angle: -25deg; --top: 85px; --left: 20px;"></div> | ||
<div class="sprinkle pink" style="--angle: -25deg; --top: 95px; --left: 30px;"></div> | ||
<div class="sprinkle light" style="--angle: 60deg; --top: 120px; --left: 120px;"></div> | ||
<div class="sprinkle" style="--angle: -35deg; --top: 30px; --left: 115px;"></div> | ||
<div class="sprinkle dark" style="--angle: 55deg; --top: 115px; --left: 20px;"></div> | ||
<div class="sprinkle pink" style="--angle: -5deg; --top: 95px; --left: 30px;"></div> | ||
|
||
<div class="arm left"> | ||
<div class="hand left"></div> | ||
</div> | ||
<div class="arm right"> | ||
<div class="hand right"></div> | ||
</div> | ||
|
||
<div class="leg left"> | ||
<div class="foot left"></div> | ||
</div> | ||
<div class="leg right"> | ||
<div class="foot right"></div> | ||
</div> | ||
|
||
<div class="face"> | ||
<div class="eyes"> | ||
<div class="eye-to"> | ||
<div class="eye"></div> | ||
</div> | ||
<div class="eye-to"> | ||
<div class="eye"></div> | ||
</div> | ||
</div> | ||
<div class="smile"></div> | ||
</div> | ||
</div> | ||
<div class="donut2"> | ||
<!-- ספרילנקים רבים מפוזרים על כל שטח הדונאט --> | ||
<div class="sprinkle" style="--angle: 15deg; --top: 10px; --left: 30px;"></div> | ||
<div class="sprinkle dark" style="--angle: -30deg; --top: 25px; --left: 40px;"></div> | ||
<div class="sprinkle light" style="--angle: 60deg; --top: 130px; --left: 60px;"></div> | ||
<div class="sprinkle" style="--angle: -60deg; --top: 80px; --left: 120px;"></div> | ||
<div class="sprinkle dark" style="--angle: 35deg; --top: 110px; --left: 90px;"></div> | ||
<div class="sprinkle pink" style="--angle: 10deg; --top: 45px; --left: 50px;"></div> | ||
<div class="sprinkle" style="--angle: -45deg; --top: 35px; --left: 80px;"></div> | ||
<div class="sprinkle dark" style="--angle: 60deg; --top: 70px; --left: 110px;"></div> | ||
<div class="sprinkle pink" style="--angle: -30deg; --top: 60px; --left: 40px;"></div> | ||
<div class="sprinkle light" style="--angle: 15deg; --top: 80px; --left: 20px;"></div> | ||
<div class="sprinkle" style="--angle: -10deg; --top: 20px; --left: 80px;"></div> | ||
<div class="sprinkle light" style="--angle: -45deg; --top: 40px; --left: 120px;"></div> | ||
<div class="sprinkle" style="--angle: -45deg; --top: 30px; --left: 115px;"></div> | ||
<div class="sprinkle dark" style="--angle: -25deg; --top: 85px; --left: 20px;"></div> | ||
<div class="sprinkle pink" style="--angle: -25deg; --top: 95px; --left: 30px;"></div> | ||
<div class="sprinkle light" style="--angle: 60deg; --top: 120px; --left: 120px;"></div> | ||
<div class="sprinkle" style="--angle: -35deg; --top: 30px; --left: 115px;"></div> | ||
<div class="sprinkle dark" style="--angle: 55deg; --top: 115px; --left: 20px;"></div> | ||
<div class="sprinkle pink" style="--angle: -5deg; --top: 95px; --left: 30px;"></div> | ||
|
||
<div class="arm left"> | ||
<div class="hand left"></div> | ||
</div> | ||
<div class="arm right"> | ||
<div class="hand right"></div> | ||
</div> | ||
|
||
<div class="leg left"> | ||
<div class="foot left"></div> | ||
</div> | ||
<div class="leg right"> | ||
<div class="foot right"></div> | ||
</div> | ||
|
||
<div class="face"> | ||
<div class="eyes"> | ||
<div class="eye-to"> | ||
<div class="eye"></div> | ||
</div> | ||
<div class="eye-to"> | ||
<div class="eye"></div> | ||
</div> | ||
</div> | ||
<div class="smile"></div> | ||
</div> | ||
</div> | ||
<div class="donut3"> | ||
<!-- ספרילנקים רבים מפוזרים על כל שטח הדונאט --> | ||
<div class="sprinkle" style="--angle: 15deg; --top: 10px; --left: 30px;"></div> | ||
<div class="sprinkle dark" style="--angle: -30deg; --top: 25px; --left: 40px;"></div> | ||
<div class="sprinkle light" style="--angle: 60deg; --top: 130px; --left: 60px;"></div> | ||
<div class="sprinkle" style="--angle: -60deg; --top: 80px; --left: 120px;"></div> | ||
<div class="sprinkle dark" style="--angle: 35deg; --top: 110px; --left: 90px;"></div> | ||
<div class="sprinkle pink" style="--angle: 10deg; --top: 45px; --left: 50px;"></div> | ||
<div class="sprinkle" style="--angle: -45deg; --top: 35px; --left: 80px;"></div> | ||
<div class="sprinkle dark" style="--angle: 60deg; --top: 70px; --left: 110px;"></div> | ||
<div class="sprinkle pink" style="--angle: -30deg; --top: 60px; --left: 40px;"></div> | ||
<div class="sprinkle light" style="--angle: 15deg; --top: 80px; --left: 20px;"></div> | ||
<div class="sprinkle" style="--angle: -10deg; --top: 20px; --left: 80px;"></div> | ||
<div class="sprinkle light" style="--angle: -45deg; --top: 40px; --left: 120px;"></div> | ||
<div class="sprinkle" style="--angle: -45deg; --top: 30px; --left: 115px;"></div> | ||
<div class="sprinkle dark" style="--angle: -25deg; --top: 85px; --left: 20px;"></div> | ||
<div class="sprinkle pink" style="--angle: -25deg; --top: 95px; --left: 30px;"></div> | ||
<div class="sprinkle light" style="--angle: 60deg; --top: 120px; --left: 120px;"></div> | ||
<div class="sprinkle" style="--angle: -35deg; --top: 30px; --left: 115px;"></div> | ||
<div class="sprinkle dark" style="--angle: 55deg; --top: 115px; --left: 20px;"></div> | ||
<div class="sprinkle pink" style="--angle: -5deg; --top: 95px; --left: 30px;"></div> | ||
|
||
<div class="arm left"> | ||
<div class="hand left"></div> | ||
</div> | ||
<div class="arm right"> | ||
<div class="hand right"></div> | ||
</div> | ||
|
||
<div class="leg left"> | ||
<div class="foot left"></div> | ||
</div> | ||
<div class="leg right"> | ||
<div class="foot right"></div> | ||
</div> | ||
|
||
<div class="face"> | ||
<div class="eyes"> | ||
<div class="eye-to"> | ||
<div class="eye"></div> | ||
</div> | ||
<div class="eye-to"> | ||
<div class="eye"></div> | ||
</div> | ||
</div> | ||
<div class="smile"></div> | ||
</div> | ||
</div> | ||
</div> | ||
</body> | ||
|
||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
{ | ||
"artName": "Donuts Animation", | ||
"githubHandle": "ABERsara" | ||
} |
Oops, something went wrong.