[UI]: Add a dark mode/theme to nuget.org

[loic-sharma]

Related Problem

A top ask in the redesign survey was to add a dark mode.

The Elevator Pitch

Kudos to Dark Reader extension and @jcjiang for the "mock up" 😄

Additional Context and Details

No response

[renemadsen]

Any update on this issue?

[joelverhagen]

@renemadsen, no update yet. It's on our backlog but currently below the cutline for the current semester due to priority and capacity issues.

If you or anyone else the community is interested in making a contribution to complete this, that would be amazing! NuGet.org team could guide someone along the way to get the change tested and verified. I think one of the questions is how to toggle the setting and make the setting "sticky".

Some resources to consider:

• StackOverflow's journey for dark mode: https://stackoverflow.blog/2020/03/31/building-dark-mode-on-stack-overflow/
• Accessibility (most notably color contrast guidelines) as detected by Accessibility Insights FastPass.

[shahabhijeet]

@joelverhagen just saying..... getting at least two pages dark themed without the sticky-ness would be huge for users.
For e.g. the home page and the search results page, even if these two pages get dark themed for the duration of the browser session that will be huge.
I don't mind switching it back to dark theme every time I visit nuget.org (and my previous setting did not stick)
Here is how I would imagine this might happen

1. Introduce a "Beta Experience Slider" on the home page.
2. Once I opt into "Beta Experience" I will start getting option to change to dark theme (for home page and search result page) for the duration of the browser session.

[NiKiZe]

Just use https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme why even bother with the toggles?

[JonDouglas]

Shipped via

https://devblogs.microsoft.com/nuget/dark-mode-now-available-on-nuget-org/