mediawiki-skins-Vector/resources/skins.vector.styles.legacy/components/Sidebar.less

@import '../../common/variables.less';

/* Panel */
#mw-panel {
	font-size: @font-size-nav-main;

	nav:first-child {
		background-image: none;

		.vector-menu-heading {
			display: none;
		}

		.vector-menu-content {
			margin-left: @margin-start-nav-main-body;
		}
	}
}
Reorganize LESS files to match ResourceLoader conventions Separating most LESS files into 2 ResourceLoader modules and a common folder: - skins.vector.styles - skins.vector.styles.legacy - common This changes aims to clearly separate the old (“legacy”), the new (“modern”) and the common styles which were previously all placed under `skins.vector.styles/`. Inside each directory are separate folders for `layouts` and `components`. The entry files, `skin.less` and `skin-legacy.less` are moved into the specific folders and a third, `common.less` entry file is created that contains the common imports for both old and new Vector. Aliases have been added to the Storybook Webpack config to avoid adding the story file changes to this patch. Images coming from CSS `url()`'s have also been temporarily disabled in Storybook until Storybook can be upgraded to use Webpack 5, and use array values for aliases, in a follow-up patch. This patch also slightly changes a footer layout specific rule so that existing `padding` remains unchanged in rendering due to new common and component structure. Bug: T264309 Change-Id: I1cd2681a2b61edb7be56c38f9bb3994827d7e322 2021-02-02 10:04:37 +00:00			`@import '../../common/variables.less';`
[dev][Legacy] split sidebar Mustache and Less Split out the sidebar in advance of significant Latest mode only changes. The Less split was made by adding a new Sidebar.less file that imports the Legacy implementation. The Mustache split was made by file copying the existing implementation into a legacy/ subfolder. Both the Legacy and Latest implementations were then stripped of templates not applicable to their modes. These changes are aligned with the splits for JavaScript. Bug: T246419 Change-Id: Ib82769ea16bfc09efe8a088220aab55bdde0d381 2020-05-15 00:58:21 +00:00
			`/* Panel */`
			`#mw-panel {`
			`font-size: @font-size-nav-main;`

Simplify menu code SkinMustache in core provides most of what is required for Vector to generate its menus. In the interest of having a canonical source of truth for menus across all skins, Vector should use this data. To ensure the HTML generated is (mostly) the same after this patch to prior, a few modifications are necessary: * The data from core is decorated so that Vector can continue having its own custom class names on menus. This is done using the decoratePortletClass method. * There is no support for a menu having a header representing the selected menu item, as is currently the case with variants. This is achieved via an extension to getPortletData. It's assumed that later when variants are merged with languages, this can be removed. * Menus are agnostic to how they are displayed, so we must continue to add the is-dropdown template variable to drop down menus. In future we may want to rethink our Menu partial to make this unnecessary in PHP. * The portal-first class is redundant in the modern Vector as we can use the first-child selector. Previously we introduced a class to service the legacy skin where this rule doesn't apply as #p-logo is the first child. However, the legacy skin can do this using a special next sibling selector instead. Bug: T268157 Change-Id: I5f7adc1840441b508ffee40139b85b64021789e6 2020-09-04 19:18:57 +00:00			`nav:first-child {`
[dev][Legacy] split sidebar Mustache and Less Split out the sidebar in advance of significant Latest mode only changes. The Less split was made by adding a new Sidebar.less file that imports the Legacy implementation. The Mustache split was made by file copying the existing implementation into a legacy/ subfolder. Both the Legacy and Latest implementations were then stripped of templates not applicable to their modes. These changes are aligned with the splits for JavaScript. Bug: T246419 Change-Id: Ib82769ea16bfc09efe8a088220aab55bdde0d381 2020-05-15 00:58:21 +00:00			`background-image: none;`

Update Vector menu CSS to use `vector-menu-heading` instead of `h3` Replaced h3 tag in includes/templates/Menu.mustache with label tag. Replaced h3 elements in .storybook/icons.less, resources/common/components/Menu.less, resources/common/components/MenuDropdown.less, resources/common/components/MenuPortal.less, resources/common/components/MenuTabs.less,resources/skins.vector.styles.legacy/components/MenuDropdown.less, resources/skins.vector.styles/components/UserLinks.less, resources/skins.vector.styles.legacy/components/Sidebar.less and resources/skins.vector.styles.legacy/layouts/screen.less by vector-menu-heading. Bug: T290280 Change-Id: I6eee7d6bc47c74a62166d4579fd4d3da3dc88e88 2022-02-21 15:42:10 +00:00			`.vector-menu-heading {`
[dev][Legacy] split sidebar Mustache and Less Split out the sidebar in advance of significant Latest mode only changes. The Less split was made by adding a new Sidebar.less file that imports the Legacy implementation. The Mustache split was made by file copying the existing implementation into a legacy/ subfolder. Both the Legacy and Latest implementations were then stripped of templates not applicable to their modes. These changes are aligned with the splits for JavaScript. Bug: T246419 Change-Id: Ib82769ea16bfc09efe8a088220aab55bdde0d381 2020-05-15 00:58:21 +00:00			`display: none;`
			`}`

Drop unsupported skin CSS classes Drop support for vectorMenu, vectorTabs and vectorMenuCheckbox, body, menu selectors in preference for standard selectors. This change will impact a large amount of user scripts/styles but should not impact any gadgets. These classes were kept around for user scripts and styles however are not needed internally. As we transition to a more maintainable skin menu system, it is time to lose these selectors even though this will cause disruption. Vector now will use the mw-portlet class rather than the vector-menu class in its own CSS styling, however it keeps the other classes to allow differentiation of the different types of menu. Changes to test: Previously the tests assumed all portlets were empty when checking the classes. This is very rare, so its better to check the classes of non-empty portlets, so several tests are updated accordingly to drop the emptyPortlet class. Bug: T262092 Change-Id: I1824335eb47d613c2a4804ec1f1106c0f4c16101 2020-09-04 19:34:05 +00:00			`.vector-menu-content {`
[dev][Legacy] split sidebar Mustache and Less Split out the sidebar in advance of significant Latest mode only changes. The Less split was made by adding a new Sidebar.less file that imports the Legacy implementation. The Mustache split was made by file copying the existing implementation into a legacy/ subfolder. Both the Legacy and Latest implementations were then stripped of templates not applicable to their modes. These changes are aligned with the splits for JavaScript. Bug: T246419 Change-Id: Ib82769ea16bfc09efe8a088220aab55bdde0d381 2020-05-15 00:58:21 +00:00			`margin-left: @margin-start-nav-main-body;`
			`}`
			`}`
			`}`