mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-11-24 07:43:47 +00:00
Merge "Refactor: Merge VectorTabs into Menu"
This commit is contained in:
commit
397da708e1
|
@ -462,7 +462,7 @@ class VectorTemplate extends BaseTemplate {
|
|||
$class = ( count( $urls ) == 0 ) ? 'emptyPortlet' : '';
|
||||
$extraClasses = [
|
||||
self::MENU_TYPE_DROPDOWN => 'vectorMenu',
|
||||
self::MENU_TYPE_TABS => 'vectorTabs',
|
||||
self::MENU_TYPE_TABS => 'vectorMenu-tabs vectorTabs',
|
||||
self::MENU_TYPE_DEFAULT => 'vectorMenu-default',
|
||||
];
|
||||
|
||||
|
|
|
@ -1,9 +0,0 @@
|
|||
{{!
|
||||
See @typedef MenuDefinition
|
||||
}}
|
||||
<div id="{{id}}" role="navigation" class="{{class}}" aria-labelledby="{{label-id}}">
|
||||
<h3 id="{{label-id}}">{{label}}</h3>
|
||||
<ul {{{html-userlangattributes}}}>
|
||||
{{{html-items}}}
|
||||
</ul>
|
||||
</div>
|
|
@ -24,9 +24,9 @@
|
|||
readers
|
||||
LogoOptions data-logos
|
||||
MenuDefinition data-personal-menu
|
||||
object data-namespace-tabs. See VectorTabs.mustache for documentation.
|
||||
MenuDefinition data-namespace-tabs
|
||||
object data-variants. See VectorMenu.mustache for documentation.
|
||||
object data-page-actions. See VectorTabs.mustache for documentation.
|
||||
MenuDefinition data-page-actions
|
||||
object data-page-actions-more. See VectorMenu.mustache for documentation.
|
||||
object data-search-box. See SearchBox.mustache for documentation.
|
||||
object data-sidebar. See Sidebar.mustache for documentation.
|
||||
|
@ -79,11 +79,11 @@
|
|||
<div id="mw-head">
|
||||
{{#data-personal-menu}}{{>Menu}}{{/data-personal-menu}}
|
||||
<div id="left-navigation">
|
||||
{{#data-namespace-tabs}}{{>VectorTabs}}{{/data-namespace-tabs}}
|
||||
{{#data-namespace-tabs}}{{>Menu}}{{/data-namespace-tabs}}
|
||||
{{#data-variants}}{{>VectorMenu}}{{/data-variants}}
|
||||
</div>
|
||||
<div id="right-navigation">
|
||||
{{#data-page-actions}}{{>VectorTabs}}{{/data-page-actions}}
|
||||
{{#data-page-actions}}{{>Menu}}{{/data-page-actions}}
|
||||
{{#data-page-actions-more}}{{>VectorMenu}}{{/data-page-actions-more}}
|
||||
{{#data-search-box}}{{>SearchBox}}{{/data-search-box}}
|
||||
</div>
|
||||
|
|
|
@ -23,9 +23,9 @@
|
|||
string html-navigation-heading heading for entire navigation that is
|
||||
usually hidden to screen readers
|
||||
MenuDefinition data-personal-menu
|
||||
object data-namespace-tabs. See VectorTabs.mustache for documentation.
|
||||
MenuDefinition data-namespace-tabs
|
||||
object data-variants. See VectorMenu.mustache for documentation.
|
||||
object data-page-actions. See VectorTabs.mustache for documentation.
|
||||
MenuDefinition data-page-actions
|
||||
object data-page-actions-more. See VectorMenu.mustache for documentation.
|
||||
object data-search-box. See SearchBox.mustache for documentation.
|
||||
object data-sidebar. See Sidebar.mustache for documentation.
|
||||
|
@ -72,11 +72,11 @@
|
|||
<div id="mw-head">
|
||||
{{#data-personal-menu}}{{>Menu}}{{/data-personal-menu}}
|
||||
<div id="left-navigation">
|
||||
{{#data-namespace-tabs}}{{>VectorTabs}}{{/data-namespace-tabs}}
|
||||
{{#data-namespace-tabs}}{{>Menu}}{{/data-namespace-tabs}}
|
||||
{{#data-variants}}{{>VectorMenu}}{{/data-variants}}
|
||||
</div>
|
||||
<div id="right-navigation">
|
||||
{{#data-page-actions}}{{>VectorTabs}}{{/data-page-actions}}
|
||||
{{#data-page-actions}}{{>Menu}}{{/data-page-actions}}
|
||||
{{#data-page-actions-more}}{{>VectorMenu}}{{/data-page-actions-more}}
|
||||
{{#data-search-box}}{{>SearchBox}}{{/data-search-box}}
|
||||
</div>
|
||||
|
|
|
@ -6,7 +6,9 @@
|
|||
*/
|
||||
|
||||
/* Namespaces and Views */
|
||||
.vectorTabs {
|
||||
// FIXME: For cached HTML
|
||||
.vectorTabs,
|
||||
.vectorMenu-tabs {
|
||||
// Tab separator: Outer start border (left in LTR) of tab row.
|
||||
background-position: left bottom;
|
||||
float: left;
|
|
@ -8,7 +8,7 @@
|
|||
@import 'Logo.less';
|
||||
@import 'Menu.less';
|
||||
@import 'SearchBox.less';
|
||||
@import 'VectorTabs.less';
|
||||
@import 'MenuTabs.less';
|
||||
@import 'watchstar.less';
|
||||
@import 'VectorMenu.less';
|
||||
@import 'Portal.less';
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
@import 'legacy/layout.less';
|
||||
@import 'Menu.less';
|
||||
@import 'SearchBox.less';
|
||||
@import 'VectorTabs.less';
|
||||
@import 'MenuTabs.less';
|
||||
@import 'watchstar.less';
|
||||
@import 'VectorMenu.less';
|
||||
@import 'Portal.less';
|
||||
|
|
|
@ -1,14 +1,11 @@
|
|||
import { htmluserlangattributes } from './utils';
|
||||
import vectorTabsTemplate from '!!raw-loader!../includes/templates/VectorTabs.mustache';
|
||||
|
||||
export { vectorTabsTemplate };
|
||||
|
||||
/**
|
||||
* @type {MenuDefinition}
|
||||
*/
|
||||
export const pageActionsData = {
|
||||
id: 'p-views',
|
||||
class: 'vectorTabs',
|
||||
class: 'vectorMenu-tabs vectorTabs',
|
||||
'label-id': 'p-views-label',
|
||||
label: 'Views',
|
||||
'html-userlangattributes': htmluserlangattributes,
|
||||
|
@ -30,7 +27,7 @@ You can view its source [⌃⌥e]" accesskey="e">View source</a></li>
|
|||
*/
|
||||
export const namespaceTabsData = {
|
||||
id: 'p-namespaces',
|
||||
class: 'vectorTabs',
|
||||
class: 'vectorMenu-tabs vectorTabs',
|
||||
'label-id': 'p-namespaces-label',
|
||||
label: 'Namespaces',
|
||||
'html-userlangattributes': htmluserlangattributes,
|
|
@ -1,11 +1,12 @@
|
|||
import mustache from 'mustache';
|
||||
import { namespaceTabsData, pageActionsData, vectorTabsTemplate } from './VectorTabs.stories.data';
|
||||
import '../resources/skins.vector.styles/VectorTabs.less';
|
||||
import { menuTemplate as vectorTabsTemplate } from './Menu.stories.data';
|
||||
import { namespaceTabsData, pageActionsData } from './MenuTabs.stories.data';
|
||||
import '../resources/skins.vector.styles/MenuTabs.less';
|
||||
import '../resources/skins.vector.styles/watchstar.less';
|
||||
import '../.storybook/common.less';
|
||||
|
||||
export default {
|
||||
title: 'Tabs'
|
||||
title: 'MenuTabs'
|
||||
};
|
||||
|
||||
export const pageActionTabs = () => mustache.render( vectorTabsTemplate, pageActionsData );
|
|
@ -2,7 +2,7 @@ import { htmluserlangattributes } from './utils';
|
|||
import { placeholder } from './utils';
|
||||
|
||||
import { PERSONAL_MENU_TEMPLATE_DATA, menuTemplate } from './Menu.stories.data';
|
||||
import { pageActionsData, namespaceTabsData, vectorTabsTemplate } from './VectorTabs.stories.data';
|
||||
import { pageActionsData, namespaceTabsData } from './MenuTabs.stories.data';
|
||||
import { vectorMenuTemplate, moreData, variantsData } from './VectorMenu.stories.data';
|
||||
import { searchBoxData, searchBoxTemplate } from './SearchBox.stories.data';
|
||||
import { SIDEBAR_DATA, SIDEBAR_TEMPLATE_PARTIALS, sidebarTemplate } from './Sidebar.stories.data';
|
||||
|
@ -46,7 +46,6 @@ export const TEMPLATE_PARTIALS = Object.assign( {}, SIDEBAR_TEMPLATE_PARTIALS, {
|
|||
Logo: logoTemplate,
|
||||
SearchBox: searchBoxTemplate,
|
||||
Sidebar: sidebarTemplate,
|
||||
VectorTabs: vectorTabsTemplate,
|
||||
VectorMenu: vectorMenuTemplate,
|
||||
Menu: menuTemplate,
|
||||
Footer: footerTemplate
|
||||
|
|
|
@ -154,18 +154,18 @@ class VectorTemplateTest extends MediaWikiIntegrationTestCase {
|
|||
|
||||
$this->assertSame( $views, [
|
||||
'id' => 'p-views',
|
||||
'class' => 'emptyPortlet vectorTabs',
|
||||
'class' => 'emptyPortlet vectorMenu-tabs vectorTabs',
|
||||
'label-id' => 'p-views-label',
|
||||
'label' => 'Views',
|
||||
'html-userlangattributes' => $langAttrs,
|
||||
'html-items' => '',
|
||||
'class' => 'emptyPortlet vectorTabs',
|
||||
'class' => 'emptyPortlet vectorMenu-tabs vectorTabs',
|
||||
] );
|
||||
|
||||
$variants = $props['data-variants'];
|
||||
$actions = $props['data-page-actions-more'];
|
||||
$this->assertSame( $namespaces['class'],
|
||||
'emptyPortlet vectorTabs' );
|
||||
'emptyPortlet vectorMenu-tabs vectorTabs' );
|
||||
$this->assertSame( $variants['class'],
|
||||
'emptyPortlet vectorMenu' );
|
||||
$this->assertSame( $actions['class'],
|
||||
|
|
Loading…
Reference in a new issue