Wartelisten-Hinweis für Tiger und Hühner, über dem Anfrageformular

Die Turnabteilung (Maxi) beantwortet laufend Anfragen nach einem Wartelistenplatz
für „Tiger" und „Hühner", den es nicht gibt. Auf der alten Seite stand der Hinweis
direkt über dem Anfrageformular, hier fehlte er.

Schlimmer: an der Stelle stand das GEGENTEIL. Der bisherige Hinweis lautete
"Aktuell sind alle Kinderturngruppen belegt. Bei Interesse setzen wir sie gerne
auf die Warteliste." — für alle Kindergruppen, also auch für die beiden, die
keine Liste führen. Der Satz hat einen Teil der Anfragen vermutlich erst erzeugt.
Er ist nicht gelöscht, sondern auf die übrigen Gruppen eingegrenzt und aufs Du
umgestellt (Haus-Stil; vorher stand dort klein "sie").

Der Text steht genau EINMAL, in data/turnen.json unter
disciplines.eltern-kind-turnen.notice + notice_title. Zwei Stellen lesen ihn:
die rote Kachel auf /turnen/eltern-kind-turnen (gab es schon) und neu ein Block
direkt über dem Formular auf /turnen. Ändert die Abteilung die Lage, ist das eine
Zeile in einer Datei.

Umsetzung:
- notice_title ist neu, weil eine rote Fläche ohne Überschrift wie eine
  Fehlermeldung liest. Abel statt Coolvetica, der Schnitt ist bei ~19px in
  Versalien unleserlich (CLAUDE.md, Design).
- Der Block steht AUSSERHALB des <form> und damit außerhalb der
  role="status"-Region: ein dauerhafter Hinweis, keine Rückmeldung zum Absenden.
  In der Live-Region läse ihn ein Screenreader bei jeder Formularmeldung erneut
  vor. Kein role="alert", er steht schon beim Laden da.
- Überschrift als h3 unter der h2 des Intro-Blocks, damit die Folge nicht springt.
- .contact__notice übernimmt bewusst die Optik von .turnen-dash__notice, damit
  beide Stellen als derselbe Hinweis erkennbar sind. Weiß auf --clr-accent
  erreicht 4,92:1 und trägt damit Fließtext (WCAG 1.4.3). Kommt ein dritter Ort
  dazu, gehören die gemeinsamen Eigenschaften in eine geteilte .notice-Klasse;
  für zwei wäre das verfrüht.

Gemessen: Hinweisbreite gleich Formularbreite (720px bei 1280, 347px bei 390),
kein Überlauf. preflight ohne neue Meldungen.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01NzeVVgMCrzCDJAKeLEdKr7

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 <form> 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 = [
                     <p><?= e($intro['text']) ?></p>
                     <p class="text-muted">Oder direkt per Mail an <a href="mailto:<?= e($directMail) ?>"><?= e($directMail) ?></a></p>
                 </div>
+<?php endif; ?>
+<?php if ($notice !== ''): ?>
+<?php /* h3, weil der Intro-Block direkt darüber die h2 der Sektion trägt — so bleibt die
+         Überschriften-Folge ohne Sprung. Kein role="alert": der Hinweis steht schon beim
+         Laden da und ist keine Reaktion auf eine Eingabe. */ ?>
+                <aside class="contact__notice">
+                    <?= icon('info-circle', 'contact__notice-icon') ?>
+                    <div>
+<?php if ($noticeTitle !== ''): ?>
+                        <h3 class="contact__notice-title"><?= e($noticeTitle) ?></h3>
+<?php endif; ?>
+                        <p><?= e($notice) ?></p>
+                    </div>
+                </aside>
 <?php endif; ?>
                 <form class="form" method="post" action="<?= e(url('kontakt-senden')) ?>" novalidate>
                     <?php /* autofocus nur beim 422-Re-Render: bringt den Fokus auch ohne JS in die Fehlermeldung */ ?>

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'] ?? '') : '';
 <?php if ($notice !== ''): ?>
                     <article class="bento__tile turnen-dash__notice">
                         <?= icon('info-circle', 'turnen-dash__notice-icon') ?>
-                        <p><?= e($notice) ?></p>
+                        <div>
+<?php if ($noticeTitle !== ''): ?>
+                            <h2 class="turnen-dash__notice-title"><?= e($noticeTitle) ?></h2>
+<?php endif; ?>
+                            <p><?= e($notice) ?></p>
+                        </div>
                     </article>
 <?php endif; ?>
 <?php if ($single): ?>