mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-12-03 19:57:19 +00:00
4d97e0a4fb
Updates `CSSCustomProperties.less` to include `.oo-ui-popupWidget-popup` in `@OOUIOverrideSelectors` for inverted color inheritance. Bug: T364798 Change-Id: I6c3ac79d24f6af71a9171153e346494fb97acd3f
102 lines
2.8 KiB
Plaintext
102 lines
2.8 KiB
Plaintext
@import 'mediawiki.skin.variables.less';
|
|
@import 'mediawiki.skin.codex-design-tokens/theme-wikimedia-ui-mixin-dark.less';
|
|
@import 'mediawiki.skin.codex-design-tokens/theme-wikimedia-ui-reset.less';
|
|
|
|
/**
|
|
* FIXME: Temporary Night-mode override classes
|
|
* Remove these once T363849 has been addressed.
|
|
*
|
|
* The following classes are meant to force OOUI interfaces
|
|
* into light-mode when night-mode is enabled. They should be
|
|
* grouped with the `.notheme` rulset as an alternative to
|
|
* using the `.notheme` class in multiple places.
|
|
*
|
|
* Note: These are wrapped in quotes to avoid dashed being interpreted as minus signs,
|
|
* along with a `~` to unwrap them when they are used as selectors.
|
|
*/
|
|
@OOUIOverrideSelectors: ~'.ve-ui-overlay, .oo-ui-popupWidget-popup'; // T363861 - VisualEditor Overlays
|
|
|
|
/**
|
|
* Light mode
|
|
*
|
|
* Applies the light mode color palette by default
|
|
* or with the .skin-invert, or .notheme classes
|
|
*/
|
|
:root,
|
|
.skin-invert,
|
|
.notheme,
|
|
@{OOUIOverrideSelectors} {
|
|
.cdx-mode-reset();
|
|
}
|
|
|
|
/**
|
|
* Forced night mode.
|
|
*
|
|
* Applies the night mode color palette per the users explicit preference,
|
|
* regardless of system settings.
|
|
*/
|
|
html.skin-theme-clientpref-night {
|
|
color-scheme: dark;
|
|
.cdx-mode-dark();
|
|
|
|
// T363911 Temporarily override Codex variable for Vector night mode release
|
|
// Remove after task has been resolved and new color is available in Codex.
|
|
--color-link-red: #b97876;
|
|
}
|
|
|
|
html.skin-theme-clientpref-night .skin-invert {
|
|
color-scheme: light;
|
|
filter: invert( 1 ) hue-rotate( 180deg );
|
|
}
|
|
|
|
html.skin-theme-clientpref-night .notheme,
|
|
html.skin-theme-clientpref-night @{OOUIOverrideSelectors} {
|
|
color-scheme: light;
|
|
color: var( --color-base );
|
|
}
|
|
|
|
/**
|
|
* Auto night mode.
|
|
*
|
|
* Applies the night mode color palette only in response to system settings.
|
|
*/
|
|
@media ( prefers-color-scheme: dark ) {
|
|
html.skin-theme-clientpref-os {
|
|
color-scheme: light dark;
|
|
.cdx-mode-dark();
|
|
|
|
// T363911 Temporarily override Codex variable for Vector night mode release
|
|
// Remove after task has been resolved and new color is available in Codex.
|
|
--color-link-red: #b97876;
|
|
}
|
|
|
|
html.skin-theme-clientpref-os .notheme,
|
|
html.skin-theme-clientpref-os @{OOUIOverrideSelectors} {
|
|
color-scheme: light;
|
|
}
|
|
|
|
html.skin-theme-clientpref-os .skin-invert {
|
|
color-scheme: light;
|
|
filter: invert( 1 ) hue-rotate( 180deg );
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Font size settings
|
|
*/
|
|
.vector-feature-custom-font-size-clientpref--excluded,
|
|
.vector-feature-custom-font-size-clientpref-0 {
|
|
--font-size-medium: @font-size-small;
|
|
--line-height-medium: @line-height-small;
|
|
}
|
|
|
|
.vector-feature-custom-font-size-clientpref-1 {
|
|
--font-size-medium: @font-size-medium;
|
|
--line-height-medium: @line-height-medium;
|
|
}
|
|
|
|
.vector-feature-custom-font-size-clientpref-2 {
|
|
--font-size-medium: @font-size-x-large;
|
|
--line-height-medium: 1.5;
|
|
}
|