Page MenuHomePhabricator

new Lexeme creation page uses a font different from the rest of the site
Closed, ResolvedPublic3 Estimated Story Points

Description

Problem:
The Special:NewLexemeAlpha page uses a font different from the rest of Wikidata. Feedback from testing says it should not because it makes the page feel out of place.

Acceptance criteria:

  • Special:NewLexemeAlpha uses the same font as the rest of Wikidata depending on the users' theme

Notes:

  • We acknowledge that this can be done with wikit however solving this via wikit has been proven to be more difficult and so for the time being we will accept a more suboptimal solution.

Event Timeline

@Sarai-WMDE Could you please have a look? Was this intentional?

The NewLexeme alpha page is using the global font family stack specified by Wikimedia-ui-base and, soon, Codex. Nevertheless, this font stack shouldn't "permeate" to the UI: instead, it should be overridden by the skin's base font family (in case of Vector, sans-serif). So yes, this should be corrected. If I had to define the task, it would be something like: "Avoid overriding the skin's font family".

Mh, this will be a bit tricky, because the font-family in very easy to override as its specificity is almost as low as possible:

Vector/resources/common/typography.less
html,
body {
	font-family: @font-family-sans;
}

And in the file where that is defined, it reads:

Vector/resources/mediawiki.less/mediawiki.skin.variables.less
// FIXME: Use WikimediaUI Base's OS specific default sans-serif fonts.
@font-family-sans: sans-serif;

Though that comment was added two years ago in 434214: Implement mediawiki.skin.variables.less for Vector PS6 for T112747.

One way we could do this is by dropping the font-family rule from the Wikit typography mixins. Or maybe provide some kind of override? 🤔 Otherwise they would be pretty unusable for on-wiki projects.

This could look like

@mixin body ($font-family: $font-family-style-body,$color: $font-color-base, $line-height: $font-line-height-style-body, $font-weight: $font-weight-style-body) {
    font-family: $font-family;
    font-size: $font-size-style-body;
    font-weight: $font-weight; //can also be $font-weight-style-body-bold
    line-height: $line-height; //can also be set to the smaller $line-height-style-body-component
    color: $color;
}

and be used as

@mixin body ($font-family: unset)

Though I haven't actually tested that yet.

Alternatively, we could define a global css variable for the font-family in Vector and other skins and then use that in Wikit with the other fonts as fallback. Though that seems like it would need more work and more coordination and be overall more fragile.

Change 836844 had a related patch set uploaded (by Lucas Werkmeister (WMDE); author: Lucas Werkmeister (WMDE)):

[mediawiki/extensions/WikibaseLexeme@master] Inherit skin font family on Special:NewLexemeAlpha

https://gerrit.wikimedia.org/r/836844

guergana.tzatchkova renamed this task from new Lexeme creation page uses a font different from the rest of the side to new Lexeme creation page uses a font different from the rest of the site.Oct 4 2022, 12:45 PM

Change 836844 merged by jenkins-bot:

[mediawiki/extensions/WikibaseLexeme@master] Inherit skin font family on Special:NewLexemeAlpha

https://gerrit.wikimedia.org/r/836844