== Background
QuickSurveys have a non-standard background color that clashes with dark mode (which can be activated by putting ?vectornightmode=1 at the end of any URL)
{F54942086}
== User story
As someone who wants to run a quick survey, I need to be able to target users using dark mode.
== Requirement
[] Surveys should be readable in dark mode.
[] The background show use the design token `@background-color-neutral`
== BDD
```
Feature: Readable QuickSurveys in Dark Mode
Scenario: Ensure QuickSurveys are readable in dark mode
Given the QuickSurveys feature is enabled
When the user views a survey in dark mode
Then the survey should use the `@background-color-neutral` design token for the background color
And the survey should be readable and accessible
```
== Test Steps
__Test Case 1: Verify QuickSurveys in Dark Mode__
1. Enable dark mode.
2. Navigate to [this beta test page](https://ca.wikipedia.beta.wmflabs.org/wiki/Usuari:KGraessle/proves?quicksurvey=AutoModerator%20Patroller%20Workstream%20Survey&vectornightmode=1).
3. In the Developer console, run:
```
mw.loader.using( 'ext.quicksurveys.init' )
.then( () => {
mw.extQuickSurveys.showSurvey( 'AutoModerator Patroller Workstream Survey' );
} );
```
4. **AC1:** Confirm that the survey uses the `@background-color-neutral` design token for the background color.
5. **AC2:** Confirm that the survey is readable and accessible in dark mode.
== Design
- Add mockups and design requirements
== Communication criteria - does this need an announcement or discussion?
N/A
== Rollback plan
N/A
//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 ]] //