forked from shooft/frontend-voor-designers-2223
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
128 lines (118 loc) · 3.1 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
<!doctype html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta name="author" content="jouw naam">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Opdracht 2: Interactie galore - Frontend voor Designers</title>
<link href="styles/style.css" rel="stylesheet">
<link rel="icon" type="image/svg+xml" href="images/favicon.svg">
</head>
<body>
<header>
<h1>Kinderfoto`s</h1>
<button data-modal-target="aside" >+ E-mail</button>
</header>
<aside>
<header>
<h3>E-mail toevoegen</h1>
<button data-close-button>×</button>
</header>
<p>
<form action="submitted.html">
<fieldset>
<legend>Voer hier een nieuw e-mail toe.</legend>
<label for="vnaam">Voornaam</label>
<input type="text" id="vnaam" value="Voornaam" required>
<label for="anaam">Achternaam</label>
<input type="text" id="anaam" value="Achternaam" required>
<label for="email">E-mail</label>
<input type="email" id="email" value="E-mail" required>
</fieldset>
<input type="submit" value="verstuur">
</form>
</p>
</aside>
<p id="overlay"></p>
<main>
<ol>
<li>
<h2>Vorige week</h2>
<ul></ul>
</li>
<li>
<h2>Deze week</h2>
<ul></ul>
</li>
<li>
<h2>Volgende week</h2>
<ul></ul>
</li>
</ol>
</main>
<section>
<article >
<ul id="list">
<li >
<img src="images/apenheul.jpg" alt="Kids in de apenheul" />
</li>
<li >
<img src="images/dierentuin.jpg" alt="Kids in de dierentuin"/>
</li>
<li >
<img src="images/donkerbos.jpg" alt="In een donkerbos"/>
</li>
<li>
<img src="images/schattig.jpg" alt="Vera kijkt expres schattig"/>
</li>
<li>
<img src="images/stokjes.jpg" alt="Addelynn vecht met Charlotte"/>
</li>
<li>
<img src="images/vera.jpg" alt="Vera in de kinderboerderij"/>
</li>
<li>
<img src="images/wiiii.jpg" alt="Addelynn en Vera op de kabelbaan"/>
</li>
<li>
<img src="images/schildpad.jpg" alt="Addelynn in een schilpadschild" />
</li>
<li>
<img src="images/tweeschildpadden.jpg" alt="Vera en Addelynn in een schildpadschild"/>
</li>
<li>
<img src="images/IMG_20220604_115219.jpg" alt="Vis eten met mama" />
</li>
<li>
<img src="images/IMG_20220610_174216.jpg" alt="koken met mama"/>
</li>
<li>
<img src="images/IMG_20220611_123118.jpg" alt="Staan op een steen"/>
</li>
<li>
<img src="images/IMG_20220611_123251.jpg" alt="Spelen bij een boom"/>
</li>
<li>
<img src="images/IMG_20220611_135702.jpg" alt="Ik ben sneller dan mijn zus"/>
</li>
<li>
<img src="images/IMG_20220611_215720_145.jpg" alt="Spelen op een steen"/>
</li>
<li>
<img src="images/IMG_20220611_215817_030.jpg" alt="vliegen in de ardennen"/>
</li>
<li>
<img src="images/IMG_20220611_220009_319.jpg" alt="wandelen in de ardennen" />
</li>
<li>
<img src="images/IMG_20220612_112533.jpg" alt="spelen met water"/>
</li>
</ul>
</article>
</section>
<footer>
</footer>
<script src="https://cdn.jsdelivr.net/npm/sortablejs@latest/Sortable.min.js"></script>
<script src="scripts/script.js"></script>
</body>
</html>