Support color scheme dark

[greggman]

Requirements

• Filling out the template is required. Any pull request that does not include enough information to be reviewed in a timely manner may be closed at the maintainers' discretion.
• All new code requires tests to ensure against regressions.

Description of the Change

Adds CSS to support prefers-color-scheme: dark as well as a small bit of JavaScript for the progress indicator.

Alternate Designs

Change the progress indicator to use SVG which can by styled by CSS. But one change at a time suggests that should be a separate change.

Why should this be in core?

Because bright screens can be annoying in certain situation. The motivation for adding a dark mode was I was working on a flight. All the window shades are pulled down. All the terminals and editors I run were in dark mode but then when I went to run the tests, BOOM!, I'm lighting up all the seats around me.

Benefits

People who like dark mode, which is becoming fairly popular, can get mocha in dark mode.

Possible Drawbacks

Browsers that don't support CSS var will have issues. Basically IE

Applicable issues

#4895

[linux-foundation-easycla[bot]]

The committers listed above are authorized under a signed CLA.

• :white_check_mark: login: greggman / name: Greggman (2233984eb829bcfcb6cf640ba4dcb44a99fe7941)

[outsideris]

I will merge this in a few days.

[juergba]

@outsideris please set the according labels, milestones and close the relevant issues. It's unfair - if you merge PR's - to leave the cleaning to others. Thank you.

[outsideris]

Sorry, I missed them.

[juergba]

@outsideris have you tested anything of this before merging?

How do you set the dark mode, how to overwrite the settings? Any docs?

[outsideris]

@juergba Sure. It follows the system theme on OS. I tested it on my macOS.

[outsideris]

The percentage color in the circle is different from mine. Are you using windows?

[juergba]

Yes, Windows and Chrome. I have to refresh then the circle gets filled.