mediawiki-skins-Vector/resources/common/mixins.less
Jan Drewniak 3aaf8666cd Remove CSS selectors for Page Tools feature flag
This removes CSS selectors associated with the Page tools
feature flag, i.e. `vector-feature-page-tools-disabled` as
well as `vector-feature-page-tools-enabled` by removing
the 'disabled' styles and integrating the 'enabled' styles
into the default page tools code.

Bug: T332090
Change-Id: I382e12ca7ce741a3071582ffa84da03c2ba9e343
2023-03-31 11:34:37 -05:00

70 lines
2 KiB
Plaintext

/**
* Less mixins shared between both legacy and Vector 2022.
*/
@import '../common/variables.less';
.mixin-vector-menu-heading() {
align-self: center;
color: @color-base--subtle;
font-weight: normal;
cursor: default;
// NOTE: Setting these values does not produce a visible border.
// That's handled elsewhere with either border-top-style or border-bottom-style.
border-color: @border-color-portal-heading;
border-width: @border-width-base;
}
// Defines the arrow beside dropdown headings.
.mixin-vector-legacy-menu-heading-arrow {
content: '';
background: url( ../common/images/arrow-down.svg ) 100% 50% no-repeat;
width: unit( 16 / @font-size-tabs / @font-size-browser, em );
height: unit( 16 / @font-size-tabs / @font-size-browser, em );
}
.mixin-vector-menu-heading-arrow() {
content: '';
background: url( ../common/images/arrow-down.svg ) 100% 50% no-repeat;
width: unit( 16 / @font-size-tabs / @font-size-browser, em );
height: unit( 16 / @font-size-tabs / @font-size-browser, em );
// https://phabricator.wikimedia.org/T319070#8284272
margin-left: -1px;
}
.mixin-vector-dropdown-menu-item() {
display: flex;
align-items: center;
padding: @padding-vertical-dropdown-menu-item @padding-horizontal-dropdown-menu-item;
font-size: @font-size-dropdown;
&:not( .mw-selflink ):visited {
color: @color-link;
}
&.selected a,
&.selected a:visited {
color: @color-link-selected;
}
}
// Scroll indicator used by TOC and page tools.
.mixin-vector-scroll-indicator() {
// Add extra padding for the fade scrollable indicator.
padding-bottom: @height-scroll-indicator - @padding-vertical-dropdown-menu-item;
&::after {
content: '';
display: block;
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: @height-scroll-indicator;
background: linear-gradient( rgba( 255, 255, 255, 0 ), @background-color-page-container );
background-repeat: no-repeat;
background-position: -12px; // T311436 Hacky way to prevent the fade from covering the scrollbar
pointer-events: none; // Make the link below the fade clickable
}
}