Codex has a legacy Wikimedia stylesheet in core that it sets for Vector 2022. We'd like to see if we can get rid of this.
@Jdlrobson discovered that Codex icons are sometimes larger in Vector than they should be. This is because Vector is using the WikimediaUI Legacy theme from Codex, which uses a 14px base font size, but the font size in much of Vector is actually 16px. In such contexts, em-based calculations that were meant for a 14px base font size output larger sizes.
For example, icons should effectively be 20px minimum in all contexts, but should scale up with increasing font size. We do this by setting the icon size to the em equivalent of 20px (1.25em at a 16px font size and 1.42857em at 14px), then setting a min-size of 20px so the icons can't shrink beyond that. In Vector, when the font size is set to 16px, the 1.42857em height/width value is still used and produces an icon that is 22.857px. This is a regression compared to the existing mw.ui icons.
To resolve this issue, we propose swapping out the legacy theme for the default theme, wikimedia-ui, in Vector. This should resolve any sizing issues in a 16px context. However, we will need to see what happens with the header search box, which is currently set to 14px.
Acceptance criteria
- Try using the wikimedia-ui Codex theme in Vector and evaluate the results, especially for TypeaheadSearch. To do this, replace the line here: https://gerrit.wikimedia.org/g/mediawiki/skins/Vector/+/784fa9a13523f894fc6ee4487c900cd17d65d33d/resources/mediawiki.less/vector-2022/mediawiki.skin.variables.less#19 with an import for theme-wikimedia-ui.less.
- Note any Pixel-related regressions that occur with the change
- Note CSS that can be used to fix the Pixel-related regressions.
- Determine whether doing this is a good idea.