Page MenuHomePhabricator

List-Item bullets fail WCAG 2.0 Level AA in `.wikitable`
Closed, ResolvedPublic

Description

The current list-item bullet with main color #00528c fail in wide-spread use case in .wikitable tables with WCAG 2.0 level AA at a contrast ratio of 3.5:1
https://www.mediawiki.org/w/skins/Vector/images/bullet-icon.svg
Possibly also identical to https://commons.wikimedia.org/wiki/File:Vector-bullet-icon.svg (which should be updated if we change the default's color)
(Old broken link: https://www.mediawiki.org/static/1.27.0-wmf.7/skins/Vector/images/bullet-icon.svg )

Event Timeline

Volker_E created this task.Dec 7 2015, 8:27 AM
Volker_E assigned this task to violetto.
Volker_E raised the priority of this task from to Low.
Volker_E updated the task description. (Show Details)
Volker_E added a subscriber: Volker_E.
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptDec 7 2015, 8:27 AM
violetto added a comment.EditedDec 21 2015, 11:45 PM

Keep an eye on changes that impacts this from T109915, once the change goes through, the bullet will be the same as black text color.

Danny_B moved this task from Unsorted to Colors on the Accessibility board.Jan 22 2016, 10:43 PM
Isarra moved this task from Backlog to Needs Design on the Vector board.Apr 7 2016, 1:39 AM
Volker_E claimed this task.May 18 2016, 9:25 PM
Volker_E edited projects, added UI-Standardization-Kanban; removed UI-Standardization.
Volker_E edited subscribers, added: violetto; removed: Volker_E.

The link above is dead.

Quiddity updated the task description. (Show Details)May 19 2016, 5:19 PM
Quiddity set Security to None.

After our color palette M82 got overhauled and improved, the color used for normal text #222 seems appropriate for the list-bullet-items as well, actually making inlining the images obsolete.
#222 works in .wikitables as well and is therefore preferable over #54595d.

Ladsgroup added a subscriber: Ladsgroup.EditedDec 5 2016, 9:08 PM

.wikitable has background of #f9f9f9 (in one less than a week: #f8f9fa) which has 7.71 contrast ratio with #00528c. If we consider the second level of wikitable (#f2f2f2 and in less than a week: #eaecf0) which has 7.25 contrast ratio according to http://webaim.org/resources/contrastchecker/. Am I wrong?

Volker_E added a comment.EditedJan 5 2017, 3:59 AM

@Ladsgroup Agreed. On the th 6.87:1 fulfills our needs contrast-wise.
I'd still reframe this task to get rid of the blue shade, as blue should preferably be just reserved for interactive elements and probably get rid of the image in preference to a HTML only solution in supported browsers.

Restricted Application added a subscriber: TerraCodes. · View Herald TranscriptJan 7 2017, 1:45 AM
Rammanojpotla raised the priority of this task from Low to Medium.Mar 16 2017, 11:22 AM
Volker_E closed this task as Resolved.Apr 8 2019, 6:10 AM

Resolved as stated in T120636#2848751.
Follow-up for color palette color at T220328: Unordered list styles: Use text color for bullet image