mediawiki-skins-Vector/resources/skins.vector.styles/CSSCustomProperties.less
Jan Drewniak 2223cb8c1b Introduce CSS custom properties under font-size feature flag
Introduces CSS custom properties for the purposes
of enabling client-side customizable font sizes.

CSS custom properties are contained in a Less file,
which imports values from Codex and converted them to rems
using the Less unit() function.

Includes ADR on CSS custom properties decisions.

Bug: T348984
Change-Id: Ic5e62d55f3c3585fe3a00e41f29f88d3a2f7470b
2023-10-24 14:33:33 +00:00

33 lines
1.1 KiB
Plaintext

/**
* Vector CSS Custom properties
* ----------------------------
* Please be aware that these properties are accessible via *any* client-side code.
* These variables should mirror Codex design token names and values:
* https://doc.wikimedia.org/codex/latest/design-tokens
* Only include properties that are required for client-side modification.
*
* @private - Currently, these variables are only intended for use by Vector 2022,
* however, they are designed to mimic the naming convention in Codex tokens
* in order to facilitate an eventual migration to a centralized source.
* @experimental
* @since October 2023 (MediaWiki 1.42)
*/
:root {
--font-size-medium: unit( @font-size-small, rem );
}
// FIXME: Migrate `enabled` to `1`.
.vector-feature-custom-font-size-clientpref-enabled,
.vector-feature-custom-font-size-clientpref-1 {
--font-size-medium: unit( @font-size-medium, rem );
}
.vector-feature-custom-font-size-clientpref-2 {
--font-size-medium: unit( @font-size-large, rem );
}
.vector-feature-custom-font-size-clientpref-3 {
--font-size-medium: unit( @font-size-x-large, rem );
}