fix($theme-default): display header-anchor links when using keyboard navigation #2699
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
a11y: When using keyboard navigation the header-anchor link (the # tag before the heading) is not visible, this PR fixies this bug.
What kind of change does this PR introduce?
Does this PR introduce a breaking change?
The PR fulfills these requirements:
fix #xxx[,#xxx]
, where "xxx" is the issue number)You have tested in the following browsers: (Providing a detailed version will be better.)
Other information:
To recreate the issue, try navigating using you keyboard (with the
TAB
key) in a page with manyh1
-h6
headings. You won't see the heading-anchor link (the # tag before the heading). But when you hover with your mouse over a heading you will see the heading-anchor link.Why? because the code uses only
:hover
(for mouse users). It should also include:focus
(for keyboard users).