Erster Wurf

This commit is contained in:
2026-02-21 15:16:27 +01:00
parent 70ba4a0279
commit c6a3c5b3df
10 changed files with 270 additions and 107 deletions

View File

@@ -1,11 +1,39 @@
<!DOCTYPE html>
<html>
<head>
<title>Admin - Öffnungszeiten</title>
<title>Administration - Öffnungszeiten</title>
<style>
body { font-family: sans-serif; padding: 40px; line-height: 1.6; }
.btn { background: #ff4757; color: white; padding: 10px 20px; text-decoration: none; border-radius: 5px; }
.btn {
display: inline-block;
background: #ff4757;
color: white;
padding: 10px 20px;
text-decoration: none;
border-radius: 5px;
border: none;
cursor: pointer;
}
.card { border: 1px solid #ddd; padding: 20px; margin-bottom: 20px; border-radius: 8px; }
/* Flex-Container für die Linksbündigkeit (Standard) */
.input-row {
margin-top: 15px;
display: flex;
justify-content: flex-start; /* Alles nach links */
align-items: center;
gap: 25px; /* Abstand zwischen den Paaren (Tage / Zeilen) */
}
/* Gruppiert Label und Input eng zusammen */
.input-group {
display: flex;
align-items: center;
gap: 8px;
}
.hint { text-align: left; font-size: 13px; color: #666; margin-top: 10px; }
.action-row { text-align: left; margin-top: 20px; }
</style>
</head>
<body>
@@ -15,14 +43,58 @@
<h3>Google Sheets Links</h3>
<p><a href="{{ links.times_edit }}" target="_blank">➔ Tabelle: Öffnungszeiten bearbeiten</a></p>
<p><a href="{{ links.remarks_edit }}" target="_blank">➔ Tabelle: Bemerkungen bearbeiten</a></p>
<div class="input-row">
<div class="input-group">
<label for="days_input" style="font-size: 14px;">Tage:</label>
<input type="number" id="days_input" value="0" min="0" style="width: 55px; padding: 4px;">
</div>
<div class="input-group">
<label for="lines_input" style="font-size: 14px;">Zeilen:</label>
<input type="number" id="lines_input" value="0" min="0" style="width: 55px; padding: 4px;">
</div>
</div>
<p class="hint">
Zeilen hat Vorrang vor Tagen. Wenn beide Werte 0 sind, werden die Standard-Tage aus der Config genutzt (aktuell: {{ config_days }}).
</p>
<div class="action-row">
<a id="preview_link" href="/zeiten?test=1" target="_blank" class="btn" style="background: #2ed573;">➔ Vorschau mit Test-Hintergrund</a>
</div>
</div>
<div class="card">
<h3>Cache Management</h3>
<p>Nach Änderungen in Google Sheets muss der Cache gelöscht werden, damit die Website sofort aktualisiert wird.</p>
<a href="/admin/cache-clear" class="btn">Invalidate Cache (Cache löschen)</a>
<p>Der Cache wird automatisch alle 60 Minuten aktualisiert. Nach manuellen Änderungen in Google Sheets können Sie ihn hier sofort leeren.</p>
<a href="/cache-clear" class="btn">Cache jetzt löschen</a>
</div>
<p><a href="/">← Zurück zur Ansicht</a></p>
<p><a href="/zeiten">← Zurück zur Ansicht</a></p>
<script>
const daysInput = document.getElementById('days_input');
const linesInput = document.getElementById('lines_input');
const previewLink = document.getElementById('preview_link');
function updateUrl() {
const days = parseInt(daysInput.value) || 0;
const lines = parseInt(linesInput.value) || 0;
let url = "/zeiten?test=1";
if (lines > 0) {
url += `&lines=${lines}`;
} else if (days > 0) {
url += `&days=${days}`;
}
previewLink.href = url;
}
daysInput.addEventListener('input', updateUrl);
linesInput.addEventListener('input', updateUrl);
</script>
</body>
</html>
</html>

View File

@@ -1,45 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
/* Für Wix: background auf transparent stellen */
body { font-family: sans-serif; color: white; background: black; margin: 0; padding: 10px; }
table { width: 100%; border-collapse: collapse; max-width: 500px; table-layout: fixed; }
td { padding: 10px 5px; border-bottom: 1px solid #333; font-size: 14px; vertical-align: middle; }
/* Spalten-Definitionen */
.col-wt { text-align: left; width: 45px; font-weight: bold; }
.col-date { text-align: right; width: 55px; color: #aaa; }
.col-time { text-align: right; width: 100px; }
.col-closed { text-align: center; font-style: italic; opacity: 0.6; }
.remarks { margin-top: 30px; font-size: 13px; color: #ccc; border-top: 1px solid #444; padding-top: 15px; line-height: 1.6; }
</style>
</head>
<body>
<table>
{% for event in events %}
<tr>
<td class="col-wt">{{ event.Wochentag }}.</td>
<td class="col-date">{{ event.Datum.strftime('%d.%m.') }}</td>
{% if not event.Morgen and not event.Nachmittag %}
<td colspan="2" class="col-closed">geschlossen</td>
{% else %}
<td class="col-time">{{ event.Morgen }}</td>
<td class="col-time">{{ event.Nachmittag }}</td>
{% endif %}
</tr>
{% endfor %}
</table>
{% if remarks %}
<div class="remarks">
{% for r in remarks %}
<div style="margin-bottom: 8px;">• {{ r }}</div>
{% endfor %}
</div>
{% endif %}
</body>
</html>

108
templates/zeiten.html Normal file
View File

@@ -0,0 +1,108 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body { font-family: sans-serif; color: white; background: transparent; margin: 0; padding: 0; }
@font-face {
font-family: 'BrittanySignature';
src: url('/static/BrittanySignature.woff2') format('woff2');
font-weight: normal;
font-style: normal;
font-display: swap; /* Verhindert unsichtbaren Text beim Laden */
}
.monat {
font-size: 25px;
font-weight: bold;
padding: 1.5ex 0.5em 0.5ex 0.5em;
color: rgba(255, 255, 255, 0.9);
font-family: 'BrittanySignature', cursive, sans-serif;
}
table {
border-collapse: collapse;
table-layout: fixed; /* Garantiert gleiches Alignment über mehrere Tabellen */
width: 100%;
margin-bottom: 10px;
}
td {
padding: 0.5ex 0.5em;
font-size: 15px;
vertical-align: top;
white-space: nowrap;
/* border-top: 1px solid rgba(255, 255, 255, 0.2);
border-bottom: 1px solid rgba(255, 255, 255, 0.2); */
}
/* tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, 0.1); } */
tr { background-color: rgba(255, 255, 255, 0.1); }
tr.week-spacer { border: none !important; background: transparent !important; height: 15px; }
/* Feste Prozentwerte für identische Spalten in allen Tabellen */
.col-wt { text-align: left; width: 9%; padding-right: 0; }
.col-date { text-align: right; width:14%; }
.col-time { text-align: right; width: 37%; }
.col-closed { text-align: center; }
.remarks-section { margin-top: 1ex; }
.remark-item { margin-top: 0ex; margin-bottom: 0.5ex; text-align: center; }
</style>
</head>
<body>
{% if test %}
<div style="width: 300px ; margin: 20px auto; padding: 10px; background: rgb(55, 55, 55); border-radius: 8px;">
{% endif %}
{% set monate = ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'] %}
{% set ns = namespace(last_month=none, last_week=none) %}
{% for event in events %}
{% set current_month_name = monate[event.Datum.month - 1] %}
{% set current_week = event.Datum.isocalendar()[1] %}
{# Monatstitel und Tabellen-Start/Ende Logik #}
{% if current_month_name != ns.last_month %}
{% if ns.last_month is not none %} </table> {% endif %}
<div class="monat">{{ current_month_name }}</div>
<table>
{% set ns.last_week = none %} {# Reset Wochendistanz bei neuem Monat #}
{% endif %}
{# Wochen-Abstand innerhalb eines Monats #}
{% if ns.last_week is not none and current_week != ns.last_week %}
<tr class="week-spacer"><td colspan="4"></td></tr>
{% endif %}
<tr class="data-row">
<td class="col-wt">{{ event.Wochentag }}.</td>
<td class="col-date">{{ event.Datum.strftime('%d.%m.') }}</td>
{% if not event.Morgen and not event.Nachmittag %}
<td colspan="2" class="col-closed">geschlossen</td>
{% else %}
<td class="col-time">{{ event.Morgen }}</td>
<td class="col-time">{{ event.Nachmittag }}</td>
{% endif %}
</tr>
{% set ns.last_month = current_month_name %}
{% set ns.last_week = current_week %}
{% endfor %}
</table>
{% if remarks %}
<div class="remarks-section">
{% for r in remarks %}
<div class="remark-item">{{ r | safe }}</div>
{% endfor %}
</div>
{% endif %}
{% if test %}
</div>
{% endif %}
</div>
</body>
</html>