-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
98 lines (93 loc) · 5.32 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
<!doctype html>
<html lang="nl">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Schooltrui VSZ</title>
<meta name="description" content="Schooltrui van de VSZ (Vrijeschool Zutphen), hier te koop!">
<link rel="icon" href="grijs-achterkant.png">
<link rel="preconnect" href="https://cdn.jsdelivr.net">
<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=Open+Sans&display=swap" rel="stylesheet">
<!-- Open-Graph Meta Tags -->
<meta property="og:description"
content="Schooltrui van de VSZ (Vrijeschool Zutphen), hier te koop!">
<meta property="og:image" content="https://schooltrui.nl/open-graph.png">
<meta property="og:title" content="Schooltrui VSZ">
<meta property="og:type" content="website">
<meta property="og:url" content="https://schooltrui.nl">
<!-- Twitter Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:description"
content="Schooltrui van de VSZ (Vrijeschool Zutphen), hier te koop!">
<meta name="twitter:image" content="https://schooltrui.nl/open-graph.png">
<meta name="twitter:title" content="Schooltrui VSZ">
<meta property="twitter:domain" content="schooltrui.nl">
<meta property="twitter:url" content="https://schooltrui.nl">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css"
integrity="sha256-rTpdO0HXBCNpreAHcu6tB2Ppg515Vo+5GtYSsnNLz+8=" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bulma-carousel.min.js"
integrity="sha256-qKR77yzVBkDYKuoSg2BpAIbMtmF8aFjuTHFVnIjkpzI=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bulma-carousel.min.css"
integrity="sha256-nVhrDZU/ne3I/z6LXWEbyUOEmv79sPGKEbsP7SWLkHI=" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
</head>
<body>
<main class="hero is-medium container">
<section class="hero-body columns">
<div class="hero-image column is-half container has-text-centered carousel carousel-inactive">
<figure class="item-1 image"><img alt="Schooltrui VSZ" src="img/schooltrui-2.png"></figure>
<figure class="item-2 image"><img alt="Schooltrui VSZ" src="img/schooltrui-3.png"></figure>
<figure class="item-3 image"><img alt="Schooltrui VSZ" src="img/schooltrui-4.png"></figure>
<figure class="item-4 image"><img alt="Schooltrui VSZ" src="img/schooltrui-5.png"></figure>
<figure class="item-5 image"><img alt="Schooltrui VSZ" src="img/schooltrui-1.png"></figure>
</div>
<div class="hero-info column is-half container">
<h1 class="title has-text-left is-1">Schooltrui VSZ</h1>
<div data-js="sold-out">
<p class="has-text-left price is-size-4 mb-6">
Helaas, de trui is niet meer verkrijgbaar.
</p>
</div>
</div>
</section>
</main>
<footer class="footer">
<nav class="columns has-text-centered">
<div class="level column">
<div class="level-item is-flex-direction-column">
<figure class="image is-128x128">
<a href="https://www.instagram.com/schooltruivsz/">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<radialGradient id="a" cx="56.4" cy="19.2" r="711.3" gradientTransform="translate(-37 444)"
gradientUnits="userSpaceOnUse">
<stop offset="0" style="stop-color:#fed576" />
<stop offset=".3" style="stop-color:#f47133" />
<stop offset=".6" style="stop-color:#bc3081" />
<stop offset="1" style="stop-color:#4c63d2" />
</radialGradient>
<path
d="M96 23c-16 6-30 15-44 29-13 13-22 27-28 43s-10 34-11 60-2 34-2 101l2 102c1 26 5 44 11 59 6 17 15 30 29 44 13 14 27 22 43 28s34 11 60 12l101 1 102-1c26-2 44-6 59-12a121 121 0 0 0 72-72c6-15 11-33 12-59l1-102-1-101c-2-26-6-44-12-60s-14-30-28-43c-14-14-27-22-44-29-15-6-33-10-59-11-27-1-35-2-102-2l-101 2c-26 1-44 5-60 11zm261 33c24 1 37 5 45 9 12 4 20 9 29 18 8 9 14 17 18 28 3 9 7 22 9 46l1 99c0 65 0 74-2 100-1 24-5 37-8 45a77 77 0 0 1-47 47c-8 4-21 8-45 9l-100 1-99-1c-24-1-37-5-46-9a81 81 0 0 1-47-47c-3-8-7-21-8-45l-1-100 1-99c1-24 5-37 8-46 5-11 10-19 19-28 8-9 17-14 28-18 9-4 22-8 46-9l99-1 100 1z"
style="fill:url(#a)" />
<radialGradient id="b" cx="154.1" cy="134.6" r="365.3" gradientTransform="translate(-24 253)"
gradientUnits="userSpaceOnUse">
<stop offset="0" style="stop-color:#fed576" />
<stop offset=".3" style="stop-color:#f47133" />
<stop offset=".6" style="stop-color:#bc3081" />
<stop offset="1" style="stop-color:#4c63d2" />
</radialGradient>
<path d="M131 256a126 126 0 1 0 253 0 126 126 0 0 0-253 0zm208 0a82 82 0 1 1-164 0 82 82 0 0 1 164 0z"
style="fill:url(#b)" />
<circle cx="388.6" cy="125" r="29.5" style="fill:#654c9f" />
</svg>
</a>
</figure>
<p><a href="https://www.instagram.com/schooltruivsz/">volg ons ook op Instagram</a></p>
</div>
</div>
</nav>
</footer>
<script src="logic.js"></script>
</body>
</html>