fix: add P0 accessibility fixes to sidebar icon bar and search form

- Add :focus-visible outline to icon bar buttons/links (desktop + mobile)
- Add aria-label to icon bar <nav> for screen reader landmark distinction
- Add role="search" to sidebar search form
- Add "Main menu" / "Hauptmenü" translation key

Workflow: A11Y-SIDEBAR-P0-001

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-24 14:12:49 +01:00
parent 07fbb96246
commit 0c334731b2
5 changed files with 18 additions and 2 deletions

View File

@@ -53,6 +53,14 @@ aside.aside-icon-bar li button.active {
background: var(--app-icon-bar-hover-bg);
}
aside.aside-icon-bar li a:focus-visible,
aside.aside-icon-bar li button:focus-visible {
outline: 2px solid var(--app-primary-focus);
outline-offset: -2px;
border-left-color: transparent;
color: var(--app-contrast);
}
@media (min-width: 768px) {
aside.aside-icon-bar {
border-right: var(--app-icon-bar-border);
@@ -106,6 +114,12 @@ aside.aside-icon-bar li button.active {
border-top: var(--app-icon-bar-border-width) solid var(--app-primary);
}
aside.aside-icon-bar li a:focus-visible,
aside.aside-icon-bar li button:focus-visible {
border-left-color: transparent;
border-top-color: transparent;
}
.app-main-content,
footer.site-footer {
padding-bottom: max(