Skip to content

Commit c859b79

Browse files
author
ed.schneider
committed
Added css
1 parent 7dd5884 commit c859b79

5 files changed

Lines changed: 60 additions & 45 deletions

File tree

data/mock.json renamed to src/data/mock.json

File renamed without changes.

‎src/tabellen.html‎

Lines changed: 0 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +0,0 @@
1-
<!DOCTYPE html>
2-
<html lang="de">
3-
<head>
4-
<meta charset="UTF-8">
5-
<link rel="stylesheet" href="style.css">
6-
</head>
7-
<body>
8-
9-
<h1>BMI-Messungen</h1>
10-
11-
<!-- Filter & Sortierung -->
12-
<div class="controls">
13-
<select id="filterSelect">
14-
<option value="all">Alle Einträge</option>
15-
<option value="week">Letzte Woche</option>
16-
<option value="month">Letzter Monat</option>
17-
</select>
18-
19-
<select id="sortSelect">
20-
<option value="date-desc">Datum absteigend</option>
21-
<option value="date-asc">Datum aufsteigend</option>
22-
<option value="bmi-asc">BMI aufsteigend</option>
23-
<option value="bmi-desc">BMI absteigend</option>
24-
</select>
25-
</div>
26-
27-
<table>
28-
<thead>
29-
<tr>
30-
<th>Datum</th>
31-
<th>Gewicht (kg)</th>
32-
<th>Größe (cm)</th>
33-
<th>BMI</th>
34-
<th>Bewertung</th>
35-
<th>Aktion</th>
36-
</tr>
37-
</thead>
38-
<tbody id="bmiTableBody">
39-
</tbody>
40-
</table>
41-
42-
<script src="./js/tabellen.js"></script>
43-
</body>
44-
</html>

src/css/tabellen.css renamed to src/tables/tables.css

File renamed without changes.

‎src/tables/tables.html‎

Lines changed: 60 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,60 @@
1-
<div class="box p-3">Tables content…</div>
1+
<!DOCTYPE html>
2+
<html lang="de">
3+
<head>
4+
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
5+
<meta charset="UTF-8">
6+
<link rel="stylesheet" href="style.css">
7+
</head>
8+
<body class="bg-light">
9+
10+
<div class="container py-5">
11+
<div class="card shadow-lg border-0 rounded-4">
12+
<div class="card-body p-4">
13+
14+
<h1 class="text-center mb-4">BMI-Messungen</h1>
15+
16+
<!-- Filter & Sortierung -->
17+
<div class="row g-3 mb-4">
18+
<div class="col-md-6">
19+
<select id="filterSelect" class="form-select form-select-lg shadow-sm">
20+
<option value="all">Alle Einträge</option>
21+
<option value="week">Letzte Woche</option>
22+
<option value="month">Letzter Monat</option>
23+
</select>
24+
</div>
25+
26+
<div class="col-md-6">
27+
<select id="sortSelect" class="form-select form-select-lg shadow-sm">
28+
<option value="date-desc">Datum absteigend</option>
29+
<option value="date-asc">Datum aufsteigend</option>
30+
<option value="bmi-asc">BMI aufsteigend</option>
31+
<option value="bmi-desc">BMI absteigend</option>
32+
</select>
33+
</div>
34+
</div>
35+
36+
<div class="table-responsive">
37+
<table class="table table-hover table-striped align-middle text-center shadow-sm rounded-3 overflow-hidden">
38+
<thead class="table-dark">
39+
<tr>
40+
<th>Datum</th>
41+
<th>Gewicht (kg)</th>
42+
<th>Größe (cm)</th>
43+
<th>BMI</th>
44+
<th>Bewertung</th>
45+
<th>Aktion</th>
46+
</tr>
47+
</thead>
48+
<tbody id="bmiTableBody">
49+
</tbody>
50+
</table>
51+
</div>
52+
53+
</div>
54+
</div>
55+
</div>
56+
57+
<script src="tables.js"></script>
58+
</body>
59+
60+
</html>

src/js/tabellen.js renamed to src/tables/tables.js

File renamed without changes.

0 commit comments

Comments
 (0)