From ea2cdd4f8978f3784f239d55409e306add89dabe Mon Sep 17 00:00:00 2001 From: rene Date: Fri, 5 Jun 2026 20:23:32 +0200 Subject: [PATCH] =?UTF-8?q?Radar-Timeline:=20Optik=20an=20Status-Pill=20an?= =?UTF-8?q?geglichen=20(hell/Border/Blur,=20Dark-Mode)=20+=20tiefer=20(dir?= =?UTF-8?q?ekt=20=C3=BCber=20die=20Pill)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- VERSION | 2 +- backend/static/css/components.css | 41 +++++++++++++++++-------------- backend/static/index.html | 24 +++++++++--------- backend/static/js/app.js | 2 +- backend/static/landing.html | 2 +- backend/static/sw.js | 2 +- 6 files changed, 39 insertions(+), 34 deletions(-) diff --git a/VERSION b/VERSION index 71db39d..08e9158 100644 --- a/VERSION +++ b/VERSION @@ -1 +1 @@ -1216 \ No newline at end of file +1217 \ No newline at end of file diff --git a/backend/static/css/components.css b/backend/static/css/components.css index 72b89e6..77b70ec 100644 --- a/backend/static/css/components.css +++ b/backend/static/css/components.css @@ -3053,41 +3053,46 @@ html.modal-open { .map-legend::-webkit-scrollbar { display: none; } /* Regenradar-Zeitleiste (RainViewer: ~2h Vergangenheit + ~30min Nowcast, Play/Pause + Slider) */ +/* Optik wie die Status-Pill darunter (hell/cremefarben, Blur, Border), direkt darüber gesetzt. */ .map-radar-timeline { position: absolute; - left: 12px; + left: var(--space-3); right: 88px; /* Platz für die Ecken-FABs (Speed-Dial / Zurück) rechts */ - bottom: calc(60px + env(safe-area-inset-bottom, 0px)); + bottom: calc(var(--space-3) + 40px); /* unmittelbar über der Status-Pill */ z-index: 900; display: flex; align-items:center; - gap: 10px; - padding: 7px 12px; - border-radius: 999px; - background: rgba(15, 22, 35, 0.82); - backdrop-filter: blur(8px); - -webkit-backdrop-filter: blur(8px); - box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35); - color: #fff; + gap: 8px; + padding: 4px 12px 4px 5px; + border-radius: var(--radius-full); + background: rgba(255, 255, 255, 0.88); + backdrop-filter: blur(4px); + -webkit-backdrop-filter: blur(4px); + border: 1px solid var(--c-border-light); + color: var(--c-text); pointer-events: auto; } +:root[data-theme="dark"] .map-radar-timeline { + background: rgba(24, 20, 16, 0.92); + border-color: rgba(255, 255, 255, 0.1); +} .rdr-play { flex-shrink: 0; - width: 34px; height: 34px; + width: 30px; height: 30px; border: none; border-radius: 50%; - background: rgba(255, 255, 255, 0.16); - color: #fff; cursor: pointer; + background: var(--c-surface-2); + color: var(--c-text); cursor: pointer; display: flex; align-items: center; justify-content: center; } -.rdr-play:active { background: rgba(255, 255, 255, 0.3); } -.rdr-slider { flex: 1; min-width: 0; height: 4px; accent-color: #60a5fa; cursor: pointer; } +.rdr-play:active { background: var(--c-border); } +.rdr-slider { flex: 1; min-width: 0; height: 4px; accent-color: var(--c-primary); cursor: pointer; } .rdr-time { flex-shrink: 0; - font-size: 12px; font-weight: 600; + font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; - min-width: 82px; text-align: right; opacity: 0.92; + min-width: 78px; text-align: right; color: var(--c-text-secondary); } -.rdr-time.is-forecast { color: #93c5fd; } /* Nowcast/Vorhersage-Frames bläulich */ +.rdr-time.is-forecast { color: var(--c-primary); } /* Nowcast/Vorhersage-Frames hervorgehoben */ .map-legend-btn { flex-shrink: 0; diff --git a/backend/static/index.html b/backend/static/index.html index a82c60d..60bf077 100644 --- a/backend/static/index.html +++ b/backend/static/index.html @@ -86,14 +86,14 @@ Ban Yaro - + - - - - - + + + + + @@ -617,11 +617,11 @@ - - - - - + + + + + @@ -631,7 +631,7 @@ - + diff --git a/backend/static/js/app.js b/backend/static/js/app.js index b1423dd..1433eb5 100644 --- a/backend/static/js/app.js +++ b/backend/static/js/app.js @@ -3,7 +3,7 @@ Router, State-Management, Navigation, Initialisierung. ============================================================ */ -const APP_VER = '1216'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen +const APP_VER = '1217'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen const APP_VERSION = '1.6.0'; // ← semantische Version, wird bei make release gesetzt window.APP_VER = APP_VER; // global verfügbar für andere Module (z.B. offline-indicator) window.APP_VERSION = APP_VERSION; diff --git a/backend/static/landing.html b/backend/static/landing.html index a68a836..0b01da6 100644 --- a/backend/static/landing.html +++ b/backend/static/landing.html @@ -4,7 +4,7 @@ - + Ban Yaro — Die Hunde-App für Deutschland, Österreich & Schweiz diff --git a/backend/static/sw.js b/backend/static/sw.js index 3c3350a..1affc8c 100644 --- a/backend/static/sw.js +++ b/backend/static/sw.js @@ -4,7 +4,7 @@ ============================================================ */ // ← EINZIGE Stelle für die Version — STATIC_ASSETS und CACHE_VERSION leiten sich ab -const VER = '1216'; +const VER = '1217'; const CACHE_VERSION = `by-v${VER}`; const CACHE_STATIC = `${CACHE_VERSION}-static`; const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten