mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-09-25 11:17:35 +00:00
405b52054f
- Adds aria-hidden="true" to the sticky header - Adds tabindex="-1" support to Button.mustache and update sticky header button data - Add tabindex to cloned user menu Bug: T290201 Change-Id: I270db0485f08af310fb40365703da1efc07d3cb9
41 lines
1.4 KiB
Plaintext
41 lines
1.4 KiB
Plaintext
{{!
|
|
Sticky header is hidden from screen readers because it contains duplicated content
|
|
that is already accessible to assistive tech via landmark roles, element type, and other navigation methods.
|
|
The interactive elements in the sticky header should have the `tabindex="-1"` attribute set to ensure
|
|
the header is also not tab accessible.
|
|
|
|
See https://dequeuniversity.com/rules/axe/4.1/aria-hidden-focus and https://phabricator.wikimedia.org/T290201
|
|
for more context.
|
|
}}
|
|
<header id="vector-sticky-header" aria-hidden="true"
|
|
class="vector-sticky-header{{#is-visible}} vector-sticky-header-visible{{/is-visible}}">
|
|
<div class="vector-sticky-header-start">
|
|
<div class="vector-sticky-header-icon-start">
|
|
{{#data-button-start}}
|
|
{{>Button}}
|
|
{{/data-button-start}}
|
|
</div>
|
|
{{#data-search}}
|
|
{{>SearchBox}}
|
|
{{/data-search}}
|
|
<div class="vector-sticky-header-context-bar">
|
|
<div class="vector-sticky-header-context-bar-primary">{{html-title}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="vector-sticky-header-end">
|
|
<div class="vector-sticky-header-icons">
|
|
{{#data-buttons}}
|
|
{{>Button}}
|
|
{{/data-buttons}}
|
|
</div>
|
|
{{#data-primary-action}}
|
|
{{>Button}}
|
|
{{/data-primary-action}}
|
|
<div class="vector-sticky-header-icon-end">
|
|
<div class="vector-user-links">
|
|
{{! User menu items with unique ids are cloned here from the fixed header in stickyHeader.js. }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|