forked from fdnd-task/the-client-website
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathuitleningen.html
203 lines (168 loc) · 8.81 KB
/
uitleningen.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
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Link to CSS -->
<link rel="stylesheet" href="./styles/styles.css">
<!-- Link to boxicons -->
<link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
<!-- Link to JavaScript script -->
<script src="./scripts/script.js" defer></script>
<title>Mijn OBA digitale reserveringen</title>
</head>
<body>
<nav class="sidebar close">
<header>
<div class="image-text">
<span class="image">
<img src="/images/wingsan.png" alt="Gebruiker-foto">
</span>
<div class="text logo-text">
<span class="name">Wing-San Lee</span>
<span class="profession">2 jaar lid</span>
</div>
</div>
<i class='bx bx-chevron-right toggle'></i>
</header>
<div class="menu-bar">
<div class="menu">
<li class="search-box">
<i class='bx bx-search icon'></i>
<input type="text" placeholder="Zoek...">
</li>
<ul class="menu-links">
<li class="nav-link">
<a href="https://yujing-student.github.io/the-client-website/">
<i class='bx bx-home icon'></i>
<span class="text nav-text">Welkom</span>
</a>
</li>
<li class="nav-link">
<a href="https://pommelienn.github.io/the-client-website/">
<i class='bx bx-user icon'></i>
<span class="text nav-text">Overzicht abonnement</span>
</a>
</li>
<li class="nav-link">
<a href="https://lisagjh.github.io/the-client-website/404.html">
<i class='bx bx-list-ul icon'></i>
<span class="text nav-text">Leeslijst</span>
</a>
</li>
<li class="nav-link">
<a href="https://wingsvn.github.io/the-client-website/uitleningen.html">
<i class='bx bx-bar-chart-alt-2 icon'></i>
<span class="text-long nav-text">Uitleningen en verlengen</span>
</a>
</li>
<li class="nav-link">
<a href="https://annevd.github.io/the-client-website/uitleengeschiedenis.html">
<i class='bx bx-bell icon'></i>
<span class="text nav-text">Uitleengeschiedenis</span>
</a>
</li>
<li class="nav-link">
<a href="https://lisagjh.github.io/the-client-website/">
<i class='bx bx-bookmark icon'></i> <span class="text nav-text">Diensten en Producten</span>
</a>
</li>
<li class="nav-link">
<a href="https://lisagjh.github.io/the-client-website/404.html">
<i class='bx bx-pie-chart-alt icon'></i>
<span class="text nav-text">Betaalgeschiedenis</span>
</a>
</li>
<li class="nav-link">
<a href="https://lisagjh.github.io/the-client-website/404.html">
<i class='bx bx-heart icon'></i>
<span class="text nav-text">Reserveringen</span>
</a>
</li>
</ul>
</div>
<div class="bottom-content">
<li class="">
<a href="https://www.oba.nl">
<i class='bx bx-log-out icon' ></i>
<span class="text nav-text">Uitloggen</span>
</a>
</li>
<li class="mode">
<div class="sun-moon">
<i class='bx bx-moon icon moon'></i>
<i class='bx bx-sun icon sun'></i>
</div>
<span class="mode-text text">Dark mode</span>
<div class="toggle-switch">
<span class="switch"></span>
</div>
</li>
</div>
</div>
</nav>
<!--My part on this project: Mijn uitleningen-->
<main class="home">
<div class="text"><img src="./images/oba.png" alt="OBA logo"></div>
<div class="uitleningen">
<button class="account"><img src="https://i.ibb.co/4PmHHJc/user-icon.png" style="width: 3rem"></button>
<h1>Mijn Uitleningen</h1>
<h6>in te leveren boeken: 6</h6>
</div>
<div class="articles">
<article>
<img src="https://i.ibb.co/tCpwZHS/cover-beasts-of-a-little-land.jpg" alt="Beasts of a little Land">
<h3> Beasts of a Little Land, Juhea Kim </h3>
<p>In 1917, deep in the snowy mountains of occupied Korea, an impoverished local hunter on the brink of starvation saves a young Japanese officer from an attacking tiger. In an instant, their fates are connected—and from this encounter unfolds a saga that spans half a century.</p>
<h4>inleverdatum: 16 oktober 2023</h4>
<h5>over 11 dagen</h5>
<button>verlengen</button>
</article>
<article>
<img src="https://i.ibb.co/Z8VnqZw/cover-holding-up-the-universe.jpg" alt="Holding up the universe">
<h3>Holding up the universe, Jennifer Niven</h3>
<p>Libby (17) was de dikste tiener van Amerika. Ze is afgevallen en weegt nu 150 kilo, maar op school wordt ze erg gepest. Als Jack haar wil beschermen, leidt dat tot een incident.</p>
<h4>inleverdatum: 16 oktober 2023</h4>
<h5>over 11 dagen</h5>
<button>verlengen</button>
</article>
<article>
<img src="https://i.ibb.co/V35Kzg2/cover-born-a-crime.jpg" alt="Born A Crime">
<h3>Born A Crime, Trevor Noah</h3>
<p>Stories from a South African Childhood is an autobiographical comedy book written by South African comedian Trevor Noah, published in 2016.</p>
<h4>inleverdatum: 16 oktober 2023</h4>
<h5>over 11 dagen</h5>
<button>verlengen</button>
</article>
<article>
<img src="https://i.ibb.co/hCTFCj4/cover-sigh-gone.jpg" alt="Sigh Gone">
<h3>Sigh, Gone, Phuc Tran</h3>
<p>A high school Latin teacher and tattoo artist's memoir about immigrating to small-town America from Vietnam and learning to fit in through reading, skateboarding, and punk rock.</p>
<h4>inleverdatum: 16 oktober 2023</h4>
<h5>over 11 dagen</h5>
<button>verlengen</button>
</article>
<article>
<img src="https://i.ibb.co/fxdWRv3/cover-pachinko.jpg" alt="Pachinko">
<h3>Pachinko, Min Jin Lee</h3>
<p>Een ongehuwde Koreaanse vrouw raakt in 1932 zwanger. Een jonge pastoor biedt aan met haar te trouwen en ze vestigen zich in Japan, waar ze twee zonen krijgen.</p>
<h4>inleverdatum: 16 oktober 2023</h4>
<h5>over 11 dagen</h5>
<button>verlengen</button>
</article>
<article>
<img src="https://i.ibb.co/qjkDDkj/cover-the-monk-of-mokha.jpg" alt="The Monk of Mokha">
<h3>The Monk Of Mokha, Dave Eggers</h3>
<p>Monk of Mokha is the true story of a young Yemeni-American man, raised in San Francisco, who dreams of resurrecting the ancient art of Yemeni coffee but finds himself trapped in Sana'a by civil war.</p>
<h4>inleverdatum: 16 oktober 2023</h4>
<h5>over 11 dagen</h5>
<button>verlengen</button>
</article>
</div>
<a href="https://pommelienn.github.io/the-client-website/">
<button class="terug">terug →</button>
</a>
</main>
</body>
</html>