arya/mozhi
1
0
Fork 0
mirror of https://codeberg.org/aryak/mozhi synced 2025-06-04 00:41:07 +05:30
Code Issues Actions Packages Projects Releases Wiki Activity

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
Details
mozhi pipeline / Build and publish artifacts (push) Has been cancelled
Details

Browse Source 
Reviewed-on: https://codeberg.org/aryak/mozhi/pulls/59
This commit is contained in:
Arya
2025-03-09 11:57:15 +00:00
parent 60e3e48011 15acd5605d
commit 5c99ac4007
1 changed files with 25 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
public/css/style.css
View File

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