Opened 5 years ago

Closed 5 years ago

#4666 closed defect (bug) (fixed)

P2 Breathe color contrast issues

Reported by: poena's profile poena Owned by: coffee2code's profile coffee2code
Milestone: Priority: normal
Component: Make (Get Involved) / P2 Keywords:


There are some remaining links in the theme that have a contrast ratio
that is lower than 4.5:1 which is needed to follow the WCAG 2.1 color contrast recommendations (
These links are also missing a underline or other kind of text decoration.

The color 888 only has a contrast ratio of 3.54:1 against the white background.
(And the size of the text means it cannot pass as large text which only requires a contrast ratio of 3:1)

In the main stylesheet, line 561 and forward:

.entry-meta .entry-date, .entry-meta .entry-actions, 
.entry-meta .entry-tags, .comment-meta .comment-date, 
.comment-meta .comment-actions {
    font-size: 0.8em;
    font-weight: 300;
    line-height: 1.2;
    color: #888888;

The color needs to be updated to something darker, for example 555 which is used for the main text.

The comment reply count text inside the button uses the color 999999,
and only has a contrast ratio of 2.68:1 against the light grey color which is the background for the button, f8f8f8.

The class name is o2-reply-count and the file that styles this is
o2/modules/post-actions/css/style.css (line 489), so it could be changed there.

Changing the text color to 666 would match it to the Reply text in the button and pass the contrast.

Change History (1)

#1 @coffee2code
5 years ago

  • Owner set to coffee2code
  • Resolution set to fixed
  • Status changed from new to closed

In 9205:

Breathe: Improve font color contrasts.

Props poena.
Fixes #4666.

Note: See TracTickets for help on using tickets.