-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
170 lines (160 loc) · 10.2 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
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
166
167
168
169
<!DOCTYPE html>
<html>
<head>
<style>
/* CSS for the overall layout, including the header and the image grid */
body {
font-family: Helvetiva, sans-serif;
}
.header {
background-color: #f2f2f2;
padding: 20px;
text-align: center;
font-size: 30px;
color: #333;
}
.container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 10px;
padding: 10px;
}
.container a {
display: block;
}
.container img {
width: 100%;
height: auto;
aspect-ratio: 1 / 1.41;
border-radius: 8px;
}
nav, footer {
background-color: #f2f2f2;
padding: 10px;
text-align: center;
}
@media screen and (max-width: 600px) {
.container {
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
}
@media (prefers-color-scheme: dark) {
body {
background-color: black;
color: white;
}
.header, nav, footer {
background-color: #1a1a1a;
color: white;
}
}
</style>
</head>
<body>
<header class="header">
<h1>De Filosoof</h1>
</header>
<nav>
<a href="#footer">Contact</a>
<a href="./over.html">Over</a>
</nav>
<div class="container">
<!-- 88 images wrapped in links -->
<a href="./pdf/92.pdf" target="_blank"><img src="./img/92.png" alt="Title page of edition 92"></a>
<a href="./pdf/91.pdf" target="_blank"><img src="./img/91.png" alt="Title page of edition 91"></a>
<a href="./pdf/90.pdf" target="_blank"><img src="./img/90.png" alt="Title page of edition 90"></a>
<a href="./pdf/89.pdf" target="_blank"><img src="./img/89.png" alt="Title page of edition 89"></a>
<a href="./pdf/88.pdf" target="_blank"><img src="./img/88.png" alt="Title page of edition 88"></a>
<a href="./pdf/87.pdf" target="_blank"><img src="./img/87.png" alt="Title page of edition 87"></a>
<a href="./pdf/86.pdf" target="_blank"><img src="./img/86.png" alt="Title page of edition 86"></a>
<a href="./pdf/85.pdf" target="_blank"><img src="./img/85.png" alt="Title page of edition 85"></a>
<a href="./pdf/84.pdf" target="_blank"><img src="./img/84.png" alt="Title page of edition 84"></a>
<a href="./pdf/83.pdf" target="_blank"><img src="./img/83.png" alt="Title page of edition 83"></a>
<a href="./pdf/82.pdf" target="_blank"><img src="./img/82.png" alt="Title page of edition 82"></a>
<a href="./pdf/79.pdf" target="_blank"><img src="./img/79.png" alt="Title page of edition 79"></a>
<a href="./pdf/78.pdf" target="_blank"><img src="./img/78.png" alt="Title page of edition 78"></a>
<a href="./pdf/75.pdf" target="_blank"><img src="./img/75.png" alt="Title page of edition 75"></a>
<a href="./pdf/74.pdf" target="_blank"><img src="./img/74.png" alt="Title page of edition 74"></a>
<a href="./pdf/73.pdf" target="_blank"><img src="./img/73.png" alt="Title page of edition 73"></a>
<a href="./pdf/72.pdf" target="_blank"><img src="./img/72.png" alt="Title page of edition 72"></a>
<a href="./pdf/71.pdf" target="_blank"><img src="./img/71.png" alt="Title page of edition 71"></a>
<a href="./pdf/70.pdf" target="_blank"><img src="./img/70.png" alt="Title page of edition 70"></a>
<a href="./pdf/69.pdf" target="_blank"><img src="./img/69.png" alt="Title page of edition 69"></a>
<a href="./pdf/68.pdf" target="_blank"><img src="./img/68.png" alt="Title page of edition 68"></a>
<a href="./pdf/67.pdf" target="_blank"><img src="./img/67.png" alt="Title page of edition 67"></a>
<a href="./pdf/66.pdf" target="_blank"><img src="./img/66.png" alt="Title page of edition 66"></a>
<a href="./pdf/65.pdf" target="_blank"><img src="./img/65.png" alt="Title page of edition 65"></a>
<a href="./pdf/64.pdf" target="_blank"><img src="./img/64.png" alt="Title page of edition 64"></a>
<a href="./pdf/63.pdf" target="_blank"><img src="./img/63.png" alt="Title page of edition 63"></a>
<a href="./pdf/62.pdf" target="_blank"><img src="./img/62.png" alt="Title page of edition 62"></a>
<a href="./pdf/61.pdf" target="_blank"><img src="./img/61.png" alt="Title page of edition 61"></a>
<a href="./pdf/60.pdf" target="_blank"><img src="./img/60.png" alt="Title page of edition 60"></a>
<a href="./pdf/59.pdf" target="_blank"><img src="./img/59.png" alt="Title page of edition 59"></a>
<a href="./pdf/58.pdf" target="_blank"><img src="./img/58.png" alt="Title page of edition 58"></a>
<a href="./pdf/57.pdf" target="_blank"><img src="./img/57.png" alt="Title page of edition 57"></a>
<a href="./pdf/56.pdf" target="_blank"><img src="./img/56.png" alt="Title page of edition 56"></a>
<a href="./pdf/55.pdf" target="_blank"><img src="./img/55.png" alt="Title page of edition 55"></a>
<a href="./pdf/54.pdf" target="_blank"><img src="./img/54.png" alt="Title page of edition 54"></a>
<a href="./pdf/53.pdf" target="_blank"><img src="./img/53.png" alt="Title page of edition 53"></a>
<a href="./pdf/52.pdf" target="_blank"><img src="./img/52.png" alt="Title page of edition 52"></a>
<a href="./pdf/51.pdf" target="_blank"><img src="./img/51.png" alt="Title page of edition 51"></a>
<a href="./pdf/50.pdf" target="_blank"><img src="./img/50.png" alt="Title page of edition 50"></a>
<a href="./pdf/49.pdf" target="_blank"><img src="./img/49.png" alt="Title page of edition 49"></a>
<a href="./pdf/47.pdf" target="_blank"><img src="./img/47.png" alt="Title page of edition 47"></a>
<a href="./pdf/46.pdf" target="_blank"><img src="./img/46.png" alt="Title page of edition 46"></a>
<a href="./pdf/45.pdf" target="_blank"><img src="./img/45.png" alt="Title page of edition 45"></a>
<a href="./pdf/44.pdf" target="_blank"><img src="./img/44.png" alt="Title page of edition 44"></a>
<a href="./pdf/43.pdf" target="_blank"><img src="./img/43.png" alt="Title page of edition 43"></a>
<a href="./pdf/42.pdf" target="_blank"><img src="./img/42.png" alt="Title page of edition 42"></a>
<a href="./pdf/41.pdf" target="_blank"><img src="./img/41.png" alt="Title page of edition 41"></a>
<a href="./pdf/40.pdf" target="_blank"><img src="./img/40.png" alt="Title page of edition 40"></a>
<a href="./pdf/39.pdf" target="_blank"><img src="./img/39.png" alt="Title page of edition 39"></a>
<a href="./pdf/38.pdf" target="_blank"><img src="./img/38.png" alt="Title page of edition 38"></a>
<a href="./pdf/37.pdf" target="_blank"><img src="./img/37.png" alt="Title page of edition 37"></a>
<a href="./pdf/36.pdf" target="_blank"><img src="./img/36.png" alt="Title page of edition 36"></a>
<a href="./pdf/35.pdf" target="_blank"><img src="./img/35.png" alt="Title page of edition 35"></a>
<a href="./pdf/34.pdf" target="_blank"><img src="./img/34.png" alt="Title page of edition 34"></a>
<a href="./pdf/33.pdf" target="_blank"><img src="./img/33.png" alt="Title page of edition 33"></a>
<a href="./pdf/32.pdf" target="_blank"><img src="./img/32.png" alt="Title page of edition 32"></a>
<a href="./pdf/31.pdf" target="_blank"><img src="./img/31.png" alt="Title page of edition 31"></a>
<a href="./pdf/30.pdf" target="_blank"><img src="./img/30.png" alt="Title page of edition 30"></a>
<a href="./pdf/29.pdf" target="_blank"><img src="./img/29.png" alt="Title page of edition 29"></a>
<a href="./pdf/28.pdf" target="_blank"><img src="./img/28.png" alt="Title page of edition 28"></a>
<a href="./pdf/27.pdf" target="_blank"><img src="./img/27.png" alt="Title page of edition 27"></a>
<a href="./pdf/26.pdf" target="_blank"><img src="./img/26.png" alt="Title page of edition 26"></a>
<a href="./pdf/25.pdf" target="_blank"><img src="./img/25.png" alt="Title page of edition 25"></a>
<a href="./pdf/24.pdf" target="_blank"><img src="./img/24.png" alt="Title page of edition 24"></a>
<a href="./pdf/23.pdf" target="_blank"><img src="./img/23.png" alt="Title page of edition 23"></a>
<a href="./pdf/22.pdf" target="_blank"><img src="./img/22.png" alt="Title page of edition 22"></a>
<a href="./pdf/21.pdf" target="_blank"><img src="./img/21.png" alt="Title page of edition 21"></a>
<a href="./pdf/20.pdf" target="_blank"><img src="./img/20.png" alt="Title page of edition 20"></a>
<a href="./pdf/19.pdf" target="_blank"><img src="./img/19.png" alt="Title page of edition 19"></a>
<a href="./pdf/18.pdf" target="_blank"><img src="./img/18.png" alt="Title page of edition 18"></a>
<a href="./pdf/17.pdf" target="_blank"><img src="./img/17.png" alt="Title page of edition 17"></a>
<a href="./pdf/16.pdf" target="_blank"><img src="./img/16.png" alt="Title page of edition 16"></a>
<a href="./pdf/15.pdf" target="_blank"><img src="./img/15.png" alt="Title page of edition 15"></a>
<a href="./pdf/14.pdf" target="_blank"><img src="./img/14.png" alt="Title page of edition 14"></a>
<a href="./pdf/13.pdf" target="_blank"><img src="./img/13.png" alt="Title page of edition 13"></a>
<a href="./pdf/12.pdf" target="_blank"><img src="./img/12.png" alt="Title page of edition 12"></a>
<a href="./pdf/11.pdf" target="_blank"><img src="./img/11.png" alt="Title page of edition 11"></a>
<a href="./pdf/10.pdf" target="_blank"><img src="./img/10.png" alt="Title page of edition 10"></a>
<a href="./pdf/9.pdf" target="_blank"><img src="./img/9.png" alt="Title page of edition 9"></a>
<a href="./pdf/8.pdf" target="_blank"><img src="./img/8.png" alt="Title page of edition 8"></a>
<a href="./pdf/7.pdf" target="_blank"><img src="./img/7.png" alt="Title page of edition 7"></a>
<a href="./pdf/6.pdf" target="_blank"><img src="./img/6.png" alt="Title page of edition 6"></a>
<a href="./pdf/5.pdf" target="_blank"><img src="./img/5.png" alt="Title page of edition 5"></a>
<a href="./pdf/4.pdf" target="_blank"><img src="./img/4.png" alt="Title page of edition 4"></a>
<a href="./pdf/3.pdf" target="_blank"><img src="./img/3.png" alt="Title page of edition 3"></a>
<a href="./pdf/2.pdf" target="_blank"><img src="./img/2.png" alt="Title page of edition 2"></a>
<a href="./pdf/1.pdf" target="_blank"><img src="./img/1.png" alt="Title page of edition 1"></a>
<a href="./pdf/0.pdf" target="_blank"><img src="./img/0.png" alt="Title page of edition 0"></a>
</div>
<footer id="footer">
<p><a href="mailto:redactie.filosoof@gmail.com">redactie.filosoof@gmail.com</a></p>
<p><a href="tel:00-31-302536071">Telefoon: (030) 253 60 71</a></p>
<p>Post Adres: Janskerkof 13A, 4512 BL Utrecht</p>
<p>IBAN: NL67 TRIO 0379 7465 57 ten name van Tijdschrift de Filosoof</p>
<p><a href="https://github.com/tijdschriftdefilosoof/tijdschriftdefilosoof.github.io">Bekijk en bouw mee aan de code op GitHub!</a></p>
</footer>
</body>
</html>