-
Notifications
You must be signed in to change notification settings - Fork 0
/
main.html
138 lines (137 loc) · 5.79 KB
/
main.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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Donut Give Up</title>
<!-- favicon -->
<link
rel="apple-touch-icon"
sizes="180x180"
href="./assets/favicon/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="./assets/favicon/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="./assets/favicon/favicon-16x16.png"
/>
<link rel="manifest" href="./assets/favicon/site.webmanifest" />
<!-- fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=REM:ital,wght@0,300;0,400;0,800;0,900;1,400;1,500;1,600;1,700&display=swap"
rel="stylesheet"
/>
<!-- reset css -->
<link rel="stylesheet" href="./assets/css/reset.css" />
<!-- bootstrap -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css"
/>
<!-- stylecss -->
<link rel="stylesheet" href="./assets/css/style.css" />
</head>
<body>
<header
class="d-flex flex-wrap justify-content-center py-3 mb-4 border-bottom container"
>
<a
href="/"
class="d-flex align-items-center mb-3 mb-md-0 me-md-auto link-body-emphasis text-decoration-none"
>
<img
src="./assets/img/logo.jpg"
alt=""
class="bi me-2"
width="70"
/>
<span class="fs-1 heading">Donut give up</span>
<img
src="./assets/img/logo.jpg"
alt=""
class="bi me-2"
width="70"
/>
</a>
<div class="rightSide">
<div class="pointArea">
<p class="score">0</p>
<p class="label">Points</p>
</div>
</div>
</header>
<main>
<div class="playScreen container"></div>
</main>
<footer class="">
<div class="container">
<div class="boxContent">
<div class="leftSide">
<div class="btn btnSkip button-86" onclick="giveUp()">Bỏ qua</div>
<div class="noti">
<p class="heading F">Đáp án đúng phải là:</p>
<p class="desc F correctAns">
Lorem ipsum, dolor sit amet consectetur
adipisicing elit. Atque esse animi
</p>
<p class="heading T">Bạn làm tốt lắm</p>
<p class="desc T">
hãy giữ vững phong độ ở những câu tiếp theo nhé
</p>
</div>
</div>
<div class="rightSide">
<div class="btn btnCheck" onclick="checkAns()">
Kiểm tra
</div>
<div class="btn btnContinues" onclick="game1();">
Tiếp tục
</div>
</div>
</div>
</div>
</footer>
<div class="loading">
<div class="loading-container">
<div class="loading-text">
<span>L</span>
<span>O</span>
<span>A</span>
<span>D</span>
<span>I</span>
<span>N</span>
<span>G</span>
</div>
</div>
<div class="socials">
<a class="social-link" href="https://twitter.com/aybukeceylan" target="_top">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-twitter">
<path d="M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2c9 5 20 0 20-11.5a4.5 4.5 0 00-.08-.83A7.72 7.72 0 0023 3z"/>
</svg>
</a>
<a class="social-link" href="https://www.linkedin.com/in/ayb%C3%BCkeceylan/" target="_top">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-linkedin"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect x="2" y="9" width="4" height="12"/><circle cx="4" cy="4" r="2"/></svg>
</a>
</div>
</div>
<div class="notSpAre">
<div class="desc">
New version will be updated soon
</div>
<img src="./assets/img/notsupport.png" alt="" class="img" />
<div class="desc">Sorry, we do not support this device</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"></script>
<script src="./assets/JS/database.js"></script>
<script src="./assets/JS/app.js"></script>
</body>
</html>