-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
127 lines (122 loc) · 6.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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name = "description" content = "Portfolio website of Jonas de Bruin including a lot of his projects.">
<meta property = "title" content = "Jonas de Bruin">
<meta property = "type" content = "website">
<meta name="theme-color" content="#000000">
<title>Jonas de Bruin</title>
<link ref="preconnect" href="https://fonts.gstatic.com">
<link ref="preconnect" href="https://ka-f.fontawesome.com">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
<link href="./style/mainStyle.css" rel="stylesheet">
<script src="https://kit.fontawesome.com/1c6bb06309.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Anonymous+Pro">
<link rel="icon" href="/images/icon.jpg">
<script src="./javascripts/main.js"></script>
<script src="./javascripts/typeWriter.js"></script>
</head>
<body >
<div id="navbar-container"></div>
<div class="fullPage fadeInLong">
<h2 id="mainText"></h2>
</div>
<h1 class="accentColor underScreen">↓ Check out my projects below ↓</h1>
<div class="container fadeInLong underSpotlight">
<div class="row text-center underScreen">
<div class="col-lg-6">
<div class="row text-center project-block">
<div class="col-sm-4 mainColorBgBright">
<b>Róka</b> was a school project where we had to make a game with 2 developers and 3 designers. We created a boss fight game with a chase part and a fight part. The game is now also playable on itch.io.
</div>
<div class="col-sm-8"><br>
<img alt="Róka Thumbnail" class="projectBox" src="../images/RókaThumbnail.png"><br>
<a href="../pages/projectPages/projectRóka.html"><button class="projectBtn"><h6>More Info</h6></button></a>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="row text-center project-block">
<div class="col-sm-4 mainColorBgBright">
<b>Internship CrescentOne</b> is an internship I finshed doing in the third year of my software development study. Here I worked a lot with NodeJS, Git, and general programming skills.
</div>
<div class="col-sm-8"><br>
<img alt="CrescentOne Thumbnail" class="projectBox" src="../images/CrescentOneThumbnail.png"><br>
<a href="../pages/projectPages/projectInternship.html"><button class="projectBtn"><h6>More Info</h6></button></a>
</div>
</div>
</div>
<div class="row">
<div class="col-12"><br><br></div>
</div>
<div class="row text-center"></div>
<div class="col-lg-6">
<div class="row text-center project-block">
<div class="col-sm-4 mainColorBgBright">
<b>Stellar Engine</b> is an 3D game engine in OpenGl and C++ I'm working on with a school mate. In this project I learned a lot about rendering and C++, learning every time I work on this project.
</div>
<div class="col-sm-8"><br>
<img alt="Adventure Game Thumbnail" class="projectBox" src="../images/OpenGLThumbnail.png"><br>
<a href="../pages/projectPages/ProjectStellar.html"><button class="projectBtn"><h6>More Info</h6></button></a>
</div>
</div><br>
</div>
<div class="col-lg-6">
<div class="row text-center project-block">
<div class="col-sm-4 mainColorBgBright">
<b>Mouse Game</b> was my final exam of my Software Development study on SintLucas. It's a game made with the SFML framework in C++. This is my largest project to date and came with a lot of challenges.
</div>
<div class="col-sm-8"><br>
<img alt="MouseGame thumbnail" class="projectBox" src="../images/MouseGameThumbnail.png"><br>
<a href="../pages/projectPages/projectMouseGame.html"><button class="projectBtn"><h6>More Info</h6></button></a>
</div>
</div>
</div>
<div class="row text-center no-margin">
<div class="col-12"><br>
<a href="pages/projects.html"><button class="bigButton"><h6>Check out all my projects</h6></button></a><br>
</div>
<div class="row">
<div class="col-12"><br><br></div>
</div>
<div class="row">
<div class="col-12"><br><br></div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col text-center">
<h1 class="accentColor ">↓ I make music too, check out my latest songs here ↓</h1>
<hr>
</div>
</div>
<div class="row">
<div class="col">
<iframe style="border-radius:12px" src="https://open.spotify.com/embed/track/45Y3rc7JXnUsf76kKrFYn4?utm_source=generator" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</div>
</div>
<div class="row">
<div class="col">
<iframe title="The River by Jonesy B" style="border-radius:12px" src="https://open.spotify.com/embed/track/2AnzkdjfcBMSxGo6oJN5OQ?utm_source=generator" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</div>
</div>
<div class="row">
<div class="col">
<iframe title="Calm Adventure by Jonesy B and Javiere Inniss" style="border-radius:12px" src="https://open.spotify.com/embed/track/6FPzMxeEKKcfgRDEPw8RHO?utm_source=generator" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</div>
</div>
<div class="row">
<div class="col">
<iframe title="Memory of a Dream by Javiere Inniss and Jonesy B" style="border-radius:12px" src="https://open.spotify.com/embed/track/4Vs5F2EA4rBE3oTtLjw1ew?utm_source=generator" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</div>
</div>
<div class="row">
<div class="col-12"><br><br></div>
</div>
</div>
<script src="/javascript/main.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
</body>
</html>