Merge pull request 'fix: improve colour contrast in select menus' (#59) from taibhse/mozhi:improve-select into master
Some checks failed
mozhi pipeline / Push Docker image to Codeberg docker registry (push) Successful in 23m27s
mozhi pipeline / Build and publish artifacts (push) Has been cancelled

Reviewed-on: https://codeberg.org/aryak/mozhi/pulls/59
This commit is contained in:
Arya 2025-03-09 11:57:15 +00:00
commit 5c99ac4007

View File

@ -16,31 +16,37 @@
--textarea-bg: var(--bg-color);
--select-border: #ccc;
--select-bg: #2f2f2f;
--select-fg: #b2b2b2;
--select-fg: #fff;
--select-hover: #595959;
--search-text: #fff;
}
@media (prefers-color-scheme: light) {
:root {
--bg-color: #ffedd5;
--fg-color: #000000;
--button-fg: #fbe9e7;
--button-fg: #fff;
--textarea-focus-border: #261f1e;
--textarea-bg: #fff4e6;
--select-border: #888888;
--select-bg: #fff;
--select-fg: #2f2f2f;
--select-hover: #e0e0e0;
--search-text: #000000;
}
}
:root.light {
--bg-color: #ffedd5;
--fg-color: #000000;
--button-fg: #fbe9e7;
--button-fg: #fff;
--textarea-focus-border: #261f1e;
--textarea-bg: #fff4e6;
--select-border: #888888;
--select-bg: #fff;
--select-fg: #2f2f2f;
--select-hover: #e0e0e0;
--search-text: #000000;
}
body {
@ -260,6 +266,22 @@ button:hover {
color: var(--select-fg);
}
.nice-select .nice-select-dropdown {
background-color: var(--select-bg);
color: var(--select-fg);
}
.nice-select .nice-select-search {
background-color: var(--select-bg);
color: var(--search-text);
}
.nice-select .option:hover,
.nice-select .option.focus,
.nice-select .option.selected.focus {
background-color: var(--select-hover);
}
.center-area {
width: 70%;
margin: 10px auto;