feat(quote-carousel): add QuoteCarouselBlock component and related types
Deploy / verify (push) Successful in 41s
Deploy / deploy (push) Successful in 1m1s

- Introduced a new QuoteCarouselBlock component for displaying rotating quotes.
- Added QuoteCarouselBlockData interface to define the structure of the quote carousel data.
- Updated existing components and types to integrate the new quote carousel functionality.
- Enhanced blog-utils to support filtering posts by tags more effectively.
- Made various UI improvements in the Footer and PostCard components for better user experience.
This commit is contained in:
Peter Meier
2026-04-18 13:19:59 +02:00
parent 3949df31bb
commit 597b920e7c
8 changed files with 285 additions and 52 deletions
+18 -1
View File
@@ -33,11 +33,21 @@
const eventDate = $derived(p.isEvent && p.eventDate ? p.eventDate : null);
const locationText = $derived(p.eventLocation?.text ?? null);
const tagSlugs = $derived(
(post.postTag ?? []).map((t) =>
typeof t === "string" ? t : ((t as { _slug?: string })?._slug ?? ""),
),
);
const hasTerminTag = $derived(tagSlugs.includes("tag-termin"));
const isPastEvent = $derived(
hasTerminTag && !!p.eventDate && new Date(p.eventDate).getTime() < Date.now(),
);
</script>
<a
href={href}
class="transition-all flex flex-col text-slate-950 no-underline overflow-hidden border border-gray-200 bg-white"
class="transition-all flex flex-col text-slate-950 no-underline overflow-hidden border border-gray-200 bg-white relative {isPastEvent ? 'opacity-70 grayscale' : ''}"
>
<div class="relative aspect-3/2 w-full overflow-hidden bg-gray-100">
{#if rawImg}
@@ -70,6 +80,13 @@
<EventBadges {eventDate} {locationText} />
</div>
{/if}
{#if isPastEvent}
<div class="absolute top-2 right-2">
<span class="inline-flex items-center gap-1 rounded-full bg-neutral-800/90 px-2.5 py-1 text-[.65rem] font-semibold uppercase tracking-wide text-white shadow-sm">
Vergangen
</span>
</div>
{/if}
</div>
<div class="flex-1 flex flex-col justify-start p-4">
<PostMeta