Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

The focus indicator does not display properly for some of the headings in the navigation menu #114

Closed
jakubmiarka opened this issue Sep 18, 2019 · 1 comment
Closed

The focus indicator does not display properly for some of the headings in the navigation menu #114

jakubmiarka opened this issue Sep 18, 2019 · 1 comment
Labels
accessibility accessibility-statement
Milestone
2.0.6

Comments

@jakubmiarka
Copy link
Contributor

jakubmiarka commented Sep 18, 2019 •
edited by NickColley
Loading

Under certain circumstances* the headings in the sidebar (which are collapsible) are not wrapped within <span> causing the heading not to be highlighted when focused/tabbing through. Failing the WCAG 2.1. success criterion 2.4.7 (focus visible).

See the example here.

*I think it's the combination of the toc_level config and a use of nested pages

This fails WCAG 2.1 success criterion 2.4.7 (focus visible).
@NickColley NickColley changed the title Sidebar headings are incorrectly marked up The focus indicator does not display properly for some of the headings in the navigation menu. Oct 15, 2019
@NickColley NickColley changed the title The focus indicator does not display properly for some of the headings in the navigation menu. The focus indicator does not display properly for some of the headings in the navigation menu Oct 15, 2019
@NickColley
Copy link
Contributor

Can reproduce this on the tech docs template website too: https://tdt-documentation.london.cloudapps.digital/#technical-documentation-template

NickColley added a commit that referenced this issue Oct 18, 2019
@NickColley
Ensure nested pages have visible focus states
5e7f6ce 
Nested pages render links within the sidebar differently.
Spans are required to show a focus state, so by adding this it makes
these nested links consistent with the rest of the navigation.

Fixes #114
@NickColley NickColley added this to the 2.0.6 milestone Oct 18, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
accessibility accessibility-statement
Projects
None yet
Milestone
2.0.6
Development

No branches or pull requests
2 participants
@NickColley @jakubmiarka