Page MenuHomePhabricator

Echo notification icons should be properly themed in MonoBook
Closed, ResolvedPublic

Description

In MonoBook the notification icons are black because the apex theme does not support inverted icons. It should be possible to make them white, but last time they were flashing (T111821: Echo flyout icon flashes color change from white to black in MonoBook skin)

Event Timeline

NordNordWest raised the priority of this task from to Needs Triage.
NordNordWest updated the task description. (Show Details)
NordNordWest added a project: Notifications.
Restricted Application added a project: Collaboration-Team-Triage. · View Herald TranscriptSep 11 2015, 4:45 PM
Restricted Application added a subscriber: Aklapper. · View Herald Transcript
Aklapper added a subscriber: NordNordWest.

Hi @NordNordWest. Thanks for taking the time to report this!
This particular problem has already been reported into our bug tracking system as T111821, but please feel free to report any further issues you find.

Legoktm reopened this task as Open.Sep 11 2015, 9:47 PM
Legoktm added a subscriber: Legoktm.

I don't think this a dupe...

Legoktm renamed this task from Echo notification icons in Monobook to Echo notification icons should be white in MonoBook to match Vector.Sep 11 2015, 9:48 PM
Legoktm updated the task description. (Show Details)
Legoktm set Security to None.
Legoktm moved this task from Backlog to Needs code on the Notifications board.Sep 16 2015, 11:13 PM

Open questions for UI-Standardization:

  • Should apex support inverted icons?
  • Should OOUI PHP output black icons for apex (Echo is currently hacking around this)
Catrope triaged this task as High priority.Sep 23 2015, 11:43 PM
Catrope added a subscriber: Catrope.

Or we can make the text black/dark grey to match the icon. Here I've also removed the background and reduced the font size to match:

Or we can make the text black/dark grey to match the icon. Here I've also removed the background and reduced the font size to match:

That looks nice! What's the CSS you used for that?

Or we can make the text black/dark grey to match the icon. Here I've also removed the background and reduced the font size to match:
F2675359

That looks nice! What's the CSS you used for that?

+1

I just set the background to transparent, color to back, the font size back to 1em, and opacity to 0.7 ish.

Esanders renamed this task from Echo notification icons should be white in MonoBook to match Vector to Echo notification icons should be properly themed in MonoBook .Nov 4 2015, 2:11 PM
Esanders updated the task description. (Show Details)

Change 250969 had a related patch set uploaded (by Esanders):
Separate skin specific styles and improve Monobook appearance

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

BeforeAfter
BeforeAfter

In this design it's really difficult to see the difference between having unseen messages (blue background in vector) and not having unseen messages (grey background)

This comment was removed by Catrope.

Change 250969 merged by jenkins-bot:
Separate skin specific styles and improve Monobook appearance

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

Related to this, there is a proposal for changing the notification badges which do not require inverted icons: T115845
The proposed approach worked well in our research sessions, but we have not checked if there would be some Monobook-related limitation. Feel free to comment on the ticket if you think there may be any.

Checked in betalabs:

Legoktm closed this task as Resolved.Nov 19 2015, 10:16 PM

A problem in the Modern skin has been reported: https://en.wikipedia.org/wiki/Wikipedia:Village_pump_%28technical%29#Notification_look_change

Based upon timing, it might be related to this. Does anyone know whether Modern uses the same Notification icons as Monobook?