Skip to content

Commit 50d515d

Browse files
authored
Candle animation
1 parent 7477afd commit 50d515d

File tree

3 files changed

+527
-387
lines changed

3 files changed

+527
-387
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
# Blooming-Flower
1+
# candle

index.html

Lines changed: 36 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,43 @@
11
<!DOCTYPE html>
2-
<html lang="en">
2+
<html lang="en" >
33
<head>
4-
<meta charset="UTF-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title> Blooming Flowers With Falling Leaves</title>
7-
<link rel="stylesheet"href="style.css">
4+
<meta charset="UTF-8">
5+
<title>Candle Fun (Pure CSS Animation)</title>
6+
<link rel="stylesheet" href="./style.css">
87
</head>
98
<body>
10-
<div class="flower">
11-
<div class="f-wrapper">
12-
<div class="flower__line"></div>
13-
<div class="f">
14-
<div class="flower__leaf flower__leaf--1"></div>
15-
<div class="flower__leaf flower__leaf--2"></div>
16-
<div class="flower__leaf flower__leaf--3"></div>
17-
<div class="flower__leaf flower__leaf--4"></div>
18-
<div class="flower__leaf flower__leaf--5"></div>
19-
<div class="flower__leaf flower__leaf--6"></div>
20-
<div class="flower__leaf flower__leaf--7"></div>
21-
<div class="flower__leaf flower__leaf--8 flower__fall-down--yellow"></div>
22-
</div> </div>
23-
<div class="f-wrapper f-wrapper--2">
24-
<div class="flower__line"></div>
25-
<div class="f">
26-
<div class="flower__leaf flower__leaf--1"></div>
27-
<div class="flower__leaf flower__leaf--2"></div>
28-
<div class="flower__leaf flower__leaf--3"></div>
29-
<div class="flower__leaf flower__leaf--4"></div>
30-
<div class="flower__leaf flower__leaf--5"></div>
31-
<div class="flower__leaf flower__leaf--6"></div>
32-
<div class="flower__leaf flower__leaf--7"></div>
33-
<div class="flower__leaf flower__leaf--8 flower__fall-down--pink"></div>
34-
</div> </div>
35-
<div class="f-wrapper f-wrapper--3">
36-
<div class="flower__line"></div>
37-
<div class="f">
38-
<div class="flower__leaf flower__leaf--1"></div>
39-
<div class="flower__leaf flower__leaf--2"></div>
40-
<div class="flower__leaf flower__leaf--3"></div>
41-
<div class="flower__leaf flower__leaf--4"></div>
42-
<div class="flower__leaf flower__leaf--5"></div>
43-
<div class="flower__leaf flower__leaf--6"></div>
44-
<div class="flower__leaf flower__leaf--7"></div>
45-
<div class="flower__leaf flower__leaf--8 flower__fall-down--purple"></div>
46-
</div> </div>
47-
<div class="flower__glass"></div>
9+
<div class="wrapper">
10+
<div class="candles">
11+
<div class="light__wave"></div>
12+
<div class="candle1">
13+
<div class="candle1__body">
14+
<div class="candle1__eyes">
15+
<span class="candle1__eyes-one"></span>
16+
<span class="candle1__eyes-two"></span>
17+
</div>
18+
<div class="candle1__mouth"></div>
19+
</div>
20+
<div class="candle1__stick"></div>
4821
</div>
22+
<div class="candle2">
23+
<div class="candle2__body">
24+
<div class="candle2__eyes">
25+
<div class="candle2__eyes-one"></div>
26+
<div class="candle2__eyes-two"></div>
27+
</div>
28+
</div>
29+
<div class="candle2__stick"></div>
30+
</div>
31+
<div class="candle2__fire"></div>
32+
<div class="sparkles-one"></div>
33+
<div class="sparkles-two"></div>
34+
<div class="candle__smoke-one">
35+
</div>
36+
<div class="candle__smoke-two">
37+
</div>
38+
</div>
39+
<div class="floor">
40+
</div>
41+
</div>
4942
</body>
5043
</html>

0 commit comments

Comments
 (0)