| matmarex | |
| Aug 24 2015, 2:07 PM |
| F2412796: 2015_08_27_01_57_14_remove.svg_Opera.png | |
| Aug 27 2015, 12:05 AM |
| F2412797: 2015_08_27_01_56_30_remove.svg_Opera.png | |
| Aug 27 2015, 12:05 AM |
| F2413083: 2015_08_27_02_04_04_remove.svg_Opera.png | |
| Aug 27 2015, 12:05 AM |
| F2319505: pasted_file | |
| Aug 24 2015, 2:07 PM |
Some icons in Flow look blurry. That's because (at least in places where I looked) they are 21x21px, instead of 24x24px which is the original size of the images.
In this screenshot, the 'stripeToC' icon (next to "Summarize") and the 'remove' icon (next to "Delete topic") suffer the most. They should be pixel-perfect and crisp.
| Subject | Repo | Branch | Lines +/- | |
|---|---|---|---|---|
| Fix icon sizes (21px->20px) for sharpness | mediawiki/extensions/Flow | master | +16 -1 |
21px happens because we have font-size: 14px; and the icons are 1.5em. We could make the icons 1.6em to render them at 24px if that helps. But these icons are SVGs, right? Or are you observing this problem with the PNG fallbacks?
They are SVGs, but they still have to be translated to "raster" pixel-based displays when they're displayed, and they're optimized for 24x24px.
Here's the 'remove' icon at 21px and at 24px side-by-side, to me it's obvious the second looks better:
This might be somehow related to T97631, but that bug generally results in icons being rendered at 26x26px instead, which also looks awful but different.
Yeah, this might be related. T97631 is about OOUI expecting the font size to be 12.8px (because it sizes the icons at 1.875em and expects that to be 24px), and that does actually happen in Flow as well, with the pencil icon for the "Edit description" button for example (where the font size is actually 14px and so we get a 26.25px icon). In the case of this bug, mw-ui expects the font size to be 16px (because it sizes icons at 1.5em and expects that to be 24px), but the actual font size in that context is once again 14px and so we end up with 21px icons. To round it out, I've also found an icon (speechBubble) that's rendered at 24.14px (because the font size is 1.15 * 14 = 16.1px), another one that's 30.188px (that 16.1px font size again, but with an OOUI icon instead of an mw-ui icon) and an indicator that's 15.1px instead of 12px (also 16.1px font size).
So, it's a mess. Is this where we give up and size icons in pixels?
If this is not critical, and it probably isn't, then I think the solution is to fix T97631 and continue switching Flow from mw-ui to OOUI icons.
Change 425039 had a related patch set uploaded (by Esanders; owner: Esanders):
[mediawiki/extensions/Flow@master] Fix icon sizes (21px->20px) for sharpness
Change 425039 merged by jenkins-bot:
[mediawiki/extensions/Flow@master] Fix icon sizes (21px->20px) for sharpness