mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-12-11 15:37:50 +00:00
3cea6d4132
This change scopes the styles related to the Zebra update by wrapping the imports in a top-level feature flag selector, i.e .vector-feature-zebra-design-enabled { @import "./screen.less" } To account for this extra selector, ampersands are added wherever the html element is targeted in the affected files. This applies to both zebra enabled and disabled files. getDefaultModules() is used in SkinVector22.php to conditionally load the new skins.vector.zebra.styles module when the feature is enabled. Bug: T332600 Change-Id: I5e673df383ff31f296010f982e4188c82f095590
34 lines
1.2 KiB
Plaintext
34 lines
1.2 KiB
Plaintext
@import '../../common/variables.less';
|
|
|
|
.vector-pinned-container .vector-pinnable-element {
|
|
// Make the heading border line up with the edge of the text
|
|
// (Whereas in a dropdown, the border lines up with the edge of the dropdown container).
|
|
.vector-pinnable-header,
|
|
.vector-menu-heading,
|
|
.mw-list-item a {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* At lower resolutions, we want to hide the pinned containers when JS is enabled since these
|
|
* elements collapse (become unpinned) at this resolution via PinnableElement.js.
|
|
* Although this is handled in JS, this rule prevents the pinned menu from
|
|
* appearing on pageload, at low resolutions, before the JS kicks in.
|
|
*
|
|
* When JS is disabled, we still want to hide the pinned containers at lower resolutions
|
|
* to fallback to the gradeC, single column layout.
|
|
*/
|
|
@media ( max-width: @max-width-tablet ) {
|
|
// .client-js and .client-nojs selectors needed to increase specificity to override gradeC.less
|
|
// Prefered to using !important as this still needs to be overridable to handle
|
|
// the anon, no-js TOC case found in layouts/toc/unpinned.less
|
|
&.client-js,
|
|
&.client-nojs {
|
|
.vector-pinned-container {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|