Merge "Remove custom handling of aria-expanded in Vector checkbox hack buttons"

This commit is contained in:
jenkins-bot 2022-03-21 18:03:14 +00:00 committed by Gerrit Code Review
commit 08efa139be
7 changed files with 2 additions and 36 deletions

View File

@ -43,7 +43,5 @@
"vector-anon-user-menu-pages-label": "Learn more about editing",
"vector-personal-more-label": "User links",
"vector-main-menu-tooltip": "Main menu",
"tooltip-vector-anon-user-menu-title": "More options",
"vector-menu-checkbox-expanded": "expanded",
"vector-menu-checkbox-collapsed": "collapsed"
"tooltip-vector-anon-user-menu-title": "More options"
}

View File

@ -58,7 +58,5 @@
"vector-anon-user-menu-pages-label": "Accessible version of 'vector-anon-user-menu-pages' link text, prompts user to learn more about editing",
"vector-personal-more-label": "Label describing the user links next to the user links dropdown menu.",
"vector-main-menu-tooltip": "Used as title attribute for main menu icon on hover.",
"tooltip-vector-anon-user-menu-title": "Used as title attribute for user menu icon on hover for anonymous users.",
"vector-menu-checkbox-expanded": "Label for expanded state of dropdown menus for screen reader or assistive technology users.",
"vector-menu-checkbox-collapsed": "Label for collapsed state of dropdown menus for screen reader or assistive technology users."
"tooltip-vector-anon-user-menu-title": "Used as title attribute for user menu icon on hover for anonymous users."
}

View File

@ -14,10 +14,6 @@
{{/is-dropdown}}
<label id="{{id}}-label" aria-label="{{aria-label}}"{{#heading-class}} class="{{.}}"{{/heading-class}}{{^is-legacy}} aria-hidden="true"{{/is-legacy}}>
{{{html-vector-heading-icon}}}<span class="vector-menu-heading-label">{{label}}</span>
{{#is-dropdown}}
<span class="vector-menu-checkbox-expanded">{{msg-vector-menu-checkbox-expanded}}</span>
<span class="vector-menu-checkbox-collapsed">{{msg-vector-menu-checkbox-collapsed}}</span>
{{/is-dropdown}}
</label>
<div class="vector-menu-content">
{{{html-before-portal}}}

View File

@ -27,8 +27,6 @@
true.
string msg-vector-action-toggle-sidebar The label used by the sidebar button.
string msg-vector-main-menu-tooltip The title attribute for the main menu icon.
string msg-vector-menu-checkbox-expanded Dropdown menu span content for expanded selection in checkbox hack.
string msg-vector-menu-checkbox-collapsed Dropdown menu span content for collapsed selection in checkbox hack.
object data-portlets-sidebar. See Sidebar.mustache for documentation.
object data-footer for footer template partial. see Footer.mustache for documentation.
}}

View File

@ -60,24 +60,6 @@
z-index: @z-index-menu;
}
// Hide elements visually but not from screen readers.
.vector-menu-checkbox-expanded,
.vector-menu-checkbox-collapsed {
.mixin-screen-reader-text();
}
// Reveal correct "expanded" or "collapsed" status text to screen readers based off checked status.
// !important needed to override `.mw-ui-button.mw-ui-icon-element:not(.mw-ui-icon-with-label-desktop) span` rule in core
.vector-menu-checkbox:checked + .vector-menu-heading .vector-menu-checkbox-expanded,
.vector-menu-checkbox:not( :checked ) + .vector-menu-heading .vector-menu-checkbox-collapsed {
display: inline !important; /* stylelint-disable-line declaration-no-important */
}
.vector-menu-checkbox:not( :checked ) + .vector-menu-heading .vector-menu-checkbox-expanded,
.vector-menu-checkbox:checked + .vector-menu-heading .vector-menu-checkbox-collapsed {
display: none !important; /* stylelint-disable-line declaration-no-important */
}
// Hide and show menu content based off checked status.
.vector-menu-checkbox:checked ~ .vector-menu-content {
opacity: 1;

View File

@ -46,8 +46,6 @@
"vector-opt-out",
"vector-action-toggle-sidebar",
"vector-main-menu-tooltip",
"vector-menu-checkbox-expanded",
"vector-menu-checkbox-collapsed",
"vector-jumptosearch",
"vector-jumptocontent",
"vector-toc-heading",
@ -82,8 +80,6 @@
"navigation-heading",
"vector-action-toggle-sidebar",
"vector-main-menu-tooltip",
"vector-menu-checkbox-expanded",
"vector-menu-checkbox-collapsed",
"vector-jumptonavigation",
"vector-jumptosearch",
"vector-jumptocontent",

View File

@ -6,8 +6,6 @@ describe( 'sticky header', () => {
menu.innerHTML = `<input type="checkbox" id="p-personal-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-p-personal" class="vector-menu-checkbox" aria-labelledby="p-personal-label" aria-expanded="true">
<h3 id="p-personal-label" aria-label="" class="vector-menu-heading mw-ui-button mw-ui-quiet mw-ui-icon mw-ui-icon-element mw-ui-icon-wikimedia-userAvatar" aria-hidden="true">
<span class="vector-menu-heading-label">Personal tools</span>
<span class="vector-menu-checkbox-expanded">expanded</span>
<span class="vector-menu-checkbox-collapsed">collapsed</span>
</h3>
<div class="vector-menu-content">
<ul class="vector-menu-content-list">