Skip to content

Commit f90f37b

Browse files
jonasvanleeuwen19jonasvanleeuwen19
authored
New Files for Website
0 parents  commit f90f37b

21 files changed

+8579
-0
lines changed

‎about_shapes.png‎

14.5 KB
Loading

‎animation.js‎

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎banner.jpg‎

111 KB
Loading

‎banner_shape.png‎

49.1 KB
Loading

‎bootstrap.min.css‎

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎font-awesome-pro.css‎

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎icon.png‎

194 KB
Loading

‎index.html‎

Lines changed: 305 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,305 @@
1+
<!DOCTYPE html><html lang="en"><head>
2+
<meta charset="UTF-8">
3+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, minimum-scale=1, target-densitydpi=device-dpi">
4+
<title>Jonasvanleeuwen19</title>
5+
<link rel="icon" type="image/png" href="icon.png">
6+
<link rel="stylesheet" href="font-awesome-pro.css">
7+
<link rel="stylesheet" href="bootstrap.min.css">
8+
<link rel="stylesheet" href="scroll_button.css">
9+
<link rel="stylesheet" href="plugin.css">
10+
<link rel="stylesheet" href="spacing.css">
11+
<link rel="stylesheet" href="style.css">
12+
<link rel="stylesheet" href="responsive.css">
13+
<link rel="stylesheet" href="http://yixgames.nl.eu.org/yixboost/assets/font-awesome-6-pro-main/css/all.css">
14+
</head>
15+
16+
<body>
17+
<!--================================
18+
PRELOADER START
19+
=================================-->
20+
<div class="preloader">
21+
<svg viewBox="0 0 1000 1000" preserveAspectRatio="none">
22+
<path id="svg" d="M0,1005S175,995,500,995s500,5,500,5V0H0Z"></path>
23+
</svg>
24+
<h5 class="preloader-text">Loading</h5>
25+
</div>
26+
<!--================================
27+
PRELOADER END
28+
=================================-->
29+
<!--================================
30+
MENU START
31+
=================================-->
32+
<nav class="navbar navbar-expand-lg main_menu">
33+
<div class="container main_menu_bg">
34+
<a class="navbar-brand" href="index.html">
35+
<img src="jonasvanleeuwen19.png" alt="Jonasvanleeuwen19" class="img-fluid w-100">
36+
</a>
37+
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
38+
<i class="fa-sharp fa-regular fa-bars bar_icon"></i>
39+
<i class="fa-regular fa-xmark close_icon"></i>
40+
</button>
41+
<div class="collapse navbar-collapse" id="navbarNav">
42+
<ul class="navbar-nav m-auto">
43+
<li class="nav-item">
44+
<a class="nav-link text_hover_animaiton" href="#about">about me</a>
45+
</li>
46+
<li class="nav-item">
47+
<a class="nav-link text_hover_animaiton" href="https://github.com/jonasvanleeuwen19" target="_blank">Github
48+
</a>
49+
</li>
50+
<li class="nav-item">
51+
<a class="nav-link text_hover_animaiton" href="http://yixboost.nl.eu.org" target="_blank">Yixboost Games
52+
</a>
53+
</li>
54+
</ul>
55+
</div>
56+
</div>
57+
</nav>
58+
59+
<!--================================
60+
BANNER START
61+
=================================-->
62+
<section class="tf__banner banner" style="background: url(banner.jpg)">
63+
<div class="container">
64+
<div class="row justify-content-between">
65+
<div class="col-xl-6 col-lg-8">
66+
<div class="tf__banner_text">
67+
<h1>
68+
Hi, I'm Jonas! Creative
69+
<span class="cd-headline rotate-1">
70+
<!-- ANIMATE TEXT VALUES: zoom, rotate-1, letters type, letters rotate-2, loading-bar, slide, clip, letters rotate-3, letters scale, push, -->
71+
<span class="cd-words-wrapper">
72+
<b class="is-visible">Designer</b>
73+
<b>Coder</b>
74+
<b>Player</b>
75+
<b>Linux User</b>
76+
</span>
77+
</span>
78+
</h1>
79+
<ul>
80+
<li>
81+
<a class="common_btn" href="#about">About me</a>
82+
</li>
83+
</ul>
84+
</div>
85+
</div>
86+
<div class="col-xl-5 col-lg-4">
87+
<div class="tf__banner_img">
88+
<div class="img">
89+
<img src="jonasvanleeuwen19.png" alt="Jonasvanleeuwen19" class="img-fluid w-100">
90+
</div>
91+
</div>
92+
</div>
93+
</div>
94+
</div>
95+
</section>
96+
<!--================================
97+
BANNER END
98+
=================================-->
99+
100+
<!--================================
101+
ABOUT START
102+
=================================-->
103+
<section class="tf__about pt_140 xs_pt_80" id="about">
104+
<div class="container">
105+
<div class="row justify-content-between">
106+
<div class="col-xxl-7 col-lg-6 col-xl-6">
107+
<div class="tf__section_heading pb_80 xs_pb_50">
108+
<h5 class="has-animation">About Me</h5>
109+
<h2 class="has-animation">
110+
Programming, coding, design
111+
</h2>
112+
</div>
113+
<div class="tf__about_text">
114+
<p>
115+
I’m a 14-year-old programmer from the Netherlands, skilled in HTML, CSS, and JavaScript, and a Linux user. My main project is Yixboost Games, a gaming website where I share my passion for coding and gaming. Always eager to learn more!
116+
</p>
117+
</div>
118+
</div>
119+
<div class="col-xxl-4 col-lg-6 col-xl-6">
120+
<div class="tf__about_img fade_right" data-trigerid="about">
121+
<img src="right.png" alt="Jonasvanleeuwen19" class="img-fluid w-100">
122+
</div>
123+
</div>
124+
</div>
125+
</div>
126+
</section>
127+
<!--================================
128+
ABOUT END
129+
=================================-->
130+
131+
132+
<!--================================
133+
SKILLS START
134+
=================================-->
135+
<section class="tf__skills pt_115 xs_pt_75 pb_70 xs_pb_30" id="skills">
136+
<div class="container">
137+
<div class="row">
138+
<div class="col-xl-10 col-lg-8 m-auto mb_60">
139+
<div class="tf__section_heading mb_40">
140+
<h5 class="has-animation">Education &amp; Skill</h5>
141+
142+
</div>
143+
<div class="row">
144+
<div class="col-xl-6 col-lg-6">
145+
<div class="tf__team_skills_bar_single fade_bottom" data-trigerid="skills" data-stagger=".25">
146+
<p>HTML</p>
147+
<div id="bar1" class="barfiller">
148+
<div class="tipWrap">
149+
<span class="tip"></span>
150+
</div>
151+
<span class="fill" data-percentage="100"></span>
152+
</div>
153+
</div>
154+
</div>
155+
<div class="col-xl-6 col-lg-6">
156+
<div class="tf__team_skills_bar_single fade_bottom" data-trigerid="skills" data-stagger=".25">
157+
<p>CSS</p>
158+
<div id="bar2" class="barfiller">
159+
<div class="tipWrap">
160+
<span class="tip"></span>
161+
</div>
162+
<span class="fill" data-percentage="90"></span>
163+
</div>
164+
</div>
165+
</div>
166+
<div class="col-xl-6 col-lg-6">
167+
<div class="tf__team_skills_bar_single fade_bottom" data-trigerid="skills" data-stagger=".25">
168+
<p>PHP</p>
169+
<div id="bar3" class="barfiller">
170+
<div class="tipWrap">
171+
<span class="tip"></span>
172+
</div>
173+
<span class="fill" data-percentage="65"></span>
174+
</div>
175+
</div>
176+
</div>
177+
<div class="col-xl-6 col-lg-6">
178+
<div class="tf__team_skills_bar_single fade_bottom" data-trigerid="skills" data-stagger=".25">
179+
<p>Javascript</p>
180+
<div id="bar4" class="barfiller">
181+
<div class="tipWrap">
182+
<span class="tip"></span>
183+
</div>
184+
<span class="fill" data-percentage="50"></span>
185+
</div>
186+
</div>
187+
</div>
188+
<div class="col-xl-6 col-lg-6">
189+
<div class="tf__team_skills_bar_single fade_bottom" data-trigerid="skills" data-stagger=".25">
190+
<p>Linux</p>
191+
<div id="bar5" class="barfiller">
192+
<div class="tipWrap">
193+
<span class="tip"></span>
194+
</div>
195+
<span class="fill" data-percentage="60"></span>
196+
</div>
197+
</div>
198+
</div>
199+
<div class="col-xl-6 col-lg-6">
200+
<div class="tf__team_skills_bar_single fade_bottom" data-trigerid="skills" data-stagger=".25">
201+
<p>Python</p>
202+
<div id="bar6" class="barfiller">
203+
<div class="tipWrap">
204+
<span class="tip"></span>
205+
</div>
206+
<span class="fill" data-percentage="60"></span>
207+
</div>
208+
</div>
209+
</div>
210+
</div>
211+
</div>
212+
</section>
213+
<!--================================
214+
SKILLS END
215+
=================================-->
216+
217+
<!--================================
218+
BRAND START
219+
=================================-->
220+
<div class="tf__brand mt_120 xs_mt_80">
221+
<div class="row">
222+
<div class="col-12">
223+
<div class="marquee_animi">
224+
<ul>
225+
<li>* PHP</li>
226+
<li>* HTML</li>
227+
<li>* CSS</li>
228+
<li>* Design</li>
229+
<li>* Development</li>
230+
<li>* Coding</li>
231+
<li>* Programming</li>
232+
</ul>
233+
</div>
234+
</div>
235+
</div>
236+
</div>
237+
<!--================================
238+
BRAND END
239+
=================================-->
240+
241+
242+
243+
<!--================================
244+
FOOTER START
245+
=================================-->
246+
<footer class="footer" id="footer">
247+
<div class="footer-container">
248+
<div class="pt_120 xs_pt_80 sm_pt_80">
249+
<div class="container">
250+
<div class="row">
251+
<div class="col-12">
252+
<div class="tf__footer_copyright">
253+
<p>© Yixboost NL 2024 | All Rights Reserved</p>
254+
<ul>
255+
<li>
256+
<a href="http://yixboost.nl.eu.org" target='_blank' class="text_hover_animaiton">Yixboost Games</a>
257+
</li>
258+
<li>
259+
<a href="http://yixboost.nl.eu.org/yixboost/privacy" target="_blank" class="text_hover_animaiton">Privacy Policy</a>
260+
</li>
261+
</ul>
262+
</div>
263+
</div>
264+
</div>
265+
</div>
266+
</div>
267+
</div>
268+
</footer>
269+
<!--================================
270+
FOOTER END
271+
=================================-->
272+
<!--================================
273+
SCROLL BUTTON START
274+
=================================-->
275+
<div class="progress active c-pointer">
276+
<svg class="progress-svg" width="100%" height="100%" viewBox="-1 -1 102 102">
277+
<path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"></path>
278+
</svg>
279+
</div>
280+
<!--================================
281+
SCROLL BUTTON END
282+
=================================-->
283+
284+
<!--================================
285+
CURSOR START
286+
=================================-->
287+
<div id="magic-cursor">
288+
<div id="ball"></div>
289+
</div>
290+
<!--================================
291+
CURSOR END
292+
=================================-->
293+
294+
<script src="plugin.js"></script>
295+
<!--scroll button js-->
296+
<script src="scroll_button.js"></script>
297+
<!--sticky sidebar js-->
298+
<script src="sticky_sidebar.js"></script>
299+
<!-- Animation -->
300+
<script src="animation.js"></script>
301+
<!--main/custom js-->
302+
<script src="main.js"></script>
303+
304+
305+
</body></html>

‎jonasvanleeuwen19.jpg‎

32 KB
Loading

‎jonasvanleeuwen19.png‎

112 KB
Loading

0 commit comments

Comments
 (0)