feat(frist): Deadline-Banner im AnnouncementBanner-Look (rot), nur ein Balken
Deploy / verify (push) Successful in 1m11s
Deploy / deploy (push) Successful in 1m29s

- Look wie AnnouncementBanner: kompakte zentrierte Leiste, weiße Schrift, 0.7rem,
  variant-Farbe (urgent=rot), flex-wrap → fließt/stackt sauber mobil
- Countdown als dunkles Badge (bg-black/20)
- Layout: aktive Frist verdrängt NEU-Banner → nie 2 Balken über der Navi

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Peter Meier
2026-07-01 15:32:40 +02:00
parent f7529d3b47
commit 7a490b1ae1
2 changed files with 44 additions and 54 deletions
+15 -3
View File
@@ -26,6 +26,19 @@
*/
const isEmbed = $derived(($page.route.id ?? '').startsWith('/(embed)'));
// Nur EIN Balken über der Navi: aktive Frist hat Vorrang, sonst NEU-Banner.
const deadlineActive = $derived.by(() => {
const b = data.deadlineBanner as { mode?: string; date?: string; items?: unknown[] } | null;
if (!b) return false;
if (b.mode === 'auto') return (b.items ?? []).length > 0;
if (!b.date) return false;
const d = new Date(b.date);
if (Number.isNaN(d.getTime())) return false;
const today = new Date(); today.setHours(0, 0, 0, 0);
const t = new Date(d); t.setHours(0, 0, 0, 0);
return t.getTime() >= today.getTime();
});
// Live-preview reload bridge: when the page was loaded with
// `?preview_draft=...`, accept `rustycms:reload` postMessage events from the
// admin iframe parent and re-run the SvelteKit `load()` so the iframe
@@ -329,10 +342,9 @@
class="sr-only focus:not-sr-only focus:fixed focus:top-2 focus:left-2 focus:z-[100] focus:bg-white focus:px-3 focus:py-2 focus:shadow focus:outline focus:outline-2 focus:outline-wald-600 focus:rounded-xs"
>Zum Inhalt springen</a>
<div class="flex min-h-screen flex-col text-stein-900">
{#if data.deadlineBanner}
{#if deadlineActive && data.deadlineBanner}
<DeadlineBannerBlock block={data.deadlineBanner} />
{/if}
{#if data.announcementBanner}
{:else if data.announcementBanner}
<AnnouncementBanner banner={data.announcementBanner} />
{/if}
{#if pageData?.preview || pageData?.previewDraft}