unified CSS, consistent headers, standardized button colors

This commit is contained in:
2026-04-25 13:37:05 +02:00
parent 62ba9b5345
commit cb8994b493
6 changed files with 752 additions and 1090 deletions

View File

@@ -1,547 +0,0 @@
/* =====================================================================
Moderation Page — Styles
Separate Stylesheet for the Admin Moderation Interface.
===================================================================== */
/* -----------------------------------------------------------------
Base
----------------------------------------------------------------- */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: 'Segoe UI', system-ui, sans-serif;
background: #f4f5f7;
color: #1a1a2e;
font-size: 15px;
}
/* -----------------------------------------------------------------
Header
----------------------------------------------------------------- */
.admin-header {
background: var(--color-primary);
color: white;
padding: 14px 24px;
display: flex;
justify-content: space-between;
align-items: center;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.admin-header h1 {
font-size: 1.15rem;
font-weight: 600;
}
.admin-nav {
display: flex;
gap: 16px;
align-items: center;
}
.admin-nav a {
color: white;
text-decoration: none;
opacity: 0.8;
font-size: 0.85rem;
transition: opacity 150ms ease;
}
.admin-nav a:hover { opacity: 1; }
/* -----------------------------------------------------------------
Container
----------------------------------------------------------------- */
.admin-container {
max-width: 960px;
margin: 24px auto;
padding: 0 16px;
}
/* -----------------------------------------------------------------
Statistics Cards
----------------------------------------------------------------- */
.stats-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 12px;
margin-bottom: 28px;
}
.stat-card {
background: white;
border-radius: 8px;
padding: 16px;
text-align: center;
border: 1px solid #e0e0e0;
}
.stat-card .stat-number {
font-size: 1.8rem;
font-weight: 700;
color: var(--color-primary);
}
.stat-card .stat-label {
font-size: 0.8rem;
color: #5a5a7a;
margin-top: 4px;
}
/* -----------------------------------------------------------------
Filter Tabs
----------------------------------------------------------------- */
.filter-tabs {
display: flex;
gap: 4px;
margin-bottom: 20px;
border-bottom: 2px solid #e0e0e0;
padding-bottom: 0;
}
.filter-tab {
padding: 8px 16px;
border: none;
background: none;
font-family: inherit;
font-size: 0.85rem;
font-weight: 600;
color: #5a5a7a;
cursor: pointer;
border-bottom: 2px solid transparent;
margin-bottom: -2px;
transition: color 150ms ease, border-color 150ms ease;
}
.filter-tab:hover {
color: var(--color-primary);
}
.filter-tab.active {
color: var(--color-primary);
border-bottom-color: var(--color-primary);
}
.filter-tab .tab-count {
background: #e0e0e0;
color: #5a5a7a;
font-size: 0.7rem;
padding: 1px 6px;
border-radius: 10px;
margin-left: 4px;
}
.filter-tab.active .tab-count {
background: var(--color-primary);
color: white;
}
/* -----------------------------------------------------------------
Sort Controls
----------------------------------------------------------------- */
.sort-controls {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
font-size: 0.85rem;
color: #5a5a7a;
}
.sort-controls select {
padding: 4px 8px;
border: 1px solid #e0e0e0;
border-radius: 4px;
font-family: inherit;
font-size: 0.85rem;
cursor: pointer;
}
/* -----------------------------------------------------------------
Collapsible Contribution Rows
----------------------------------------------------------------- */
.contribution-row {
background: white;
border: 1px solid #e0e0e0;
border-radius: 8px;
margin-bottom: 10px;
overflow: hidden;
transition: border-color 150ms ease;
}
.contribution-row:hover {
border-color: #bbb;
}
.contribution-row-header {
padding: 12px 16px;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
transition: background 150ms ease;
}
.contribution-row-header:hover {
background: #f8f9fa;
}
.contribution-row-summary {
display: flex;
align-items: center;
gap: 10px;
flex: 1;
min-width: 0;
}
.contribution-row-summary .title {
font-weight: 600;
font-size: 0.95rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.collapse-icon {
color: #999;
font-size: 0.75rem;
flex-shrink: 0;
transition: transform 200ms ease;
}
.contribution-row.open .collapse-icon {
transform: rotate(180deg);
}
/* -----------------------------------------------------------------
Contribution Detail View (expanded)
----------------------------------------------------------------- */
.contribution-row-detail {
padding: 0 16px 16px 16px;
border-top: 1px solid #f0f0f0;
display: none;
}
.contribution-row.open .contribution-row-detail {
display: block;
}
.detail-layout {
display: flex;
gap: 16px;
margin-top: 12px;
margin-bottom: 12px;
}
.detail-map {
width: 220px;
height: 170px;
border-radius: 6px;
border: 1px solid #e0e0e0;
flex-shrink: 0;
background: #f0f0f0;
}
.detail-content {
flex: 1;
min-width: 0;
}
.detail-content .description {
font-size: 0.85rem;
line-height: 1.5;
color: #5a5a7a;
margin-bottom: 10px;
}
.detail-content .description.empty {
color: #bbb;
font-style: italic;
}
.detail-meta {
font-size: 0.8rem;
color: #999;
display: flex;
flex-direction: column;
gap: 4px;
}
.detail-meta span {
display: flex;
align-items: center;
gap: 6px;
}
/* -----------------------------------------------------------------
Action Buttons
----------------------------------------------------------------- */
.action-buttons {
display: flex;
gap: 8px;
flex-wrap: wrap;
padding-top: 12px;
border-top: 1px solid #f0f0f0;
}
.btn {
padding: 7px 14px;
border: none;
border-radius: 6px;
font-size: 0.82rem;
font-weight: 600;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 5px;
font-family: inherit;
transition: filter 150ms ease;
text-decoration: none;
}
.btn:hover { filter: brightness(1.1); }
.btn-approve { background: #28a745 ; color: white; }
.btn-reject { background: #DC3545; color: white; }
.btn-edit { background: #ffc107; color: white; }
.btn-delete { background: #424242; color: white; }
.btn-map { background: #546E7A; color: white; }
/* -----------------------------------------------------------------
Badges
----------------------------------------------------------------- */
.badge {
display: inline-block;
padding: 2px 8px;
border-radius: 4px;
font-size: 0.7rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
flex-shrink: 0;
}
.badge-category {
background: #e0e0e0;
color: #5a5a7a;
display: inline-flex;
align-items: center;
gap: 4px;
}
.badge-pending { background: #fff3cd; color: #856404; }
.badge-approved { background: #d4edda; color: #155724; }
.badge-rejected { background: #f8d7da; color: #721c24; }
/* -----------------------------------------------------------------
Empty State
----------------------------------------------------------------- */
.empty-state {
text-align: center;
padding: 40px;
color: #999;
font-size: 0.9rem;
}
/* -----------------------------------------------------------------
Section Spacing
----------------------------------------------------------------- */
.section { margin-bottom: 32px; }
/* -----------------------------------------------------------------
Placeholder Tabs (future Features)
----------------------------------------------------------------- */
.placeholder-content {
text-align: center;
padding: 60px 20px;
color: #bbb;
}
.placeholder-content i {
font-size: 2.5rem;
margin-bottom: 12px;
display: block;
}
.placeholder-content p {
font-size: 0.9rem;
}
/* -----------------------------------------------------------------
Navigation Tabs (Page Sections)
----------------------------------------------------------------- */
.page-tabs {
display: flex;
gap: 4px;
margin-bottom: 24px;
background: white;
padding: 4px;
border-radius: 8px;
border: 1px solid #e0e0e0;
}
.page-tab {
padding: 8px 16px;
border: none;
background: none;
font-family: inherit;
font-size: 0.85rem;
font-weight: 600;
color: #5a5a7a;
cursor: pointer;
border-radius: 6px;
transition: all 150ms ease;
display: flex;
align-items: center;
gap: 6px;
}
.page-tab:hover { background: #f0f0f0; }
.page-tab.active {
background: var(--color-primary);
color: white;
}
/* -----------------------------------------------------------------
Login Page
----------------------------------------------------------------- */
.login-wrapper {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
}
.login-box {
background: white;
border-radius: 12px;
padding: 32px;
max-width: 380px;
width: 90%;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
text-align: center;
}
.login-box h1 {
font-size: 1.3rem;
margin-bottom: 8px;
}
.login-box p {
font-size: 0.85rem;
color: #5a5a7a;
margin-bottom: 20px;
}
.login-box input[type="password"] {
width: 100%;
padding: 10px 12px;
border: 1px solid #e0e0e0;
border-radius: 6px;
font-size: 0.9rem;
margin-bottom: 12px;
font-family: inherit;
}
.login-box input:focus {
outline: none;
border-color: var(--color-primary);
box-shadow: 0 0 0 3px rgba(0, 55, 109, 0.1);
}
.login-box button {
width: 100%;
padding: 10px;
background: var(--color-primary);
color: white;
border: none;
border-radius: 6px;
font-size: 0.9rem;
font-weight: 600;
cursor: pointer;
font-family: inherit;
}
.login-box button:hover { filter: brightness(1.15); }
.login-error {
color: #c62828;
font-size: 0.85rem;
margin-bottom: 12px;
}
.back-link {
margin-top: 16px;
font-size: 0.8rem;
}
.back-link a { color: #5a5a7a; }
/* -----------------------------------------------------------------
SweetAlert2 Font Override
----------------------------------------------------------------- */
.swal2-input,
.swal2-textarea,
.swal2-select {
font-family: 'Segoe UI', system-ui, sans-serif !important;
}
/* -----------------------------------------------------------------
Mobile Responsive
----------------------------------------------------------------- */
@media (max-width: 768px) {
.admin-header {
flex-direction: column;
gap: 8px;
padding: 12px 16px;
}
.admin-header h1 { font-size: 1rem; }
.detail-layout {
flex-direction: column;
}
.detail-map {
width: 100%;
height: 180px;
}
.contribution-row-summary .title {
max-width: 200px;
}
.action-buttons {
flex-direction: column;
}
.action-buttons .btn {
justify-content: center;
}
.filter-tabs {
overflow-x: auto;
}
.page-tabs {
overflow-x: auto;
}
}

View File

@@ -123,7 +123,7 @@ $counts['total'] = count($all_contributions);
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/leaflet.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/leaflet.min.css">
<!-- Application Styles --> <!-- Application Styles -->
<link rel="stylesheet" href="admin.css"> <link rel="stylesheet" href="styles.css">
<!-- Loads JavaScript Dependencies --> <!-- Loads JavaScript Dependencies -->
@@ -140,15 +140,17 @@ $counts['total'] = count($all_contributions);
<!-- ============================================================= --> <!-- ============================================================= -->
<!-- Header --> <!-- Header -->
<!-- ============================================================= --> <!-- ============================================================= -->
<div class="admin-header"> <div class="page-header">
<h1><i class="fa-solid fa-shield-halved"></i> Moderationsportal <?= htmlspecialchars($municipality['name']) ?></h1> <div class="page-header-inner">
<div class="admin-nav"> <h1><i class="fa-solid fa-shield-halved"></i> Moderationsportal <?= htmlspecialchars($municipality['name']) ?></h1>
<a href="index.php"><i class="fa-solid fa-map"></i> Bürgerportal</a> <div class="page-header-nav">
<a href="admin.php?page=logout"><i class="fa-solid fa-right-from-bracket"></i> Abmelden</a> <a href="index.php"><i class="fa-solid fa-map"></i> Bürgerportal</a>
<a href="admin.php?page=logout"><i class="fa-solid fa-right-from-bracket"></i> Abmelden</a>
</div>
</div> </div>
</div> </div>
<div class="admin-container"> <div class="page-container">
<!-- ========================================================= --> <!-- ========================================================= -->
<!-- Page Navigation Tabs --> <!-- Page Navigation Tabs -->
@@ -295,7 +297,7 @@ $counts['total'] = count($all_contributions);
<?php endif; ?> <?php endif; ?>
<?php if ($item['status'] !== 'pending'): ?> <?php if ($item['status'] !== 'pending'): ?>
<button class="btn btn-edit" onclick="changeStatus(<?= $item['contribution_id'] ?>, 'pending')" style="background:#f57f17;"> <button class="btn btn-reset" onclick="changeStatus(..., 'pending')">
<i class="fa-solid fa-rotate-left"></i> Zurücksetzen <i class="fa-solid fa-rotate-left"></i> Zurücksetzen
</button> </button>
<?php endif; ?> <?php endif; ?>
@@ -864,7 +866,7 @@ function show_login_page($municipality, $error = null) {
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Moderation - Anmeldung</title> <title>Moderation - Anmeldung</title>
<link rel="icon" href="<?= htmlspecialchars($municipality['logo_path'] ?? 'assets/icon-municipality.png') ?>" type="image/png"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"> <link rel="icon" href="<?= htmlspecialchars($municipality['logo_path'] ?? 'assets/icon-municipality.png') ?>" type="image/png"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<link rel="stylesheet" href="admin.css"> <link rel="stylesheet" href="styles.css">
<style>:root { --color-primary: <?= htmlspecialchars($municipality['primary_color']) ?>; }</style> <style>:root { --color-primary: <?= htmlspecialchars($municipality['primary_color']) ?>; }</style>
</head> </head>
<body> <body>

View File

@@ -1,12 +1,8 @@
<?php <?php
// =====================================================================
// Imprint Page
// =====================================================================
require_once __DIR__ . '/api/db.php'; require_once __DIR__ . '/api/db.php';
$pdo = get_db(); $pdo = get_db();
$stmt = $pdo->prepare("SELECT * FROM municipalities WHERE slug = :slug"); $stmt = $pdo->prepare("SELECT * FROM municipalities WHERE slug = :slug");
$stmt->execute([':slug' => 'lohne']); $stmt->execute([':slug' => getenv('MUNICIPALITY_SLUG')]);
$municipality = $stmt->fetch(); $municipality = $stmt->fetch();
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
@@ -15,41 +11,29 @@ $municipality = $stmt->fetch();
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Impressum — <?= htmlspecialchars($municipality['name']) ?></title> <title>Impressum — <?= htmlspecialchars($municipality['name']) ?></title>
<link rel="icon" href="assets/icon-municipality.png" type="image/png"> <link rel="icon" href="<?= htmlspecialchars($municipality['logo_path'] ?? 'assets/icon-municipality.png') ?>" type="image/png">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<style> <link rel="stylesheet" href="styles.css">
:root { --color-primary: <?= htmlspecialchars($municipality['primary_color']) ?>; } <style>:root { --color-primary: <?= htmlspecialchars($municipality['primary_color']) ?>; }</style>
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', system-ui, sans-serif; background: #f4f5f7; color: #1a1a2e; }
.page-header { background: var(--color-primary); color: white; padding: 16px 24px; }
.page-header h1 { font-size: 1.2rem; }
.page-header a { color: white; opacity: 0.8; text-decoration: none; font-size: 0.85rem; }
.page-header a:hover { opacity: 1; }
.page-header-inner { max-width: 800px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
.page-content { max-width: 800px; margin: 32px auto; padding: 32px; background: white; border-radius: 8px; border: 1px solid #e0e0e0; line-height: 1.7; }
.page-content h2 { font-size: 1.1rem; margin: 24px 0 8px 0; color: var(--color-primary); }
.page-content h2:first-child { margin-top: 0; }
.page-content p { margin-bottom: 12px; color: #5a5a7a; }
@media (max-width: 768px) { .page-content { margin: 16px; padding: 20px; } }
</style>
</head> </head>
<body> <body>
<div class="page-header"> <div class="page-header">
<div class="page-header-inner"> <div class="page-header-inner">
<h1><i class="fa-solid fa-scale-balanced"></i> Impressum</h1> <h1><i class="fa-solid fa-scale-balanced"></i> Impressum</h1>
<a href="index.php"><i class="fa-solid fa-arrow-left"></i> Zurück zur Karte</a> <div class="page-header-nav">
<a href="index.php"><i class="fa-solid fa-arrow-left"></i> Zurück zur Karte</a>
</div>
</div> </div>
</div> </div>
<div class="page-content"> <div class="page-container">
<h2>Angaben gemäß § 5 TMG</h2> <div class="page-content-box">
<p>Stadt <?= htmlspecialchars($municipality['name']) ?></p> <div class="dev-notice">
<p>Die vollständigen Angaben (Adresse, Telefon, E-Mail, Vertretungsberechtigte) werden hier ergänzt, sobald das Portal in den Produktivbetrieb geht.</p> <i class="fa-solid fa-triangle-exclamation"></i>
Dieses Portal befindet sich in der Entwicklung und wurde nicht offiziell beauftragt. Das Impressum wird mit der offiziellen Inbetriebnahme hier hinzugefügt.
<h2>Technische Umsetzung</h2> </div>
<p><a href="https://endex-geodaten.de" target="_blank" style="color:var(--color-primary);">endex GmbH</a></p> <h2>Impressum</h2>
<p>Das Impressum wird hier hinzugefügt, sobald das Portal in den Produktivbetrieb geht.</p>
<h2>Haftungsausschluss</h2> </div>
<p>Die Inhalte der Bürgerbeiträge geben die Meinung der jeweiligen Verfasser wieder. Die Stadt <?= htmlspecialchars($municipality['name']) ?> übernimmt keine Gewähr für deren Richtigkeit.</p>
</div> </div>
</body> </body>
</html> </html>

View File

@@ -79,7 +79,7 @@ $news_items = $stmt->fetchAll();
</style> </style>
</head> </head>
<body> <body class="portal-page">
<!-- ============================================================= --> <!-- ============================================================= -->
<!-- Header --> <!-- Header -->

View File

@@ -1,12 +1,8 @@
<?php <?php
// =====================================================================
// Privacy Policy Page
// =====================================================================
require_once __DIR__ . '/api/db.php'; require_once __DIR__ . '/api/db.php';
$pdo = get_db(); $pdo = get_db();
$stmt = $pdo->prepare("SELECT * FROM municipalities WHERE slug = :slug"); $stmt = $pdo->prepare("SELECT * FROM municipalities WHERE slug = :slug");
$stmt->execute([':slug' => 'lohne']); $stmt->execute([':slug' => getenv('MUNICIPALITY_SLUG')]);
$municipality = $stmt->fetch(); $municipality = $stmt->fetch();
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
@@ -15,50 +11,29 @@ $municipality = $stmt->fetch();
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Datenschutz — <?= htmlspecialchars($municipality['name']) ?></title> <title>Datenschutz — <?= htmlspecialchars($municipality['name']) ?></title>
<link rel="icon" href="assets/icon-municipality.png" type="image/png"> <link rel="icon" href="<?= htmlspecialchars($municipality['logo_path'] ?? 'assets/icon-municipality.png') ?>" type="image/png">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<style> <link rel="stylesheet" href="styles.css">
:root { --color-primary: <?= htmlspecialchars($municipality['primary_color']) ?>; } <style>:root { --color-primary: <?= htmlspecialchars($municipality['primary_color']) ?>; }</style>
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', system-ui, sans-serif; background: #f4f5f7; color: #1a1a2e; }
.page-header { background: var(--color-primary); color: white; padding: 16px 24px; }
.page-header h1 { font-size: 1.2rem; }
.page-header a { color: white; opacity: 0.8; text-decoration: none; font-size: 0.85rem; }
.page-header a:hover { opacity: 1; }
.page-header-inner { max-width: 800px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
.page-content { max-width: 800px; margin: 32px auto; padding: 32px; background: white; border-radius: 8px; border: 1px solid #e0e0e0; line-height: 1.7; }
.page-content h2 { font-size: 1.1rem; margin: 24px 0 8px 0; color: var(--color-primary); }
.page-content h2:first-child { margin-top: 0; }
.page-content p { margin-bottom: 12px; color: #5a5a7a; }
@media (max-width: 768px) { .page-content { margin: 16px; padding: 20px; } }
</style>
</head> </head>
<body> <body>
<div class="page-header"> <div class="page-header">
<div class="page-header-inner"> <div class="page-header-inner">
<h1><i class="fa-solid fa-shield-halved"></i> Datenschutzerklärung</h1> <h1><i class="fa-solid fa-lock"></i> Datenschutz</h1>
<a href="index.php"><i class="fa-solid fa-arrow-left"></i> Zurück zur Karte</a> <div class="page-header-nav">
<a href="index.php"><i class="fa-solid fa-arrow-left"></i> Zurück zur Karte</a>
</div>
</div> </div>
</div> </div>
<div class="page-content"> <div class="page-container">
<h2>Verantwortliche Stelle</h2> <div class="page-content-box">
<p>Stadt <?= htmlspecialchars($municipality['name']) ?></p> <div class="dev-notice">
<p>Die vollständigen Kontaktdaten werden hier ergänzt, sobald das Portal in den Produktivbetrieb geht.</p> <i class="fa-solid fa-triangle-exclamation"></i>
Dieses Portal befindet sich in der Entwicklung und wurde nicht offiziell beauftragt. Die Datenschutzerklärung wird mit der offiziellen Inbetriebnahme hier hinzugefügt.
<h2>Erhobene Daten</h2> </div>
<p>Das Bürgerbeteiligungsportal speichert die von Ihnen eingegebenen Beiträge (Titel, Beschreibung, Geometrie, Name) sowie Ihre Abstimmungen zur Durchführung der Bürgerbeteiligung.</p> <h2>Datenschutz</h2>
<p>Die Datenschutzerklärung wird hier hinzugefügt, sobald das Portal in den Produktivbetrieb geht.</p>
<h2>Zweck der Verarbeitung</h2> </div>
<p>Die Daten werden ausschließlich zur Durchführung und Auswertung der Bürgerbeteiligung verwendet.</p>
<h2>Weitergabe an Dritte</h2>
<p>Ihre Daten werden nicht an Dritte weitergegeben.</p>
<h2>Ihre Rechte</h2>
<p>Sie haben das Recht auf Auskunft, Berichtigung und Löschung Ihrer Daten. Kontaktieren Sie hierzu die verantwortliche Stelle.</p>
<h2>Cookies und Sitzungsdaten</h2>
<p>Das Portal verwendet Sitzungscookies zur Speicherung Ihres Namens während der Nutzung. Diese werden beim Schließen des Browsers gelöscht.</p>
</div> </div>
</body> </body>
</html> </html>

File diff suppressed because it is too large Load Diff