Description

Right now, LibreSpeed's webpage respects the dark or light style preferences of the user's operating system. However, the server selector does not respect the preference and is displayed in a light style even though everything else is displayed in a dark style, causing inconsistency in the layout. This issue can be reproduced using any web browser.

I propose to apply the following to the CSS rules:

:root {
  color-scheme: light dark;
}

This way, the selector will respect the dark style and help to keep the design consistent (the server selector will be displayed in light style when the user prefers it).

Why it should be implemented

This would improve the readability and accessibility of the service for those who opt for the dark style. And is also very easy to fix.

Optional: implementation suggestions

I suggest to opt the entire page into the user's color scheme preferences, declaring color-scheme on the :root element. You can get more information here: https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme

Optional: screenshots

Firefox (right now)

Firefox (after my suggestion)

Chromium (right now)

Chromium (after my suggestion)