:wheelchair: a11y(bal-nav): Connect Tabs and Overlays - Githubissues

baloise / design-system

The Baloise Design System consists of reusable components and a clearly defined visual style, that can be assembled together to build any number of applications.

https://design.baloise.dev

Apache License 2.0

99 stars 27 forks source link

:wheelchair: a11y(bal-nav): Connect Tabs and Overlays #1416

Closed carolabes closed 1 month ago

carolabes commented 4 months ago

Description of this issue

Main Nav tabs are not linked to the expandable overlays.
This results in an incorrect order for keyboard / screen reader

menue

How to fix it

Connect tabs with overlays via aria-controls and aria-expanded

Additional Information

Level A https://www.w3.org/WAI/WCAG21/Understanding/focus-order.html

aria-controls: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls aria-expanded: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded

Code of Conduct

[X] I agree to follow this project's Code of Conduct

hirsch88 commented 2 months ago

/cib

github-actions[bot] commented 2 months ago

Branch fix/issue-1416 created!