Problem

The Mismatch Finder's user interface was styled using WiKit tokens. With the WiKit design system being superseded by Codex, the official Wikimedia design system. The utilization of WiKit tokens is not recommended, and they should be replaced in order to reduce maintenance costs and ensure consistency.

Solution

We have to replace the WiKit background and border colors, and typography tokens used to style the MSMF's app interface by Codex's.

Please note that all specs indicate needed changes exclusively.

To support the replacement, here's a WiKit to Codex tokens mapping. You can find the WiKit tokens matched with their corresponding Codex token.

Considerations

• Typographic styles are currently defined in the MSMF app.scss file, including WiKit mixins under each relevant selector. The assumption is that we'll replace said mixins by the relevant Codex tokens in each case, and create any missing styles (see specs included above for more details).

• The current body style will be replaced by Body M. A new Body S style will be used to define the smaller text within the MSMF footer

Acceptance criteria

• WiKit tokens used to define the colors and text styles of Mismatch finder are replaced by Codex tokens