fix: fieldset/legend durch echte Überschriften ersetzt, globales CSS vervollständigt

<legend> positioniert sich per Spezifikation immer auf der oberen
Rahmenlinie seines <fieldset> - das lässt sich nicht per CSS aufheben,
nur kaschieren. Die vorherige "Nachbesserung" (mehr Padding/Breite auf
der legend) war ein Pflaster, kein Fix - kam prompt wieder zum
Vorschein, sobald eine neue .form-section-Seite entstand. .form-section
ist jetzt ein <div>, die Überschrift ein normales <h3
class="form-section-title"> mit voller CSS-Kontrolle. Betrifft alle
neun Vorlagen mit diesem Muster.

Zusätzlich alle restlichen unstyled Formulare (Login, Passwort-Reset,
Einladung annehmen, Nutzer anlegen, CSV-Import, Abteilung anlegen,
Firma umbenennen, Fall-Entscheiden) auf dasselbe form-card/form-section/
form-grid-Muster gehoben, für durchgängig konsistentes globales CSS
statt gemischter roher und gestylter Formulare. antrag_neu.html (der
Fragebogen) bleibt bewusst unverändert - dessen fieldset/legend haben
keinen Rahmen-Konflikt und sind an bereits getestete :has()-Adaptivlogik
gekoppelt.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
noroot
2026-09-01 12:18:35 +02:00
parent 7db4707bc5
commit cbe68b16c9
19 changed files with 254 additions and 121 deletions

View File

@@ -582,6 +582,16 @@ button.entfernen {
margin-bottom: 0;
}
/* form-section ist bewusst ein <div>, kein <fieldset> — <legend>
positioniert sich per Spezifikation IMMER auf der oberen Rahmenlinie
des <fieldset> (das ist seine ganze Funktion: die Box zu betiteln),
das lässt sich nicht per CSS aufheben, nur mit fragilen Hacks
kaschieren (padding/Breite anpassen ändert nichts an der
Border-Überlappung selbst — genau das führte zu einer bereits einmal
"reparierten" Überschrift, die nach der nächsten neuen Seite wieder
zu klein/zu randnah aussah). Eine echte Übersicht (.form-section-title)
verhält sich wie jede normale Überschrift: volle CSS-Kontrolle, keine
browserseitigen Sonderregeln. */
.form-section {
border: none;
margin: 0;
@@ -593,16 +603,11 @@ button.entfernen {
border-top: 1px solid var(--color-border);
}
/* <legend> ignoriert das padding des umschließenden <fieldset> (es
positioniert sich an dessen Border-Box, nicht an der Padding-Box) —
ohne eigenes padding-left säße die Abschnittsüberschrift bündig am
Kartenrand, während der restliche Inhalt eingerückt ist. */
.form-section > legend {
padding: 0 0 16px 0;
.form-section-title {
margin: 0 0 16px 0;
font-size: 1.0625rem;
font-weight: 700;
color: var(--color-heading);
width: 100%;
}
.form-grid {