Page MenuHomePhabricator

UploadWizard - adjustments for underlined links
Closed, ResolvedPublic

Assigned To
Authored By
Etonkovidova
Dec 4 2023, 6:24 PM
Referenced Files
F41599513: Screen Shot 2023-12-13 at 2.31.14 PM.png
Dec 13 2023, 10:50 PM
F41599511: Screen Shot 2023-12-13 at 2.41.52 PM.png
Dec 13 2023, 10:50 PM
F41599509: Screen Shot 2023-12-13 at 2.41.38 PM.png
Dec 13 2023, 10:50 PM
F41562569: border.png
Dec 5 2023, 12:23 PM
F41562567: offset4.png
Dec 5 2023, 12:23 PM
F41562565: offset3.png
Dec 5 2023, 12:23 PM
F41562563: current.png
Dec 5 2023, 12:23 PM
F41551426: Screen Shot 2023-12-01 at 9.06.14 AM.png
Dec 4 2023, 6:24 PM

Description

Split from T352477 (as a follow-up based on this comment T352477#9379215 - the numbering refers to the original ticket).

(8) Underline looks more prominent on mockup. I checked the contrast (as part of Accessibility test) - no complaints.
@Sneha's comment:

#8 Yes the underline here needs to be fixed as it is hardly visible. Also it is too close to the text in beta.

mockupbeta
Screen Shot 2023-12-01 at 9.06.30 AM.png (884×2 px, 143 KB)
Screen Shot 2023-12-01 at 9.06.14 AM.png (710×1 px, 156 KB)

Event Timeline

Etonkovidova renamed this task from UploadWizard -adjustments for underlining links to UploadWizard - adjustments for underlined links.Dec 4 2023, 6:25 PM

What's on beta is plain old standard text-decoration: underline.
MediaWiki tends to display links in blue (or red) without underline, so we're already deviating from standard style. But when underlines show up (e.g. on hover), they are this same default style.

What's in the mocks is also not entirely possible. Let's review options (rendered on Firefox on OSX):

current beta (text-decoration: underline)underline text-underline-offset: 3pxunderline text-underline-offset: 4pxborder-bottom: 1px solid #202122
current.png (128×858 px, 37 KB)
offset3.png (128×858 px, 37 KB)
offset4.png (128×858 px, 37 KB)
border.png (128×858 px, 37 KB)

Note how in the case of a border-bottom, the underline is slightly further down. The 3px and 4px underline-offset options more closely match the mock, but are slightly different when looking at the g and p in the "Village Pump" link.


Please advise on which exact implementation is desired. (IMO I would stick with the default underline style currently used for max consistency)

Noting here that we decided to go with standard blue links on all of these warning messages. I will update in Figma. We need to make sure all four message boxes are updated as part of this ticket.

@Etonkovidova @matthiasmullie

Change 980854 had a related patch set uploaded (by Matthias Mullie; author: Matthias Mullie):

[mediawiki/extensions/UploadWizard@master] Remove custom link styles

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

Change 980854 merged by jenkins-bot:

[mediawiki/extensions/UploadWizard@master] Remove custom link styles

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

Etonkovidova claimed this task.

Checked in commons wmf.9 - the examples are below:

Screen Shot 2023-12-13 at 2.41.38 PM.png (1×2 px, 291 KB)
Screen Shot 2023-12-13 at 2.41.52 PM.png (1×2 px, 272 KB)
Screen Shot 2023-12-13 at 2.31.14 PM.png (952×2 px, 257 KB)