-
Notifications
You must be signed in to change notification settings - Fork 0
/
profile.html
165 lines (154 loc) · 7.76 KB
/
profile.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Alex Spelt - Profiel</title>
<script src="https://kit.fontawesome.com/4a15f33b55.js"></script>
<link rel="stylesheet" href="style/bootstrap.css">
<link rel="stylesheet" href="style/reboot.css">
</head>
<body>
<nav class="navbar navbar-expand-sm navbar-dark bg-primary">
<div class="container">
<a class="navbar-brand" href="#">Alex Spelt</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample03"
aria-controls="navbarsExample03" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarsExample03">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="./index.html">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a href="./game/" class="nav-link">Game</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="#">Profiel</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./motivatie.html">Motivatie</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./beroepsbeeld.html">Beroepsbeeld</a>
</li>
<li class="nav-item">
<a href="./dashboard.html" class="nav-link">Dashboard</a>
</li>
<li class="nav-item">
<a href="https://www.linkedin.com/in/alexspelt/" class="nav-link active"><i
class="fab fa-linkedin"></i></a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container">
</div>
<div class="container-fluid p-0">
<div class="row">
<div class="col-12 d-block d-md-none">
<div class="w-100" style="background-image: url('https://www.zalig-zeeland.com/wp-content/uploads/De-mossel-aan-de-haven-4.jpg'); background-size: cover; height: 200px; background-position: center;">
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-12 py-4">
<h3 class="text-center text-uppercase pt-2 text-dark">Profiel</h3>
</div>
<div class="col-12 col-md-6 p-2 bg-white d-flex align-items-center">
<p class="text-center">
Ik ben 18 en woon in Bruinisse. Of hoe we het daar noemen 'Bru'. In het weekend doe ik een biertje met mijn vrienden en besteed ik mijn tijd aan de scouting. <br>
<br>
Ik werk voor het IT bedrijf <a href="https://www.sflex.nl/Home/Content/Start/Omschrijving" style="text-decoration: underline;">Sflex Sign Software</a>. Bij Sflex specialiseren wij ons in het maken van software voor sign make bedrijven.
We hebben één van de krachtigste sign make systemen ondersteunt door <a href="https://www.esko.com/en/products/automation-engine/features" style="text-decoration: underline;">automation engine van esko</a>.
</p>
</div>
<div class="col-6 d-none d-md-block">
<img src="https://www.zalig-zeeland.com/wp-content/uploads/De-mossel-aan-de-haven-4.jpg" alt="" class="mb-3" style="width: 100%;">
</div>
</div>
</div>
<div class="container py-4">
<h3 class="text-center text-uppercase">Hobby's</h3>
</div>
<div>
<div class="container">
<div class="row">
<div class="col-sm-6 col-12">
<img src="https://alexspelt.nl/img/scouting.jpg" alt="" class="mb-3" style="width: 100%;">
</div>
<div class="col-sm-6 col-12 px-2 d-flex align-items-center">
<p>
Een groot deel van mijn vrije tijd gaat op aan de scouting. Ik ben leidinggevende bij
de verkenners (11-15 jaar oud). Voor de rest ben ik ook lid als rover. Dat is voor je jongvolwassen
scouts.
</p>
</div>
</div>
</div>
</div>
<div>
<div class="container">
<div class="row">
<div class="col-sm-6 col-12 my-4 px-2 align-items-center d-none d-sm-flex">
<p>
3d printen is één van mijn hobby's. Ik ben begonnen met een echte hobby printer (zelf bouw pakket) waar je alles aan
moest doen. Ik heb bij die printer veel aan de software en hardware moeten werken. Dat vind ik super leuk. Ik heb inmiddels
een andere betere printer die niet uit elkaar valt elke 3 seconde.
</p>
</div>
<div class="col-sm-6 col-12 ">
<img src="https://alexspelt.nl/img/3dprinter.jpg" alt="" class="mb-3" style="width: 100%;">
</div>
<div class="col-sm-6 col-12 my-4 px-2 align-items-center d-flex d-sm-none">
<p>
3d printen is één van mijn hobby's. Ik ben begonnen met een echte hobby printer (zelf bouw pakket) waar je alles aan
moest doen. Ik heb bij die printer veel aan de software en hardware moeten werken. Dat vind ik super leuk. Ik heb inmiddels
een andere betere printer die niet uit elkaar valt elke 3 seconde.
</p>
</div>
</div>
</div>
</div>
<div class="container py-3">
<div class="row pt-3">
<div class="col-12">
<h3 class="text-center text-uppercase mb-3">Mijn Kenmerken</h3>
<table class="table">
<thead class="thead-dark">
<th>Pros</th>
<th>Cons</th>
</thead>
<tbody>
<tr>
<td>Ik kan me goed concentreren</td>
<td>Soms concentreer ik me zo hard dat ik helemaal in mijn eigen wereld ben. ik raak al mijn besef van tijd kwijt.</td>
</tr>
<tr>
<td>Zelfstudie is voor mij geen probleem</td>
<td>Als ik iets niet gelijk doe. Ga ik het uitstellen.</td>
</tr>
<tr>
<td>Initiatief nement</td>
<td>Een beetje een control freak</td>
</tr>
<tr>
<td>Ik ben een doorzetter. <small>(Ik geef het niet op tot dat ik 2 dagen met een bug bezig
bent.)</small></td>
<td>Ik kan behoorlijk eigenwijs zijn.</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
</body>
</html>