maro
526a908c80
Replaces em dashes with en dashes across all hardcoded copy, emails, and seed content, then reworks the site's visual language so it reads as deliberately designed rather than assembled from generic components: - New ArrowLink component replaces ad hoc "Mehr erfahren ->" links and ghost buttons; one shared FormField (TextField/TextAreaField) replaces 7 near-duplicate field styles across every form - Navbar loses its glassmorphism blur for a solid warm background, gets a subtle active-link underline and a softer, warmer mega-menu - PageHeader supports per-page blob tone/position and a compact mode instead of an identical band on every interior page - Homepage: the core offer is featured large instead of four equal cards, the philosophy section gets a single calmer accent blob, blog teasers now show their cover image like the real /aktuelles page does - Booking calendar and widget: 44px touch targets throughout (month nav, day cells, time slots, cancel action), a visible "today" ring, and responsive padding so the calendar isn't cramped on small screens - Quieter, warmer empty states on /termine and /aktuelles No functional changes: all interaction logic (nav menus, forms, booking, CMS data fetching) is untouched, only markup and styling.
77 lines
2.9 KiB
TypeScript
77 lines
2.9 KiB
TypeScript
import type { Metadata } from "next";
|
||
import { PageHeader } from "@/components/PageHeader";
|
||
import { Section } from "@/components/Section";
|
||
import { Reveal } from "@/components/Reveal";
|
||
import { EventTeaserCard } from "@/components/EventTeaserCard";
|
||
import { ArrowLink } from "@/components/ArrowLink";
|
||
import { getAllEvents } from "@/lib/payload/content";
|
||
import { buildMetadata } from "@/lib/seo/metadata";
|
||
import { getSiteUrl } from "@/lib/seo/config";
|
||
import { JsonLd, webPageJsonLd } from "@/lib/seo/jsonld";
|
||
|
||
export const dynamic = "force-dynamic";
|
||
|
||
const DESCRIPTION = "Aktuelle Termine und Veranstaltungen von Anouma.";
|
||
|
||
export async function generateMetadata(): Promise<Metadata> {
|
||
return buildMetadata({ title: "Termine", description: DESCRIPTION, path: "/termine" });
|
||
}
|
||
|
||
export default async function TerminePage() {
|
||
const events = await getAllEvents();
|
||
const today = new Date();
|
||
today.setHours(0, 0, 0, 0);
|
||
const upcoming = events.filter((e) => new Date(e.date) >= today).reverse();
|
||
const past = events.filter((e) => new Date(e.date) < today);
|
||
const siteUrl = await getSiteUrl();
|
||
|
||
return (
|
||
<>
|
||
<JsonLd data={webPageJsonLd({ name: "Termine", description: DESCRIPTION, url: `${siteUrl}/termine` })} />
|
||
<PageHeader
|
||
eyebrow="Termine"
|
||
title="Aktuelle Termine"
|
||
lead="Ein Überblick über anstehende Kreise, Begleitungen und Veranstaltungen."
|
||
crumbs={[{ title: "Termine" }]}
|
||
blobTone="mauve"
|
||
blobPosition="top-left"
|
||
/>
|
||
|
||
<Section tone="plain">
|
||
{upcoming.length === 0 ? (
|
||
<div className="rounded-3xl bg-anouma-cream-light p-8 text-center sm:p-10">
|
||
<p className="font-serif text-xl font-medium text-anouma-plum">Aktuell sind keine Termine geplant</p>
|
||
<p className="mt-2 text-base leading-relaxed text-anouma-plum/90">
|
||
Schau gerne bald wieder vorbei, oder melde dich direkt – ich freue mich von dir zu hören.
|
||
</p>
|
||
<div className="mt-5 flex justify-center">
|
||
<ArrowLink href="/kontakt">Zur Kontaktseite</ArrowLink>
|
||
</div>
|
||
</div>
|
||
) : (
|
||
<div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
|
||
{upcoming.map((event, i) => (
|
||
<Reveal key={event.slug} delay={Math.min(i * 0.06, 0.3)}>
|
||
<EventTeaserCard event={event} />
|
||
</Reveal>
|
||
))}
|
||
</div>
|
||
)}
|
||
</Section>
|
||
|
||
{past.length > 0 && (
|
||
<Section tone="warm">
|
||
<h2 className="font-serif text-2xl font-medium text-anouma-plum">Vergangene Termine</h2>
|
||
<div className="mt-8 grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
|
||
{past.map((event) => (
|
||
<div key={event.slug} className="opacity-70">
|
||
<EventTeaserCard event={event} />
|
||
</div>
|
||
))}
|
||
</div>
|
||
</Section>
|
||
)}
|
||
</>
|
||
);
|
||
}
|