forked from duc-cute/happybirthday
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
87 lines (85 loc) · 3.73 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Happy Birthday Trà My</title>
<link rel="stylesheet" href="./asset/style.css">
<link rel="stylesheet" href="./asset/present.css">
</head>
<body>
<div class="card">
<div class="outside">
<div class="front">
<p class="text-happy">
<span style="--i:1;">H</span>
<span style="--i:2;">a</span>
<span style="--i:3;">p</span>
<span style="--i:4;">p</span>
<span style="--i:5; margin-right: 14px;">y</span>
<span style="--i:6;">B</span>
<span style="--i:7;">i</span>
<span style="--i:8;">r</span>
<span style="--i:9;">t</span>
<span style="--i:10;">h</span>
<span style="--i:11;">d</span>
<span style="--i:12;">a</span>
<span style="--i:13;">y</span>
</p>
<img src="./img/cake1.png" alt="" class="cake">
</div>
<div class="back"></div>
</div>
<div class="inside">
<p>Chúc bạn có ngày sinh nhật tuỵt zời</p>
<section class="above-fold">
<div class="wrap-present">
<div class="present-box" id="present">
<div class="present">
<div class="img-wrap" id="present-image"></div>
</div>
<div class="side front"></div>
<div class="side back"></div>
<div class="side left"></div>
<div class="side right"></div>
<div class="side top">
<span class="to">
<span class="name" id="nametag">
</span>
</span>
</div>
<div class="side bottom"></div>
</div>
</div>
</section>
<div id="congratulation">
<h4 class="title-congratulation">💘My Friend💘</h4>
<img src="./img/294201767_744947730169527_2099790112401883096_n.jpg"class="friend"/>
<h4 class="content-congratulation">
Chúc bạn My cute có tủi 19 đầy suôn sẽ và nhìu niềm vui,vẫn luôn cute
(nhưng ko bằng mìn).Chúc bạn có được những điều tốt đẹp nhất trong cuộc sống.💘
</h4>
<img src="./img/arrow2.gif" alt="" class="arrow">
</div>
</div>
<audio preload="auto" src="./y2mate.com - cute happy birthday song.mp3"></audio>
</div>
<div class="balloon">
<div><span class="text__effect-ballon">H</span></div>
<div><span class="text__effect-ballon">A</span></div>
<div><span class="text__effect-ballon">P</span></div>
<div><span class="text__effect-ballon">P</span></div>
<div><span class="text__effect-ballon">Y</span></div>
<div><span class="text__effect-ballon">B</span></div>
<div><span class="text__effect-ballon ml-15">I</span></div>
<div><span class="text__effect-ballon">R</span></div>
<div><span class="text__effect-ballon">T</span></div>
<div><span class="text__effect-ballon">H</span></div>
<div><span class="text__effect-ballon">D</span></div>
<div><span class="text__effect-ballon">A</span></div>
<div><span class="text__effect-ballon">Y</span></div>
</div>
<script src="./present.js"></script>
</body>
</html>