== Background
In 358405 we took a short cut to make Special:Notifications look consistent with other pages. At the time we noted accessibility issues relating to color contrast in the light theme and decided to carry them over to the dark theme by applying the notheme and skin-invert classes to the content. Details on why this is occurring and how team's can fix this are provided on T356434
== User story
As a reader I want an accessible experience when viewing Special:Notifications
== Requirements
[] the notheme and skin-invert classes have been removed from the page
[] Hardcoded CSS property values are replaced with Codex design tokens. Update any hex codes e.g. color: #fff with the equivalent design token https://doc.wikimedia.org/codex/latest/design-tokens/overview.html
[] Light theme should have no accessibility issues
[] Dark theme should have no accessibility issues
=== BDD
- For QA engineer to fill out
=== Test Steps
* Enable https://chromewebstore.google.com/detail/wcag-color-contrast-check/plnahcmalebffmaghcpcmpaciebdhgdf Chrome extension
* Visit https://en.wikipedia.beta.wmflabs.org/wiki/Special:Notifications?vectornightmode=1 making sure you have notifications
**What happens?**:
5 color contrast issues:
** (including on hover)
**What should have happened instead?**:
No color contrast issues (See T356434 for solutions)
== Design
❓Please review the following below
// **"Unread" color black contrast issue**//
{F55933009}
//**Example comment in the notifications, color contrast**//
{F55933017}
//**Date and sub descriptions have color contras**t//
{F55933022}
== Acceptance criteria
[] has color contrast issues in night mode
== Communication criteria - does this need an announcement or discussion?
- Add communication criteria
== Rollback plan
- What is the rollback plan in production for this task if something goes wrong?
//This task was created by Version 1.0.0 of the [[ https://mediawiki.org/w/index.php?title=Reading/Web/Request_process | Web team task template ]] using [[ https://phabulous.toolforge.org/ | phabulous ]] //