Page MenuHomePhabricator

[Bug] Vertical spacing of "Learn more" link in page issue banners
Closed, ResolvedPublic

Description

Something seems to have happened to the vertical alignment of the "Learn more" link in page issue banners.

alignment.jpg (1×2 px, 1 MB)

Environments observed

This is a bit confusing but as far as I can tell it's affecting:

  • iPhone, Safari

-MacBook Pro, Chrome

but it's looking fine in:
-iPhone, Chrome
-MacbookPro, Safari

Developer notes

https://phabricator.wikimedia.org/T205146#4612281

Event Timeline

alexhollender_WMF renamed this task from [Bug to [Bug] Vertical spacing of "Learn more" link in page issue banners.Sep 21 2018, 7:46 PM
alexhollender_WMF updated the task description. (Show Details)
ovasileva triaged this task as Medium priority.Sep 24 2018, 5:00 PM

You touched on this problem in T197931#4471221 and this is a known problem (at least to me) with short descriptions. For the learn more to truncate short issues, it needs to reserve 2 lines, even if those lines are not used. @Jdrewniak can confirm.

Given the amount of work that truncation task took, I'm wary about us fixing this edge case.

On a general note, we should be wary that we'll likely see issues with the learn more link as we roll out to other wikis. The templates on other wikis maybe be different and it's not sustainable for us to fix every wiki. We have to offload this work to editors or find a better long term solution (being discussed in T201975).

@Jdlrobson this is a new issue. If you look at the screenshot in the description you can see that it differs from the screenshots in the ticket you linked T197931#4471221. The Learn more button has been pushed down by a seemingly random amount:

Artboard.jpg (1×1 px, 769 KB)

Oh that bit is to do with the fact that the templates on Latvian are different.
The problem in question is an inline style that I added as part of T203802:

body.skin-minerva .mw-parser-output .mbox-text-span

Removing this has more serious consequences making many amboxes unreadable (as the template doesn't guarantee a block element inside the issue text and the templates on Latvian are used very differently to English which we did all our testing on)
Two quick examples:

Screen Shot 2018-09-24 at 12.55.56 PM.png (98×390 px, 19 KB)

https://lv.m.wikipedia.org/wiki/Dimetilsulfāts
Screen Shot 2018-09-24 at 1.01.50 PM.png (197×1 px, 36 KB)

https://lv.m.wikipedia.org/wiki/2020._gada_Tour_de_France#/random

We can spend time auditing, reviewing and fixing these amboxes on the project, but the current styles are the most generic and as I've said many times before, fixing these issues on wiki ourselves doesn't scale!

Unless we do want to do this, I propose declining this task and recording it as a known issue and documenting the problem inside T201975.

To @ovasileva - do we want to spend time auditing, reviewing and fixing page issues styles on Latvian with TemplateStyles?

(just to clarify, when I raised this I didn't have context as to whether the issue was specific to Latvian Wikipedia or not. I tried to reproduce on Staging but it was set to Latvian)

Jdlrobson claimed this task.

Checked with Alex and this particular issue is fixed (but more related pains remain)