A11y: ARIA-Semantik (#164) und Reflow 320px (#165) #173

Merged
stwaidele merged 2 commits from a11y-aria into main 2026-07-21 16:29:20 +02:00
Collaborator

Zweite Tranche des A11y-Milestones. GESTAPELT auf PR #172 — bitte #172 zuerst mergen (fast-forward), danach zeigt dieser PR nur noch #164/#165.

#164 ARIA-Semantik: Editorflaeche mit lokalisiertem Namen, im Lesemodus role=document statt unbenanntem Textfeld; eingeklappte Sidebar zusaetzlich inert; li-Zwischenknoten der Listboxen (Wikilink/Mention/Suche) role=presentation; Toolbar mit Pfeiltasten-Navigation und sprechendem Label.

#165 Reflow: Topbar min-width 0 + Umbruch auf schmalen Viewports; Sidebar als Overlay unter 40rem; Footer wickelt; Titel-Input/Settings-Spalte schrumpfen; main per tabindex=0 tastatur-scrollbar (Rechtstexte).

Verifikation: axe-Nachmessung: aria-input-field-name, aria-hidden-focus, aria-required-children/-parent, listitem der Listboxen alle ohne Treffer; 10 Ansichten bei 320px ohne Dokument-Ueberlauf (vorher 892px); e2e editor/sidebar/search/wikilink/content/settings-nav/legal/page-tree gruen. Schliesst #164, #165.

Zweite Tranche des A11y-Milestones. GESTAPELT auf PR #172 — bitte #172 zuerst mergen (fast-forward), danach zeigt dieser PR nur noch #164/#165. **#164 ARIA-Semantik:** Editorflaeche mit lokalisiertem Namen, im Lesemodus role=document statt unbenanntem Textfeld; eingeklappte Sidebar zusaetzlich inert; li-Zwischenknoten der Listboxen (Wikilink/Mention/Suche) role=presentation; Toolbar mit Pfeiltasten-Navigation und sprechendem Label. **#165 Reflow:** Topbar min-width 0 + Umbruch auf schmalen Viewports; Sidebar als Overlay unter 40rem; Footer wickelt; Titel-Input/Settings-Spalte schrumpfen; main per tabindex=0 tastatur-scrollbar (Rechtstexte). **Verifikation:** axe-Nachmessung: aria-input-field-name, aria-hidden-focus, aria-required-children/-parent, listitem der Listboxen alle ohne Treffer; 10 Ansichten bei 320px ohne Dokument-Ueberlauf (vorher 892px); e2e editor/sidebar/search/wikilink/content/settings-nav/legal/page-tree gruen. Schliesst #164, #165.
fable-5 added 4 commits 2026-07-21 14:16:48 +02:00
Gemeinsamer useModalFocus-Hook: Initialfokus in den Dialog, Tab/Shift-Tab
zyklisch gefangen, Fokus-Rückgabe an den Auslöser (bzw. returnFocusRef,
wenn der öffnende Menüpunkt mit dem Menü unmountet). Dialoge tragen jetzt
aria-labelledby auf ihre Überschrift und tabindex=-1 als Fokus-Fallback.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01AGM8jo3hwoV9wsCVGfy8iq
#163: Dokumentsprache und Seitentitel der SPA
Some checks failed
CI / Lint, typecheck, test (pull_request) Successful in 4m43s
CI / Build container images (pull_request) Successful in 1m11s
CI / Auth e2e pack (pull_request) Successful in 7m14s
CI / Import/export fidelity gate (pull_request) Successful in 56s
CD / Deploy to Test (push) Blocked by required conditions
CD / Smoke tests against Test (push) Blocked by required conditions
CD / Promote to Int (push) Blocked by required conditions
CI / Auth e2e pack (push) Blocked by required conditions
CI / Import/export fidelity gate (push) Blocked by required conditions
CI / Build container images (push) Blocked by required conditions
CD / Build and push images (push) Has been cancelled
CI / Lint, typecheck, test (push) Has been cancelled
418aafd5ec
i18n spiegelt die aktive Sprache auf <html lang> (Init + languageChanged;
der User-Locale-Wechsel in auth-context läuft über dasselbe Event). Neuer
useDocumentTitle-Hook setzt je Route einen sprechenden Titel
(Seite — Teich — Dorfteich), verdrahtet in allen Routen-Komponenten;
dynamische Titel folgen den geladenen Daten.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01AGM8jo3hwoV9wsCVGfy8iq
Die Editorfläche bekommt einen lokalisierten zugänglichen Namen und ist
im Lesemodus role=document statt eines unbenannten Textfelds (setOptions
im selben Layout-Effekt wie setEditable). Eingeklappte Sidebar zusätzlich
inert (aria-hidden allein ließ fokussierbare Kinder im Tab-Weg). Die
li-Zwischenknoten der Listboxen (Wikilink-/Mention-Autocomplete,
Suchergebnisse) sind role=presentation, damit listbox→option wieder eine
gültige Eltern-Kind-Beziehung ist. Toolbar: Pfeiltasten-Navigation über
die Controls (native Selects behalten ihre Pfeiltasten) und ein
sprechendes Toolbar-Label statt des Absatz-Buttons-Labels.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01AGM8jo3hwoV9wsCVGfy8iq
#165: Reflow bei 320 px und Tastatur-Scrollbarkeit
Some checks failed
CI / Lint, typecheck, test (pull_request) Successful in 4m39s
CI / Build container images (pull_request) Successful in 4m2s
CI / Auth e2e pack (pull_request) Successful in 7m17s
CI / Import/export fidelity gate (pull_request) Successful in 56s
CD / Deploy to Test (push) Blocked by required conditions
CD / Smoke tests against Test (push) Blocked by required conditions
CD / Promote to Int (push) Blocked by required conditions
CI / Auth e2e pack (push) Blocked by required conditions
CI / Import/export fidelity gate (push) Blocked by required conditions
CI / Build container images (push) Blocked by required conditions
CD / Build and push images (push) Has been cancelled
CI / Lint, typecheck, test (push) Has been cancelled
d4d4282c55
Vier Ursachen des seitenweiten Horizontal-Scrollens behoben: die Topbar
saß mit min-content-Breite in der Grid-Spalte (min-width: 0 nach dem
#100-Muster) und wickelt auf schmalen Viewports auf eine zweite Zeile
(Grid-Zeile minmax, Suchtext wird zum Icon); die aufgeklappte Sidebar
liegt unter 40rem als Overlay über dem Inhalt statt ihn auf einen
Streifen zu quetschen; Footer wickelt; Titel-Input und Settings-Spalte
schrumpfen (min-width bzw. align-items: stretch im Schmal-Layout).
Der Haupt-Scrollbereich ist per tabindex=0 tastatur-scrollbar — auf den
Rechtstext-Seiten gab es sonst keinen Weg, den Inhalt zu scrollen.

Gemessen: 10 Ansichten bei 320 px ohne Dokument-Überlauf (vorher 892 px
Inhaltsbreite); e2e content/settings-nav/sidebar/legal/page-tree/search
grün.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01AGM8jo3hwoV9wsCVGfy8iq
stwaidele merged commit d4d4282c55 into main 2026-07-21 16:29:20 +02:00
Sign in to join this conversation.
No description provided.