mediawiki-skins-Vector/resources/mediawiki.less/vector-2022/mediawiki.skin.variables.less
Jon Robson a79fa9f00a Use clearer folder structure for Vector and Vector 2022 skin variables
Follow example in skinStyles and give these their own folders.
The problem with using "legacy" is that it could be interpreted as meaning
legacy LESS variables e.g. deprecated variables.

Change-Id: Ie456dfbd703a0e7a0ad783909ca3ef5e86450d9c
2023-03-14 21:48:58 +00:00

62 lines
2.5 KiB
Plaintext

/**
* ###IMPORTANT:##
* If editing this file, please also edit the respective file in the MinervaNeue skin.
* ####
*
* This file is a LESS @import match for "mediawiki.skin.variables.less"
* when Vector 2022 is the active skin.
* Please note, that legacy Vector is handled by
* "mediwiki.less.legacy/mediawiki.skin.variables.less".
*
* Please also note, that both current Wikimedia Design Style Guide based skins,
* Vector 2022 and Minerva Neue are using the same variable values respectively in their
* repositories.
*/
@import 'mediawiki.skin.defaults.less';
// == Colors ==
@color-link: #36c;
@color-link--visited: #795cb2;
@color-link--active: #faa700;
// Link colors for new or missing articles, also known as “Red links”.
// https://www.wikidata.org/wiki/Q13417974#sitelinks-wikipedia
@color-link-new: #d33;
@color-link-new--visited: #a55858;
// Link colors for a power user feature to highlight links to other projects.
// In Vector 2022 we unify these colors by default for simpler orientation by average users.
// It's still possible to overwrite the styles per user.
@color-link-external: #36c;
@color-link-external--visited: #795cb2;
@color-link-external--active: #faa700;
// Opacities
@opacity-base: 1;
@opacity-medium: 0.65;
@opacity-low: 0.3;
@opacity-transparent: 0;
// Legacy opacity for icon states in CSS-only component and non-Codex products.
@opacity-icon-base: 0.87; // = `#222` on `background-color: #fff`, closest to `#202122`.
// Legacy opacity for icon states in CSS-only component and non-Codex products.
@opacity-icon-base--hover: 0.74; // = `#424242` on `background-color: #fff`, closest to `#404244`.
// Legacy opacity for icon states in CSS-only component and non-Codex products.
@opacity-icon-base--selected: 1;
// Legacy opacity for icon states in CSS-only component and non-Codex products.
@opacity-icon-base--disabled: 0.51; // = `#7d7d7d` on `background-color: #fff`, closest to `#72777d`.
// Legacy opacity for icon states in CSS-only component and non-Codex products.
@opacity-icon-accessory: 0.67; // = `#555` on `background-color: `#fff`, closest to `#54595d`.
// == Box Model properties ==
// Border Styles
@border-style-base: solid;
// Border Widths
@border-width-base: 1px;
// Border Radius. Match WikimediaUI Base and Codex.
@border-radius-base: 2px;
// == Typography ==
// Body content uses the user setting in browser / the system default sans-serif font:
// Arial on Windows, Roboto on Android.
// FIXME: Use WikimediaUI Base's OS specific default sans-serif fonts.
@font-family-sans: sans-serif;