Background
Codex design tokens are available now as npm package.
They are much more powerful and comprehensive and aim to replace WikimediaUI Base.
Portals has used WikimediaUI Base vars interchangeably and extensively.
As we're touching a number of files and also replace some values that are close, but not 1:1 equivalent, this task is providing the venue to discuss possible visual amendments.
Goal
Replace all calls of the former central variable files @import 'wikimedia-ui-base/wikimedia-ui-base.css';
While at it, also provide best practice usage of Codex design tokens. For example colors shouldn't be directly referenced in code (don't: color: @wmui-color-base30;, do: color: @color-subtle)
Developer/designer notes
- color: @wmui-color-base30; (#72777d) is replaced by color: @color-subtle (#54595d) as only disabled and placeholder elements receive 72777d in Codex latest token definition.
Open questions
Acceptance criteria for done
- Replace all calls to WikimediaUI Base '@import 'wikimedia-ui-base/wikimedia-ui-base.css';'
- Replace all WikimediaUI Base deprecated variables in favor of Codex tokens
- Remove WikimediaUI Base variables dependency
- Replace close static values, starting with background-colors, colors, opacities, border properties and border-radius