-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
258 lines (245 loc) · 11.9 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
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
<!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" />
<meta
name="description"
content="A YouTube Channel that uploads and edits the best fight scenes and unforgettable moments in the Dragonball anime. His edits were loved by fans that now he is the biggest Goku shorts YouTuber with over 270k subscribers."
/>
<meta name="robots" content="index,follow" />
<title>Home | Saiyan Blue</title>
<link rel="icon" href="./images/pfp.jpg" />
<!-- google fonts, font awesome, css -->
<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=Work+Sans:wght@400;900&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" />
<link rel="stylesheet" href="style.css" />
<script src="script.js" defer></script>
</head>
<body>
<header class="outline-r big-nav" id="top">
<div class="big-nav__container navalign">
<button class="nav-toggle" aria-label="open navigation">
<i class="fa-solid fa-bars"></i>
</button>
<a href="index.html" class="logo">
<img src="./images/pfp round.png" class="logo__img" alt="saiyan blue" />
<h1 class="logo__text">SB</h1>
</a>
<nav class="nav">
<ul class="nav__list nav__list--primary">
<li class="nav__item"><a href="index.html" class="nav__link">Home</a></li>
<li class="nav__item"><a href="./sponsor.html" class="nav__link">Sponsor</a></li>
<li class="nav__item"><a href="./aboutme.html" class="nav__link">About me</a></li>
</ul>
</nav>
<ul class="nav__list nav__list--secondary">
<li class="nav__item">
<a href="https://www.youtube.com/channel/UCnYGtcI8kosvwPhv0kmSarA" class="nav__link--yt" target="_blank"><i class="fa-brands fa-youtube"></i></a>
</li>
<li class="nav__item">
<a href="https://discord.com/invite/2jtXTASs" class="nav__link--discord" target="_blank"><i class="fa-brands fa-discord"></i></a>
</li>
</ul>
</div>
</header>
<main>
<section class="hero">
<div class="container hero_ctn">
<div class="hero_text">
<h1 class="hero_title">Saiyan Blue</h1>
<img src="./images/ssjblue.svg" class="ssjmob" alt="" />
<p>A YouTube Channel that uploads and edits the best fight scenes and funny moments in the Dragonball anime. His edits were loved by fans that now he is the biggest Goku shorts YouTuber with over 270k subscribers.</p>
<a href="https://www.youtube.com/channel/UCnYGtcI8kosvwPhv0kmSarA" class="button hero_btn" target="_blank">Visit Channel <i class="fa-solid fa-arrow-up-right-from-square"></i></a>
</div>
<img src="./images/ssjblue.svg" class="ssjdesk" alt="" />
</div>
</section>
<section class="topvideos" id="topvideos">
<header class="videoshead">
<h1>Top Videos</h1>
</header>
<div class="container videos">
<div class="videos_card">
<h2>
<a href="https://www.youtube.com/shorts/s_8zAXxwVDM" target="_blank"> <img src="./images/youtube-shorts-icon.jpg" alt="open in yt shorts" class="yt-shorts" /> Limit-Breaking Power</a>
</h2>
<hr />
<video controls muted loop>
<source src="./videos/gokulimit.mp4" type="video/mp4" />
Sorry, your browser doesn't support HTML5 videos.
</video>
<div class="likeview">
<div class="likeview_container">
<a class="likes lv" href="https://www.youtube.com/shorts/s_8zAXxwVDM" target="_blank">
<i class="fa-solid fa-thumbs-up"></i>
<p>211K</p>
</a>
<a class="views lv" href="https://www.youtube.com/shorts/s_8zAXxwVDM" target="_blank">
<i class="fas fa-eye"></i>
<p>2M</p>
</a>
</div>
</div>
</div>
<div class="videos_card">
<h2>
<a href="https://www.youtube.com/shorts/0sCpZyG7Dm8" target="_blank"> <img src="./images/youtube-shorts-icon.jpg" alt="open in yt shorts" class="yt-shorts" /> Goku Vs Buu</a>
</h2>
<hr />
<video controls muted loop>
<source src="./videos/gokuvspink.mp4" type="video/mp4" />
Sorry, your browser doesn't support HTML5 videos.
</video>
<div class="likeview">
<div class="likeview_container">
<a class="likes lv" href="https://www.youtube.com/shorts/0sCpZyG7Dm8" target="_blank">
<i class="fa-solid fa-thumbs-up"></i>
<p>418K</p>
</a>
<a class="views lv" href="https://www.youtube.com/shorts/0sCpZyG7Dm8" target="_blank">
<i class="fas fa-eye"></i>
<p>8M</p>
</a>
</div>
</div>
</div>
<div class="videos_card">
<h2>
<a href="https://www.youtube.com/shorts/0sCpZyG7Dm8" target="_blank"> <img src="./images/youtube-shorts-icon.jpg" alt="open in yt shorts" class="yt-shorts" /> Breaking the Z-sword</a>
</h2>
<hr />
<video controls muted loop>
<source src="./videos/sword.mp4" type="video/mp4" />
Sorry, your browser doesn't support HTML5 videos.
</video>
<div class="likeview">
<div class="likeview_container">
<a class="likes lv" href="https://www.youtube.com/shorts/0sCpZyG7Dm8" target="_blank">
<i class="fa-solid fa-thumbs-up"></i>
<p>451K</p>
</a>
<a class="views lv" href="https://www.youtube.com/shorts/0sCpZyG7Dm8" target="_blank">
<i class="fas fa-eye"></i>
<p>5M</p>
</a>
</div>
</div>
</div>
<div class="videos_card">
<h2>
<a href="https://youtu.be/n42AgdYpnjI" target="_blank"> <img src="./images/youtube-shorts-icon.jpg" alt="open in yt shorts" class="yt-shorts" /> Vegeta Saves Goku</a>
</h2>
<hr />
<video controls muted loop>
<source src="./videos/vegetasavesgoku.mp4" type="video/mp4" />
Sorry, your browser doesn't support HTML5 videos.
</video>
<div class="likeview">
<div class="likeview_container">
<a class="likes lv" href="https://youtu.be/n42AgdYpnjI" target="_blank">
<i class="fa-solid fa-thumbs-up"></i>
<p>224K</p>
</a>
<a class="views lv" href="https://youtu.be/n42AgdYpnjI" target="_blank">
<i class="fas fa-eye"></i>
<p>2M</p>
</a>
</div>
</div>
</div>
</div>
</section>
<section id="teamup">
<header>
<h1>Team Up</h1>
</header>
<div class="team_up container">
<div class="collab team_up_card">
<h2>Collaboration</h2>
<hr />
<p>The Saiyan Blue channel is open to collaborations. So if you are interested in working together don’t hesitate to contact me through my discord server, or email.</p>
<div>
<a href="https://discord.com/invite/2jtXTASs" class="button collab_button" id="loose_button" target="_blank"><i class="fab fa-discord"></i> Join Our Discord</a>
</div>
</div>
<div class="sponsor team_up_card">
<h2>Sponsorships</h2>
<hr />
<p>
The contents in the Saiyan Blue channel have been loved by hundreds of thousands of people around the world. Until now, the channel has collected more than 270K subs and 180 MILLION views! So promotions like apps or websites
will be ...
</p>
<div>
<a href="sponsor.html" class="button collab_button">Learn More</a>
<a href="https://mail.google.com/mail/?view=cm&fs=1&[email protected]" target="_blank" class="button collab_button"><i class="fa-solid fa-envelope"></i> Email Us</a>
</div>
</div>
<div class="ideas team_up_card">
<h2>Ideas</h2>
<hr />
<p>In a hurry? You can drop a quick idea in the form bellow :)</p>
<!-- FORM SPREE -->
<form action="https://formspree.io/f/mjvzvjjz" method="POST">
<div class="form_email">
<label for="name">Name:</label>
<input type="text" name="name" placeholder="Saiyan Blue" required />
</div>
<div class="form_email">
<label for="email">Email:</label>
<input type="email" name="email" placeholder="[email protected]" required />
</div>
<div class="form_email">
<label for="message">Message:</label>
<textarea name="message" placeholder="Use better music pls, love your videos btw :)" required></textarea>
</div>
<button type="submit" class="collab_button" id="loose_button"><i class="fa fa-paper-plane" aria-hidden="true"></i> Send Message</button>
</form>
</div>
</div>
</section>
</main>
<footer>
<div class="footer container">
<div class="footer_sb footer_part">
<a href="index.html" class="logo">
<img src="./images/pfp round.png" class="logo__img" alt="saiyan blue" />
<h1 class="logo__text">SB</h1>
</a>
<div class="footer_medias">
<a href="https://www.youtube.com/channel/UCnYGtcI8kosvwPhv0kmSarA" class="link nav__link--yt" target="_blank"><i class="fa-brands fa-youtube"></i></a>
<a href="https://discord.com/invite/2jtXTASs" class="link nav__link--discord" target="_blank"><i class="fa-brands fa-discord"></i></a>
<a href="https://www.buymeacoffee.com/saiyanblue" class="link nav__link--coffee" target="_blank"><i class="fa-solid fa-mug-saucer"></i></a>
</div>
</div>
<div class="footer_part">
<div class="footer_link text-center">
<h3>About</h3>
<h3 class="footer_link_links"><a href="index.html#topvideos">Top Videos</a></h3>
<h3 class="footer_link_links"><a href="aboutme.html">About Me</a></h3>
</div>
<div class="footer_link text-center">
<h3>Support</h3>
<h3 class="footer_link_links"><a href="index.html#teamup">Team Up</a></h3>
<h3 class="footer_link_links footer_sponsor"><a href="sponsor.html">Sponsor</a></h3>
</div>
</div>
<div class="footer_part">
<p class="text-center">
Find an issue with this page? Fix it on <a href="https://github.com/1232678/SAIYAN-BLUE" style="text-decoration: underline" target="_blank">Github<i class="fas fa-external-link-alt"></i></a>
</p>
<p class="text-center developed">
Website Developed By <a href="https://twitter.com/Ivana679411343" style="text-decoration: underline" target="_blank">@Ivana679411343<i class="fa-brands fa-twitter"></i></a>
</p>
</div>
</div>
<a href="#top" class="gotop"><i class="fa-solid fa-arrow-up"></i></a>
</footer>
<div id="copyright">
<p class="text-center">Copyright © <span class="copyright"></span> Saiyan Blue All rights reserved</p>
</div>
</body>
</html>