mediawiki.skin.variables: Add Opacities to skin.defaults variables

Orienting on Codex Opacity tokens as defined in v10 of 2022-04-01 in
https://www.figma.com/file/h9pA2CCl2i0wtlTKNChaES/Opacities---Tokens?node-id=368%3A2139
Also adding legacy opacity icon tokens for use in all non-Codex
products.
Specifically the icon ones are already in use in Vector.

Bug: T317800
Change-Id: Ib699ccf0342030f521ad876d70974b8818f877cb
This commit is contained in:
Volker E 2022-09-16 22:24:38 -07:00
parent 5e96b277a7
commit ee24a19c8d
1 changed files with 16 additions and 0 deletions

View File

@ -30,6 +30,22 @@
@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;
// Warning: the following token is deprecated (Legacy opacity for icon states in non-Codex products.)
@opacity-icon-base: 0.87; // = `#222` on `background-color: #fff`, closest to `#202122`.
// Warning: the following token is deprecated (Legacy opacity for icon states in non-Codex products.)
@opacity-icon-base--hover: 0.74; // = `#424242` on `background-color: #fff`, closest to `#404244`.
// Warning: the following token is deprecated (Legacy opacity for icon states in non-Codex products.)
@opacity-icon-base--selected: 1;
// Warning: the following token is deprecated (Legacy opacity for icon states in non-Codex products.)
@opacity-icon-accessory: 0.67; // = `#555` on `background-color: `#fff`, closest to `#54595d`.
// Warning: the following token is deprecated (Legacy opacity for icon states in non-Codex products. Has only been used for icons despite the name.)
@opacity-base--disabled: 0.51; // = `#7d7d7d` on `background-color: #fff`, closest to `#72777d`.
// 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.