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.
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)
- 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.
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