Adjust contrast for notification text and content excerpts
Closed, ResolvedPublic

Description

Currently, the notification text and content excerpts use a grey level for text which does not provide enough contrast. That makes it hard to identifying the main text as a much more prominent piece of information compared to other elements such as secondary actions.
I propose to increase the contrast to make items easier to scan in a list.

Current status:

  • Main text color: #666
  • Content excerpt color: #888

Proposed:

  • Main text color: #111
  • Content excerpt color: #777

Pginer-WMF updated the task description. (Show Details)
Pginer-WMF raised the priority of this task from to Needs Triage.
Pginer-WMF added a subscriber: Mooeypoo.
Restricted Application added subscribers: StudiesWorld, Aklapper. · View Herald TranscriptFeb 5 2016, 11:16 AM

Change 270850 had a related patch set uploaded (by Sbisson):
Increase contrast between header and body text in notifications

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

SBisson claimed this task.Feb 15 2016, 8:48 PM
SBisson set Security to None.

Change 270850 merged by jenkins-bot:
Increase contrast between header and body text in notifications

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

Etonkovidova renamed this task from Adjust contrast for notification text and content excepts to Adjust contrast for notification text and content excerpts.Feb 16 2016, 10:04 PM

Checked in betalabs - much better contrast, especially for seen notifications (with grey background).

.mw-echo-ui-notificationItemWidget-content-message-header

color: #111;

.mw-echo-ui-notificationItemWidget-content-message-body

white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #777;

And for secondary links:
.mw-echo-ui-menuItemWidget-content

display: inline-block;
margin-left: 2em;
font-weight: normal !important;
color: #000 !important;
jmatazzoni closed this task as Resolved.Feb 17 2016, 12:20 AM