Page MenuHomePhabricator

Form field legends shouldn't receive 'uppercase'
Closed, ResolvedPublic

Assigned To
Authored By
Volker_E
Mar 19 2019, 7:11 PM
Referenced Files
F28466009: image.png
Mar 26 2019, 5:41 PM
F28473117: image.png
Mar 26 2019, 5:41 PM
F28473162: image.png
Mar 26 2019, 5:41 PM
F28466004: image.png
Mar 26 2019, 5:41 PM
F28473103: image.png
Mar 26 2019, 5:41 PM
F28473097: image.png
Mar 26 2019, 5:41 PM
F28473110: image.png
Mar 26 2019, 5:41 PM
F28421608: image.png
Mar 19 2019, 7:11 PM
Tokens
"Love" token, awarded by alexhollender_WMF.

Description

MobileFrontend currently makes use of text-transform: uppercase on fieldset legends.
That should be seen as non-recommended pattern, as it is

  • over-emphasizes legends, they are already carrying bold font styling
  • out of touch with other elements on the page,
  • it could result in unintended i18n side-effects

We try to keep special font treatment as low as possible, if not clearly stated reasons are given in UI-Standardization.

image.png (1×1 px, 216 KB)

Moreover such styling should be part of the skin and not of the MobileFrontend extension.

Proposal

Removing it.

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald Transcript

@alexhollender Assigning to you for visibility and sign-off.

MobileFrontend makes currently 5 usages of text-transform: uppercase:

  • form legend
  • References drawer
  • Language searcher
  • Pagelist info
  • Mobile diff #mw-mf-diffview .meta

MinervaNeue makes none and the only other, rather prominent occurrence, is
RelatedPages heading.

+1

Would it be possible to include some before/after screenshots?

PageBeforeAfter
Blocked user
image.png (1×2 px, 150 KB)
image.png (1×2 px, 150 KB)
Logs
image.png (1×2 px, 171 KB)
image.png (1×2 px, 140 KB)

Other untouched text-transform usages:

  • References drawer

image.png (222×1 px, 25 KB)

  • Language searcher

image.png (1×2 px, 126 KB)

  • Mobile diff

image.png (876×2 px, 123 KB)

Couldn't find pagelist info class in action.

Change 499907 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[mediawiki/extensions/MobileFrontend@master] Remove uppercase styling from legend elements

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

Volker_E triaged this task as Medium priority.Mar 28 2019, 8:46 PM
Volker_E moved this task from Backlog to Doing… on the UI-Standardization-Kanban board.

Change 499907 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Remove uppercase styling from legend elements

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

Volker_E claimed this task.
Volker_E removed a project: Patch-For-Review.