From d54029a523aea2deec548b0771f2c7b2474b3a42 Mon Sep 17 00:00:00 2001 From: bwang Date: Mon, 18 Apr 2022 15:10:12 -0500 Subject: [PATCH] Remove nav element from Vector menus and only render label elements in Vector menus when needed. Add new nav landmarks corresponding to user links, main site nav, and article editing tools. Split out legacy Menu template. Bug: T291304 Bug: T301051 Change-Id: I35c20103e4b45139ef1d3f73c23f6a744aa87a3c --- i18n/en.json | 3 +- i18n/qqq.json | 3 +- includes/SkinVector.php | 11 ++++---- includes/templates/Menu.mustache | 19 +++++++++---- includes/templates/Navigation.mustache | 4 +-- includes/templates/Sidebar.mustache | 4 +-- includes/templates/UserLinks.mustache | 4 +-- includes/templates/legacy/Menu.mustache | 29 ++++++++++++++++++++ includes/templates/legacy/Sidebar.mustache | 6 ++-- includes/templates/legacy/UserLinks.mustache | 2 +- includes/templates/skin-legacy.mustache | 8 +++--- skin.json | 5 +++- 12 files changed, 70 insertions(+), 28 deletions(-) create mode 100644 includes/templates/legacy/Menu.mustache diff --git a/i18n/en.json b/i18n/en.json index 73e81075..d807b11f 100644 --- a/i18n/en.json +++ b/i18n/en.json @@ -42,7 +42,8 @@ "vector-anon-user-menu-pages": "Pages for logged out editors", "vector-anon-user-menu-pages-learn": "learn more", "vector-anon-user-menu-pages-label": "Learn more about editing", - "vector-personal-more-label": "User links", "vector-main-menu-tooltip": "Main menu", + "vector-article-tools-nav-label": "Article tools", + "vector-site-nav-label": "Site", "tooltip-vector-anon-user-menu-title": "More options" } diff --git a/i18n/qqq.json b/i18n/qqq.json index 1bc86d0c..9de1e61c 100644 --- a/i18n/qqq.json +++ b/i18n/qqq.json @@ -57,7 +57,8 @@ "vector-anon-user-menu-pages": "Label describing the anon editor links in the anon user menu", "vector-anon-user-menu-pages-learn": "Lowercase text of link that goes to Help:Introduction and helps the user learn more about editing", "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.", + "vector-article-tools-nav-label": "Accessible label for the article tools nav landmark", + "vector-site-nav-label": "Accessible label for site (main menu) nav landmark", "tooltip-vector-anon-user-menu-title": "Used as title attribute for user menu icon on hover for anonymous users." } diff --git a/includes/SkinVector.php b/includes/SkinVector.php index 4a8b9d8e..f82c7b24 100644 --- a/includes/SkinVector.php +++ b/includes/SkinVector.php @@ -346,13 +346,11 @@ abstract class SkinVector extends SkinMustache { 'data-user-page' => $menuData[ 'data-user-page' ], 'html-vector-watchlist' => $this->getWatchlistHTML( $menuData[ 'data-vector-user-menu-overflow' ] ?? null ), ] ); - $userMoreData = [ + $userMoreData = $this->decoratePortletData( 'data-user-more', [ 'id' => 'p-personal-more', - 'class' => 'mw-portlet mw-portlet-personal-more vector-menu vector-user-menu-more', + 'class' => 'mw-portlet mw-portlet-personal-more vector-user-menu-more', 'html-items' => $userMoreHtmlItems, - 'label' => $this->msg( 'vector-personal-more-label' ), - 'is-dropdown' => false, - ]; + ] ); $userMenuData = $menuData[ 'data-user-menu' ]; if ( $isAnon ) { @@ -857,6 +855,7 @@ abstract class SkinVector extends SkinMustache { case 'data-notifications': case 'data-personal': case 'data-user-page': + case 'data-user-more': $type = self::MENU_TYPE_DEFAULT; break; case 'data-languages': @@ -902,6 +901,8 @@ abstract class SkinVector extends SkinMustache { return $portletData + [ 'is-dropdown' => $type === self::MENU_TYPE_DROPDOWN, + // In modern vector only dropdown and portal menus render a label element + 'has-label' => $this->isLegacy() || $type === self::MENU_TYPE_DROPDOWN || $type === self::MENU_TYPE_PORTAL, ]; } } diff --git a/includes/templates/Menu.mustache b/includes/templates/Menu.mustache index 00b926b2..a5b8b23c 100644 --- a/includes/templates/Menu.mustache +++ b/includes/templates/Menu.mustache @@ -1,23 +1,30 @@ {{! See @typedef MenuDefinition }} -{{! `role` is unnecessary but kept to support selectors in any gadgets or user styles. }} - + diff --git a/includes/templates/Navigation.mustache b/includes/templates/Navigation.mustache index 08c21a9e..bfd3ccac 100644 --- a/includes/templates/Navigation.mustache +++ b/includes/templates/Navigation.mustache @@ -1,5 +1,5 @@
-
+
+ {{#data-portlets-sidebar}}{{>Sidebar}}{{/data-portlets-sidebar}}
diff --git a/includes/templates/Sidebar.mustache b/includes/templates/Sidebar.mustache index d3394af1..5d79131a 100644 --- a/includes/templates/Sidebar.mustache +++ b/includes/templates/Sidebar.mustache @@ -9,7 +9,7 @@ emphasized-sidebar-action data-emphasized-sidebar-action For displaying an emphasized action in the sidebar. }} -
+
+ diff --git a/includes/templates/UserLinks.mustache b/includes/templates/UserLinks.mustache index c6fc8b2b..8ac66a67 100644 --- a/includes/templates/UserLinks.mustache +++ b/includes/templates/UserLinks.mustache @@ -1,4 +1,4 @@ -
+
+ diff --git a/includes/templates/legacy/Menu.mustache b/includes/templates/legacy/Menu.mustache new file mode 100644 index 00000000..4b699107 --- /dev/null +++ b/includes/templates/legacy/Menu.mustache @@ -0,0 +1,29 @@ +{{! + See @typedef MenuDefinition +}} +{{! `role` is unnecessary but kept to support selectors in any gadgets or user styles. }} + + diff --git a/includes/templates/legacy/Sidebar.mustache b/includes/templates/legacy/Sidebar.mustache index 9556f910..69dbcf4b 100644 --- a/includes/templates/legacy/Sidebar.mustache +++ b/includes/templates/legacy/Sidebar.mustache @@ -7,7 +7,7 @@ - {{#data-portlets-first}}{{>Menu}}{{/data-portlets-first}} - {{#array-portlets-rest}}{{>Menu}}{{/array-portlets-rest}} - {{#data-portlets.data-languages}}{{>Menu}}{{/data-portlets.data-languages}} + {{#data-portlets-first}}{{>legacy/Menu}}{{/data-portlets-first}} + {{#array-portlets-rest}}{{>legacy/Menu}}{{/array-portlets-rest}} + {{#data-portlets.data-languages}}{{>legacy/Menu}}{{/data-portlets.data-languages}} diff --git a/includes/templates/legacy/UserLinks.mustache b/includes/templates/legacy/UserLinks.mustache index ec11aa2d..a3745fc9 100644 --- a/includes/templates/legacy/UserLinks.mustache +++ b/includes/templates/legacy/UserLinks.mustache @@ -1 +1 @@ -{{#data-personal}}{{>Menu}}{{/data-personal}} +{{#data-personal}}{{>legacy/Menu}}{{/data-personal}} diff --git a/includes/templates/skin-legacy.mustache b/includes/templates/skin-legacy.mustache index 0e998f3f..ddd2f5de 100644 --- a/includes/templates/skin-legacy.mustache +++ b/includes/templates/skin-legacy.mustache @@ -54,12 +54,12 @@ {{#data-portlets}} {{>legacy/UserLinks}}
- {{#data-namespaces}}{{>Menu}}{{/data-namespaces}} - {{#data-variants}}{{>Menu}}{{/data-variants}} + {{#data-namespaces}}{{>legacy/Menu}}{{/data-namespaces}} + {{#data-variants}}{{>legacy/Menu}}{{/data-variants}}
- {{#data-views}}{{>Menu}}{{/data-views}} - {{#data-actions}}{{>Menu}}{{/data-actions}} + {{#data-views}}{{>legacy/Menu}}{{/data-views}} + {{#data-actions}}{{>legacy/Menu}}{{/data-actions}} {{#data-search-box}}{{>SearchBox}}{{/data-search-box}}
{{/data-portlets}} diff --git a/skin.json b/skin.json index 548fcf11..d89113bd 100644 --- a/skin.json +++ b/skin.json @@ -63,13 +63,16 @@ "vector-jumptocontent", "vector-toc-beginning", "vector-toc-heading", + "vector-article-tools-nav-label", + "vector-site-nav-label", "search", "searchbutton", "searcharticle", "searchsuggest-search", "sitesubtitle", "sitetitle", - "tagline" + "tagline", + "personaltools" ] } ]