diff --git a/includes/VectorTemplate.php b/includes/VectorTemplate.php index 04cf071..8eb402e 100644 --- a/includes/VectorTemplate.php +++ b/includes/VectorTemplate.php @@ -460,10 +460,12 @@ class VectorTemplate extends BaseTemplate { bool $setLabelToSelected = false ) : array { $class = ( count( $urls ) == 0 ) ? 'emptyPortlet' : ''; + // FIXME: All menus should carry vector-menu, but this can only be done when + // Menu.less CSS has been generalised to not include layout. $extraClasses = [ - self::MENU_TYPE_DROPDOWN => 'vectorMenu-dropdown vectorMenu', - self::MENU_TYPE_TABS => 'vectorMenu-tabs vectorTabs', - self::MENU_TYPE_DEFAULT => 'vectorMenu-default', + self::MENU_TYPE_DROPDOWN => 'vector-menu-dropdown vectorMenu', + self::MENU_TYPE_TABS => 'vector-menu-tabs vectorTabs', + self::MENU_TYPE_DEFAULT => 'vector-menu', ]; $props = [ diff --git a/resources/skins.vector.styles/Menu.less b/resources/skins.vector.styles/Menu.less index 31a7d12..d35cc34 100644 --- a/resources/skins.vector.styles/Menu.less +++ b/resources/skins.vector.styles/Menu.less @@ -2,7 +2,7 @@ @import 'mediawiki.mixins.less'; /* Personal */ -.vectorMenu-default, +.vector-menu, /* FIXME: Remove p-personal selector when cache has cleared. */ #p-personal { position: absolute; diff --git a/resources/skins.vector.styles/MenuDropdown.less b/resources/skins.vector.styles/MenuDropdown.less index 41f2d97..54c6fd6 100644 --- a/resources/skins.vector.styles/MenuDropdown.less +++ b/resources/skins.vector.styles/MenuDropdown.less @@ -4,7 +4,7 @@ /* Variants and Actions */ // FIXME: For cached HTML .vectorMenu, -.vectorMenu-dropdown { +.vector-menu-dropdown { direction: ltr; float: left; cursor: pointer; diff --git a/resources/skins.vector.styles/MenuTabs.less b/resources/skins.vector.styles/MenuTabs.less index 479ec97..660d5ec 100644 --- a/resources/skins.vector.styles/MenuTabs.less +++ b/resources/skins.vector.styles/MenuTabs.less @@ -8,7 +8,7 @@ /* Namespaces and Views */ // FIXME: For cached HTML .vectorTabs, -.vectorMenu-tabs { +.vector-menu-tabs { // Tab separator: Outer start border (left in LTR) of tab row. background-position: left bottom; float: left; diff --git a/stories/Menu.stories.data.js b/stories/Menu.stories.data.js index 1a138f9..7579c49 100644 --- a/stories/Menu.stories.data.js +++ b/stories/Menu.stories.data.js @@ -6,7 +6,7 @@ import { htmluserlangattributes } from './utils'; */ const loggedOut = { id: 'p-personal', - class: 'vectorMenu-default', + class: 'vector-menu', 'label-id': 'p-personal-label', label: 'Personal tools', 'html-userlangattributes': htmluserlangattributes, @@ -18,7 +18,7 @@ const loggedOut = { */ const loggedInWithEcho = { id: 'p-personal', - class: 'vectorMenu-default', + class: 'vector-menu', 'label-id': 'p-personal-label', label: 'Personal tools', 'html-userlangattributes': htmluserlangattributes, @@ -32,7 +32,7 @@ const ULS_LANGUAGE_SELECTOR = '
  • Englis */ const defaultMenu = { id: 'p-generic', - class: 'vectorMenu-default', + class: 'vector-menu', 'label-id': 'p-generic-label', label: 'Menu label', 'html-userlangattributes': htmluserlangattributes, @@ -46,7 +46,7 @@ const defaultMenu = { */ const loggedInWithULS = { id: 'p-personal', - class: 'vectorMenu-default', + class: 'vector-menu', 'label-id': 'p-personal-label', label: 'Personal tools', 'html-userlangattributes': htmluserlangattributes, diff --git a/stories/MenuDropdown.stories.data.js b/stories/MenuDropdown.stories.data.js index 0abe5b7..4397ca1 100644 --- a/stories/MenuDropdown.stories.data.js +++ b/stories/MenuDropdown.stories.data.js @@ -8,7 +8,7 @@ export { vectorMenuTemplate }; */ export const moreData = { 'is-dropdown': true, - class: 'vectorMenu-dropdown vectorMenu', + class: 'vector-menu-dropdown', label: 'More', id: 'p-cactions', 'label-id': 'p-cactions-label', @@ -32,7 +32,7 @@ export const moreData = { */ export const variantsData = { 'is-dropdown': true, - class: 'vectorMenu-dropdown vectorMenu', + class: 'vector-menu-dropdown', label: '新加坡简体', id: 'p-variants', 'label-id': 'p-variants-label', diff --git a/stories/MenuTabs.stories.data.js b/stories/MenuTabs.stories.data.js index bb51c93..045455c 100644 --- a/stories/MenuTabs.stories.data.js +++ b/stories/MenuTabs.stories.data.js @@ -5,7 +5,7 @@ import { htmluserlangattributes } from './utils'; */ export const pageActionsData = { id: 'p-views', - class: 'vectorMenu-tabs vectorTabs', + class: 'vector-menu-tabs vectorTabs', 'label-id': 'p-views-label', label: 'Views', 'html-userlangattributes': htmluserlangattributes, @@ -27,7 +27,7 @@ You can view its source [⌃⌥e]" accesskey="e">View source
  • */ export const namespaceTabsData = { id: 'p-namespaces', - class: 'vectorMenu-tabs vectorTabs', + class: 'vector-menu-tabs vectorTabs', 'label-id': 'p-namespaces-label', label: 'Namespaces', 'html-userlangattributes': htmluserlangattributes, diff --git a/tests/phpunit/integration/VectorTemplateTest.php b/tests/phpunit/integration/VectorTemplateTest.php index 88a0b16..c94eb41 100644 --- a/tests/phpunit/integration/VectorTemplateTest.php +++ b/tests/phpunit/integration/VectorTemplateTest.php @@ -154,25 +154,25 @@ class VectorTemplateTest extends MediaWikiIntegrationTestCase { $this->assertSame( $views, [ 'id' => 'p-views', - 'class' => 'emptyPortlet vectorMenu-tabs vectorTabs', + 'class' => 'emptyPortlet vector-menu-tabs vectorTabs', 'label-id' => 'p-views-label', 'label' => 'Views', 'html-userlangattributes' => $langAttrs, 'html-items' => '', - 'class' => 'emptyPortlet vectorMenu-tabs vectorTabs', + 'class' => 'emptyPortlet vector-menu-tabs vectorTabs', 'is-dropdown' => false, ] ); $variants = $props['data-variants']; $actions = $props['data-page-actions-more']; $this->assertSame( $namespaces['class'], - 'emptyPortlet vectorMenu-tabs vectorTabs' ); + 'emptyPortlet vector-menu-tabs vectorTabs' ); $this->assertSame( $variants['class'], - 'emptyPortlet vectorMenu-dropdown vectorMenu' ); + 'emptyPortlet vector-menu-dropdown vectorMenu' ); $this->assertSame( $actions['class'], - 'emptyPortlet vectorMenu-dropdown vectorMenu' ); + 'emptyPortlet vector-menu-dropdown vectorMenu' ); $this->assertSame( $props['data-personal-menu']['class'], - 'emptyPortlet vectorMenu-default' ); + 'emptyPortlet vector-menu' ); } }