Page MenuHomePhabricator

Regressions caused by Timeless-specific form styles removal and related changes
Closed, ResolvedPublic

Description

Compare Special:Contributions/MediaWiki message delivery on Wikidata and Meta-Wiki versus English Wikipedia.

WikidataMeta-WikiEnglish Wikipedia

The font, for instance, is too small and now displays as Arial instead of Helvetica, because the load.php CSS is different. (I think they were different to begin with, but maybe there was a syncing error.) I don't know if anything else is different.

Line 4876, English Wikipedia:

body {
 font-family:'Helvetica Neue','Nimbus Sans','Helvetica','Arial',sans-serif;
 color:#001133;
 background:#777777;
 font-size:0.95em;
 line-height:1.4
}

Line 4637, Meta-Wiki:

body {
 font-family:sans-serif;
 color:#001133;
 background:#777777;
 font-size:0.9em;
 line-height:1.4
}

This is due to: https://gerrit.wikimedia.org/r/501850

Event Timeline

Jc86035 created this task.Apr 18 2019, 10:10 AM
Jc86035 updated the task description. (Show Details)
Jc86035 updated the task description. (Show Details)Apr 18 2019, 10:14 AM
Jc86035 updated the task description. (Show Details)
Jc86035 updated the task description. (Show Details)Apr 18 2019, 11:17 AM
Jc86035 updated the task description. (Show Details)Apr 18 2019, 4:32 PM

Oh, yeah, this was intentional. How bad is the new version (as in, the one on the non-wikipedia ones)? What's it like for you?

Jc86035 added a comment.EditedApr 18 2019, 4:46 PM

It doesn't prevent me from doing anything, but it looks a bit like someone tried to slap too much Vector into it. (It's possible that it's partly because I don't really like Arial, but the different CSS does significantly affect how nice the skin looks for me.)

Also, a lot of things (e.g. the "From date"/"To date" boxes) are too close to each other.

Isarra renamed this task from Wikis using the wrong CSS for Timeless skin to Regressions caused by Timeless-specific form styles removal and related changes.Apr 18 2019, 5:35 PM
Isarra updated the task description. (Show Details)

Okay, so default forms now have problems, especially when mixed with OOUI elements (as is the case on special:contributions), so we probably want some generic-arse stuff returned for the things still that, since falling back to the defaults is kinda not good.

Also issues with the font - are there issues that it's too small now, or is it more that arial specifically is kinda crappy, or both, or something else?

(Arial being crap was actually why I killed the custom fonts, since it was generally what we were winding up with on linux to match all the helvetica elsewhere, and just... ugh. But that doesn't mean the rest may not have been better...)

Most Linux distributions have Liberation Sans, don't they? Or at least one sans-serif font that's not Arial, I would think.

Jc86035 added a comment.EditedApr 18 2019, 5:42 PM

The issue isn't really that the font is unreadable or terrible, since it's almost exactly the same as what Vector looks like on a computer without Helvetica installed. It's just not really consistent with what "Timeless" looks like, since the skin is supposed to look less cramped and less... 2000s (for lack of a better descriptor) than Vector and Monobook.

I can't really form an unbiased opinion, because it could all be because I just got used to what Timeless looked like from looking at it too much. I do still think it used to look better, though.

Less cramped, you say? :D

So I had this hilarious plan to just go full verdana/deja vu/whatever on this, but then I realised that would take effort, so now... let's try stealing phabricator's font stack instead. But with less arial because I still hate arial.

And if you think this is unprofessional design practice, you're probably right, but right now I'm mostly just procrastinating from fixing the caching problems with my custom parser, so...

Well, the linux ones aren't generally actually using arial, but the arial-like ones are often not the greatest either.

Okay, so the font stack problems are definitely an ooui problem, as phabricator does not have any of the weird offset issues ooui does, with the same fonts. Joy.

Change 504963 had a related patch set uploaded (by Isarra; owner: Isarra):
[mediawiki/skins/Timeless@master] New font stack, plus some generic forms and crap

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

The newer CSS still looks a bit weird. The headers are much larger relative to the rest of the text, the GeoHack coordinates don't display correctly, and there are still a few places where there isn't enough padding.

I actually thought the body text was smaller than in Vector, even though it's slightly larger (14.4px to 14px).

Dammit stop being so helpful.

(kidding; this feedback is greatly appreciated, I'm just slow)

The font size should already be back to where it was before, though the headers are still a bit bigger... (was .95em, lowered to .9 with the first patch, bumped back to .95 with the new one)

Coordinates aren't going to display reliably properly until we get some sort of actual handling for them besides positioning them off the normal content.

Change 504963 merged by jenkins-bot:
[mediawiki/skins/Timeless@master] New font stack, plus some generic forms and crap

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

ashley closed this task as Resolved.
ashley assigned this task to Isarra.

@Isarra Is the change to the checkbox styling (i.e. the display:block CSS) intentional? In the other skins they display on a single line.

Yes, because that's more consistent with the newer forms, and we were getting some damn weird wrapping as-was.

But while it was intentional, that doesn't necessarily mean it's wise. Is it making things take up too much space, or other problems, would you say?

putnik added a subscriber: putnik.Thu, Jun 13, 4:39 PM

@Isarra Please look at T225412. display: block broke the non-JavaScript interface.