-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
154 lines (139 loc) · 8.3 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
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
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/style.css">
<link rel="shortcut icon" href="img/qsmp.ico" type="image/x-icon">
<script src="https://kit.fontawesome.com/9ee9ecec42.js" crossorigin="anonymous"></script>
<title>QSMP</title>
</head>
<body>
<header class="qsmp__header">
<section class="qsmp__ad">
<p class="qsmp__ad__msj qsmp--lato">Risus adipiscing mauris cum non est enim a. Quis commodo sit sed lectus ac est.</p>
<button class="qsmp__button qsmp--press">SEE ANNOUNCEMENT ↗</button>
</section>
<section class="qsmp__counter qsmp--press">
<div class="digits">
<div class="qsmp__counter__digits">
<div class="digit" id="days">0</div>
<div class="digit" id="days2">9</div>
</div>
<p class="date qsmp--lato"> Days</p>
</div>
<div class="colon">:</div>
<div class="digits">
<div class="qsmp__counter__digits">
<div class="digit" id="hours">1</div>
<div class="digit" id="hours2">1</div>
</div>
<p class="date qsmp--lato"> Hours</p>
</div>
<div class="colon">:</div>
<div class="digits">
<div class="qsmp__counter__digits">
<div class="digit" id="minutes">2</div>
<div class="digit" id="minutes2">3</div>
</div>
<p class="date qsmp--lato"> Minutes</p>
</div>
<div class="colon">:</div>
<div class="digits">
<div class="qsmp__counter__digits">
<div class="digit" id="seconds">5</div>
<div class="digit" id="seconds2">8</div>
</div>
<p class="date qsmp--lato"> Seconds</p>
</div>
</section>
</header>
<main class="qsmp__main">
<h2 class="qsmp__title qsmp--press">MEMBERS OF THE SERVER</h2>
<section class="qsmp__creators">
<div class="qsmp__creator">
<div class="qsmp__creator__img">
<p class="qsmp__live qsmp--lato">LIVE</p>
<img src="img/quackity.png" alt="c!Quackity">
</div>
<div class="qsmp__creator__info qsmp--snow">
<p class="qsmp__name qsmp--lato">Quackity</p>
<img src="img/mx.jpg" alt="Mexico Flag">
</div>
<div class="qsmp__creator__buttons qsmp--snow">
<button class="qsmp__button--gray">☰</button>
<button class="qsmp__button qsmp--press" onclick="location.href='https://www.twitch.tv/quackity'">LIVE CHANNEL ↗</button>
</div>
</div>
<div class="qsmp__creator">
<div class="qsmp__creator__img">
<p class="qsmp__live qsmp--lato">LIVE</p>
<img src="img/im.png" alt="c!ironmouse">
</div>
<div class="qsmp__creator__info qsmp--snow">
<p class="qsmp__name qsmp--lato">ironmouse</p>
<img src="img/pr.png" alt="Puerto Rico's Flag">
</div>
<div class="qsmp__creator__buttons qsmp--snow">
<button class="qsmp__button--gray">☰</button>
<button class="qsmp__button qsmp--press" onclick="location.href='https://www.twitch.tv/ironmouse'">LIVE CHANNEL ↗</button>
</div>
</div>
<div class="qsmp__creator">
<div class="qsmp__creator__img">
<p class="qsmp__live qsmp--lato no-live">LIVE</p>
<img src="img/pac.png" alt="c!pactw">
</div>
<div class="qsmp__creator__info qsmp--snow">
<p class="qsmp__name qsmp--lato">Pac</p>
<img src="img/br.png" alt="Brazil's Flag">
</div>
<div class="qsmp__creator__buttons qsmp--snow">
<button class="qsmp__button--gray">☰</button>
<button class="qsmp__button qsmp--press" onclick="location.href='https://www.twitch.tv/peqitw'">LIVE CHANNEL ↗</button>
</div>
</div>
<div class="qsmp__creator">
<div class="qsmp__creator__img">
<p class="qsmp__live qsmp--lato no-live">LIVE</p>
<img src="img/bj.png" alt="c!BagheraJones">
</div>
<div class="qsmp__creator__info qsmp--snow">
<p class="qsmp__name qsmp--lato">BagheraJones</p>
<img src="img/sz.png" alt="Switzerland Flag">
</div>
<div class="qsmp__creator__buttons qsmp--snow">
<button class="qsmp__button--gray qsmp--press">☰</button>
<button class="qsmp__button qsmp--press" onclick="location.href='https://www.twitch.tv/bagherajones'">LIVE CHANNEL ↗</button>
</div>
</div>
</section>
</main>
<footer class="qsmp__footer">
<div class="qsmp__footer__info">
<p class="qsmp__footer__title qsmp--press">OFFICIAL <br>QSMP ACCOUNTS</p>
<p class="qsmp__footer__info qsmp--lato">
Nunc egestas urna ac orci vel sed erat. Sodales vel netus facilisi donec donec quis. Risus adipiscing mauris cum non est enim a. Quis commodo sit sed lectus ac est.
<br>
Amet lobortis eu malesuada penatibus aliquet nisi nec.
</p>
</div>
<div class="qsmp__footer__buttons">
<button onclick="location.href='https://www.instagram.com/qsmpreal'" class="qsmp__social qsmp--press"><i class="fa-brands fa-instagram" style="color: #e13d72;"></i> QSMP INSTAGRAM</button>
<button onclick="location.href='https://www.facebook.com/qsmpreal/'" class="qsmp__social qsmp--press"><i class="fa-brands fa-facebook-f" style="color: #183ac8;"></i> QSMP FACEBOOK</button>
<button onclick="location.href='https://www.reddit.com/r/Qsmp/'" class="qsmp__social qsmp--press"><i class="fa-brands fa-reddit" style="color: #d75307;"></i> R/QSMP</button>
<button onclick="location.href='https://www.reddit.com/user/QSMPReal/'" class="qsmp__social qsmp--press"><i class="fa-brands fa-reddit" style="color: #d75307;"></i> QSMPREAL REDDIT</button>
<button onclick="location.href='https://twitter.com/QuackityStudios'" class="qsmp__social qsmp--press"><i class="fa-brands fa-twitter" style="color: #54b7e9;"></i> QUACKITY STUDIOS</button>
<button onclick="location.href='https://twitter.com/QuackityMerchh'" class="qsmp__social qsmp--press"><i class="fa-brands fa-twitter" style="color: #54b7e9;"></i> QUACKITY MERCH</button>
<button onclick="location.href='https://twitter.com/QSMPGlobal'" class="qsmp__social qsmp--press"><i class="fa-brands fa-twitter" style="color: #54b7e9;"></i> QSMP GLOBAL</button>
<button onclick="location.href='https://twitter.com/QsmpEN'" class="qsmp__social qsmp--press"><i class="fa-brands fa-twitter" style="color: #54b7e9;"></i> QSMP ENGLISH</button>
<button onclick="location.href='https://twitter.com/QsmpES'" class="qsmp__social qsmp--press"><i class="fa-brands fa-twitter" style="color: #54b7e9;"></i> QSMP SPANISH</button>
<button onclick="location.href='https://twitter.com/QsmpPOR'" class="qsmp__social qsmp--press"><i class="fa-brands fa-twitter" style="color: #54b7e9;"></i> QSMP PORTUGUESE</button>
<button onclick="location.href='https://twitter.com/QsmpFRA'" class="qsmp__social qsmp--press"><i class="fa-brands fa-twitter" style="color: #54b7e9;"></i> QSMP FRENCH</button>
<button onclick="location.href='https://www.tiktok.com/@qsmpreal'" class="qsmp__social qsmp--press"><i class="fa-brands fa-tiktok" style="color: #0a0a0a;"></i> QSMP OFFICIAL</button>
</div>
</footer>
<script src="js/counter.js"></script>
</body>
</html>