Hugging Face's logo

Spaces:
api-ix
/
lol
Running

App Files Community
api-ix commited on
Commit
ddc8ba8
·
verified ·
1 Parent(s): 521c099

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +159 -18
index.html CHANGED
@@ -1,19 +1,160 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
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
+ <meta http-equiv="X-UA-Compatible" content="ie=edge" />
8
+ <link rel="shortcut icon" type="image/png" href="img/favicon.png" />
9
+ <title>Happy Birthday!!! :)</title>
10
+ <!-- Google Font -->
11
+ <link rel="preconnect" href="https://fonts.googleapis.com">
12
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
13
+ <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400&display=swap" rel="stylesheet">
14
+ <!-- My Style -->
15
+ <link rel="stylesheet" href="./style/main.css" />
16
+ </head>
17
+
18
+ <body>
19
+
20
+ <audio class="song" loop autoplay>
21
+ <source src="./music/hbd.mpeg">
22
+ </source>
23
+ Your browser isn't invited for super fun audio time.
24
+ </audio>
25
+
26
+ <div class="container">
27
+ <div class="one">
28
+ <h1 class="one">
29
+ Hi
30
+ <span id="name">Pelumi Ojo</span>
31
+ </h1>
32
+ <p class="two" id="greetingText">I really like your name btw!</p>
33
+ </div>
34
+
35
+ <div class="three">
36
+ <p>It's your birthday!! :D</p>
37
+ </div>
38
+
39
+ <div class="four">
40
+ <div class="text-box">
41
+ <p class="hbd-chatbox">
42
+ Happy Birthday to youu!! 🎂🎉🥳
43
+ Wishing you endless joy, laughter, and success today and always.
44
+ May your new age bring more blessings, great memories, and beautiful moments worth celebrating. 💫✨
45
+ </p>
46
+ <p class="fake-btn">Okayyy? 💝</p>
47
+ </div>
48
+ </div>
49
+
50
+ <div class="five">
51
+ <p class="idea-1">That's what I was going to do.</p>
52
+ <p class="idea-2">But then I stopped.</p>
53
+ <p class="idea-3">
54
+ I realised, I wanted to do something<br>
55
+ <strong>special</strong>
56
+ .
57
+ </p>
58
+ <p class="idea-4">Because,</p>
59
+ <p class="idea-5">
60
+ You are Special
61
+ <span>:)</span>
62
+ </p>
63
+ <p class="idea-6">
64
+ <span>S</span>
65
+ <span>O</span>
66
+ </p>
67
+ </div>
68
+
69
+ <div class="six">
70
+ <img src="./img/pelumi.jpg" alt="profile" class="profile-picture" id="imagePath"/>
71
+ <img src="img/hat.svg" alt="hat" class="hat" />
72
+ <div class="wish">
73
+ <h3 class="wish-hbd">Happy Birthday!</h3>
74
+ <h5 id="wishText">May <b style="color:purple;">Akorede Ogunsola</b> (@certified_coder) always be with you! ;)</h5>
75
+ </div>
76
+ </div>
77
+
78
+ <div class="seven">
79
+ <div class="baloons">
80
+ <img src="img/ballon2.svg" alt="" />
81
+ <img src="img/ballon1.svg" alt="" />
82
+ <img src="img/ballon3.svg" alt="" />
83
+ <img src="img/ballon1.svg" alt="" />
84
+ <img src="img/ballon2.svg" alt="" />
85
+ <img src="img/ballon3.svg" alt="" />
86
+ <img src="img/ballon2.svg" alt="" />
87
+ <img src="img/ballon3.svg" alt="" />
88
+ <img src="img/ballon1.svg" alt="" />
89
+ <img src="img/ballon2.svg" alt="" />
90
+ <img src="img/ballon3.svg" alt="" />
91
+ <img src="img/ballon2.svg" alt="" />
92
+ <img src="img/ballon1.svg" alt="" />
93
+ <img src="img/ballon3.svg" alt="" />
94
+ <img src="img/ballon2.svg" alt="" />
95
+ <img src="img/ballon3.svg" alt="" />
96
+ <img src="img/ballon1.svg" alt="" />
97
+ <img src="img/ballon2.svg" alt="" />
98
+ <img src="img/ballon1.svg" alt="" />
99
+ <img src="img/ballon3.svg" alt="" />
100
+ <img src="img/ballon3.svg" alt="" />
101
+ <img src="img/ballon1.svg" alt="" />
102
+ <img src="img/ballon2.svg" alt="" />
103
+ <img src="img/ballon3.svg" alt="" />
104
+ <img src="img/ballon2.svg" alt="" />
105
+ <img src="img/ballon1.svg" alt="" />
106
+ <img src="img/ballon3.svg" alt="" />
107
+ <img src="img/ballon2.svg" alt="" />
108
+ <img src="img/ballon3.svg" alt="" />
109
+ <img src="img/ballon1.svg" alt="" />
110
+ <img src="img/ballon2.svg" alt="" />
111
+ <img src="img/ballon1.svg" alt="" />
112
+ <img src="img/ballon3.svg" alt="" />
113
+ </div>
114
+ </div>
115
+
116
+ <div class="eight">
117
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
118
+ <circle cx="20" cy="20" r="20" />
119
+ </svg>
120
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
121
+ <circle cx="20" cy="20" r="20" />
122
+ </svg>
123
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
124
+ <circle cx="20" cy="20" r="20" />
125
+ </svg>
126
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
127
+ <circle cx="20" cy="20" r="20" />
128
+ </svg>
129
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
130
+ <circle cx="20" cy="20" r="20" />
131
+ </svg>
132
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
133
+ <circle cx="20" cy="20" r="20" />
134
+ </svg>
135
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
136
+ <circle cx="20" cy="20" r="20" />
137
+ </svg>
138
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
139
+ <circle cx="20" cy="20" r="20" />
140
+ </svg>
141
+ <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
142
+ <circle cx="20" cy="20" r="20" />
143
+ </svg>
144
+ </div>
145
+
146
+ <div class="nine">
147
+ <p>Okay, now come back and tell me if you liked it.</p>
148
+ <p id="replay">Or click, if you want to watch it again.</p>
149
+ <p class="last-smile">:)</p>
150
+ </div>
151
+ </div>
152
+
153
+ </body>
154
+ <!-- Greensock -->
155
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.5/gsap.min.js"></script>
156
+ <!-- Sweetalert -->
157
+ <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
158
+ <script type="application/javascript" src="./script/main.js"></script>
159
+
160
  </html>