Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add a dark style for the <select> HTML property to improve consistency #667

Open
IngrownMink4 opened this issue Sep 22, 2024 · 0 comments
Open

Comments

@IngrownMink4
Copy link

IngrownMink4 commented Sep 22, 2024

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_dark_style_before_patch

Firefox (after my suggestion)
firefox_dark_style_after_patch

Chromium (right now)
chromium_dark_style_before_patch

Chromium (after my suggestion)
chromium_dark_style_after_patch

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant