diff --git a/app/components/contact-form.php b/app/components/contact-form.php index 0cf65d9..b416d63 100644 --- a/app/components/contact-form.php +++ b/app/components/contact-form.php @@ -9,6 +9,15 @@ declare(strict_types=1); * $return string optional — Slug der absendenden Seite (Default '' = Startseite). Die Action * leitet nach PRG hierher zurück (whitelist-validiert), damit /kontakt nicht auf die * Startseite springt. + * $notice string optional — hervorgehobener Hinweis DIREKT über dem Formular, plus + * $noticeTitle für die Überschrift dazu. Für Dinge, die man wissen muss, BEVOR + * man schreibt (Wartelisten-Status der Turnabteilung). Steht bewusst außerhalb + * des
und damit außerhalb der role="status"-Region: das ist ein + * dauerhafter Hinweis, keine Rückmeldung zum Absenden — in der Live-Region + * würde ihn ein Screenreader bei jeder Formularmeldung erneut vorlesen. + * Der Text selbst gehört in die data/*.json der aufrufenden Seite, damit er + * nicht zweimal existiert (auf /turnen ist es derselbe Hinweis, den + * group-schedule.php auf der Kinderturn-Unterseite als Kachel zeigt). * $department string optional — '' (allgemein) oder 'turnen'. Steuert Auswahlliste, * Empfänger und Feldregeln über contact_variant() (helpers.php, einzige Quelle). * Die Turn-Variante geht an die Abteilung statt an info@ und braucht keinen @@ -21,6 +30,8 @@ declare(strict_types=1); $club = json_load('club'); $return = $return ?? ''; $intro = $intro ?? null; +$notice = $notice ?? ''; +$noticeTitle = $noticeTitle ?? ''; $variant = contact_variant((string) ($department ?? '')); $interests = $variant['interests']; @@ -68,6 +79,20 @@ $f = [

Oder direkt per Mail an

+ + + + diff --git a/app/components/group-schedule.php b/app/components/group-schedule.php index f041062..81a448b 100644 --- a/app/components/group-schedule.php +++ b/app/components/group-schedule.php @@ -7,6 +7,10 @@ declare(strict_types=1); * $location array{venue, street?, zip?, city?} (optional) — Trainingsort + „Route planen" * $lead string (optional) — verantwortliche Übungsleitung (Akzent-Kachel) * $notice string (optional) — hervorgehobener Hinweis (z. B. Wartelisten-Status) + * $noticeTitle string (optional) — Überschrift dazu. Ohne sie liest sich die rote Kachel + * wie eine Fehlermeldung; mit ihr ist auf einen Blick klar, dass es eine + * Information ist. Dieselben zwei Felder rendert contact-form.php über dem + * Formular, damit der Hinweis nur EINMAL in data/turnen.json steht. * $groups array von Gruppen: * { name, level?, intro?, details?:[{heading,text}], recommendation?, note?, * trainers?:[…], sessions:[{ label?, day, time, note?, trainers?:[…] }] } @@ -22,6 +26,7 @@ $anchor = $anchor ?? 'training'; $groupsTitle = $groupsTitle ?? 'Unsere Gruppen'; $lead = $lead ?? ''; $notice = $notice ?? ''; +$noticeTitle = $noticeTitle ?? ''; $footnote = $footnote ?? ''; $groups = $groups ?? []; $location = $location ?? []; @@ -80,7 +85,12 @@ $soleNote = $single ? ($groups[0]['note'] ?? '') : '';
-

+
+ +

+ +

+
diff --git a/app/pages/turnen-eltern-kind.php b/app/pages/turnen-eltern-kind.php index a042a53..6e2c0ce 100644 --- a/app/pages/turnen-eltern-kind.php +++ b/app/pages/turnen-eltern-kind.php @@ -27,7 +27,8 @@ component('hero', ['hero' => $d['hero']]); component('group-schedule', [ 'location' => $d['location'] ?? [], 'lead' => $d['lead'] ?? '', - 'notice' => $d['notice'] ?? '', + 'notice' => $d['notice'] ?? '', + 'noticeTitle' => $d['notice_title'] ?? '', 'groups' => $d['groups'] ?? [], 'footnote' => $data['footnote'] ?? '', ]); \ No newline at end of file diff --git a/app/pages/turnen.php b/app/pages/turnen.php index 4d99fe3..093ca02 100644 --- a/app/pages/turnen.php +++ b/app/pages/turnen.php @@ -94,8 +94,17 @@ component('team-cards', [ $page['faq'] ?? []]); +/* Der Wartelisten-Hinweis steht DIREKT über dem Formular, so wie auf der alten Seite. + Grund ist Arbeitsaufwand in der Abteilung, kein Design: fuer „Tiger" und „Huehner" + kommen laufend Anfragen nach einem Wartelistenplatz, den es nicht gibt, und jede muss + einzeln beantwortet werden. Wer hier schreibt, soll es vorher lesen. Der Text kommt aus + derselben Stelle wie die Kachel auf der Kinderturn-Unterseite + (disciplines.eltern-kind-turnen.notice), ein Hinweis und eine Quelle. */ +$kinderturnen = json_load('turnen')['disciplines']['eltern-kind-turnen'] ?? []; component('contact-form', [ - 'intro' => $page['contact'], - 'return' => 'turnen', - 'department' => 'turnen', + 'intro' => $page['contact'], + 'return' => 'turnen', + 'department' => 'turnen', + 'notice' => $kinderturnen['notice'] ?? '', + 'noticeTitle' => $kinderturnen['notice_title'] ?? '', ]); diff --git a/data/turnen.json b/data/turnen.json index b1b43a8..c311f59 100644 --- a/data/turnen.json +++ b/data/turnen.json @@ -104,7 +104,8 @@ "layout": "blocks", "location": { "venue": "Mäximum Gym", "street": "Thurnauer Str. 51", "zip": "95326", "city": "Kulmbach" }, "lead": "Annelie Frisque", - "notice": "Aktuell sind alle Kinderturngruppen belegt. Bei Interesse setzen wir sie gerne auf die Warteliste.", + "notice_title": "Hinweis zur Warteliste", + "notice": "Für die Gruppen „Tiger“ und „Hühner“ (ab 8 Jahre) können wir derzeit leider keine neuen Mitglieder aufnehmen und führen deshalb aktuell keine Warteliste. Die übrigen Kinderturngruppen sind ebenfalls belegt, dort nehmen wir dein Kind aber gerne auf die Warteliste.", "groups": [ { "name": "Eltern-Kind-Turnen", diff --git a/public/assets/css/components.css b/public/assets/css/components.css index 6488a08..3a9a138 100644 --- a/public/assets/css/components.css +++ b/public/assets/css/components.css @@ -1771,6 +1771,47 @@ margin-top: var(--space-s); } +/* Hinweis direkt über dem Formular (Wartelisten-Status). Bewusst dieselbe Optik wie + .turnen-dash__notice, damit es auf /turnen und der Kinderturn-Unterseite als ein und + derselbe Hinweis erkennbar ist. Kommt ein dritter Ort dazu, gehören die gemeinsamen + Eigenschaften in eine geteilte .notice-Klasse; für zwei wäre das verfrüht. + Weiß auf --clr-accent erreicht 4,92:1 und trägt damit Fließtext (WCAG 1.4.3); + die Breite folgt dem Formular (.form max-width: 720px), sonst stünde der Kasten + sichtbar über die Feldkante hinaus. */ +.contact__notice { + display: flex; + align-items: flex-start; + gap: var(--space-xs); + width: 100%; + max-width: 720px; + padding: var(--pad-card); + border-radius: var(--radius-card); + background: var(--clr-accent); + color: #fff; +} + +.contact__notice-icon { + flex: none; + margin-top: 0.15em; + font-size: var(--icon-inline-lg); +} + +.contact__notice-title { + margin: 0 0 var(--space-3xs); + font-family: var(--ff-body); + font-size: var(--fs-600); + letter-spacing: var(--ls-caps); + text-transform: uppercase; + color: #fff; +} + +.contact__notice p { + margin: 0; + max-width: none; + font-size: var(--fs-600); + line-height: 1.5; +} + .form { display: grid; gap: var(--space-m); @@ -2683,6 +2724,17 @@ line-height: 1.5; } +/* Abel statt Coolvetica: die Zeile ist mit ~19px weit unter den 28px, ab denen der + Condensed-Schnitt in Versalien lesbar bleibt (siehe CLAUDE.md, Design). */ +.turnen-dash__notice-title { + margin: 0 0 var(--space-3xs); + font-family: var(--ff-body); + font-size: var(--fs-600); + letter-spacing: var(--ls-caps); + text-transform: uppercase; + color: #fff; +} + .turnen-dash__notice-icon { flex: none; margin-top: 0.1em;