Page MenuHomePhabricator

Gray for active elements in the VE toolbar is too light
Closed, ResolvedPublic1 Estimated Story Points

Description

The color of the text of the active elements in the VE toolbar, is currently #555 (on a white background). This passes all WCAG contrast checks, but it still seems quite pale, and it keeps confusing me into thinking that various parts are inactive,
particularly because the text is next to

  • the thicker width lines of the icons (which hence appear darker),
  • the darker text of the page content,
  • the lightened text of the page Title
  • the even lighter grey of the down-triangle/arrow (which is due to the opacity: 0.3;)

ijItHVC.png (315×725 px, 33 KB)

Changes introduced in v0.17.9 of OOjs UI:

T98988 Toolbar active elements - OOjs UI Demos 2016-09-12.png (129×821 px, 12 KB)

(See also T89271: Gray for "inactive" elements in the toolbar is too light - Once that is darker, the text of the active elements will need to be correspondingly darker, too)

Related Objects

StatusSubtypeAssignedTask
Resolved Spage
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
InvalidVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
ResolvedVolker_E
DuplicateVolker_E
ResolvedNone
ResolvedJdlrobson
ResolvedJdlrobson
Resolved Nirzar
ResolvedVolker_E
OpenNone
ResolvedNone

Event Timeline

Quiddity raised the priority of this task from to Needs Triage.
Quiddity updated the task description. (Show Details)
Quiddity added a subscriber: Quiddity.
nshahquinn-wmf set Security to None.

Interesting that the text of all dropdown menus is pure black #000, not #555 like the toolbar. I'm not sure if that's intentional, or emergent behavior that got "codified".

Interesting that the text of all dropdown menus is pure black #000, not #555 like the toolbar. I'm not sure if that's intentional, or emergent behavior that got "codified".

Patch-For-Review at https://gerrit.wikimedia.org/r/226316

Change 226316 had a related patch set uploaded (by Jforrester):
MediaWiki theme: Align colour of toolbar and dropdown buttons

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

Change 226316 merged by jenkins-bot:
MediaWiki theme: Align colour of toolbar and dropdown buttons

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

Version 0.17.9 of OOjs UI will roll out an overhaul of various elements to comply to WCAG 2.0 level AA guidelines, based on a new, improved color palette by design folks at WMF. A small part of this change is also increasing contrast on toolbar tool items from currently #555 to #222.
I'm leaving it up to @Quiddity as author of this task to judge and (presumptively) change this task to “resolved”.

Looks good to me.