From 86959194c438ac53314cd60ee1d2e06a0021de69 Mon Sep 17 00:00:00 2001 From: Danny Colin Date: Sat, 4 Oct 2025 23:35:22 -0400 Subject: [PATCH] Add dark mode support for jQuery UI components --- .../_default_/pub/selectize-0.12.1-dark.css | 32 +++++++++++++++++++ webskins/_default_/tmpl/BaseHeader.tmpl | 1 + 2 files changed, 33 insertions(+) create mode 100644 webskins/_default_/pub/selectize-0.12.1-dark.css diff --git a/webskins/_default_/pub/selectize-0.12.1-dark.css b/webskins/_default_/pub/selectize-0.12.1-dark.css new file mode 100644 index 00000000..7c3b136f --- /dev/null +++ b/webskins/_default_/pub/selectize-0.12.1-dark.css @@ -0,0 +1,32 @@ +:root { + --selectize-input-background-color: #ffffff; + --selectize-input-border-color: #cccccc; + --selectize-input-div-background-color: #eeeeee; + --selectize-input-div-color: #000000; +} + +@media screen and (prefers-color-scheme: dark) { + :root { + --selectize-input-background-color: #0c0c0d; + --selectize-input-border-color: #3e3e3f; + --selectize-input-div-background-color: #2a2a2b; + --selectize-input-div-color: #fafafa; + } +} + +/* jQuery UI components */ +.selectize-input, +.selectize-control.single +.selectize-input.input-active { + background: var(--selectize-input-background-color); +} + +.selectize-input { + border: 1px solid var(--selectize-input-border-color); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); +} + +.selectize-control.multi .selectize-input > div { + background: var(--selectize-input-div-background-color); + color: var(--selectize-input-div-color); +} diff --git a/webskins/_default_/tmpl/BaseHeader.tmpl b/webskins/_default_/tmpl/BaseHeader.tmpl index 7d7b69b0..2c7c2e94 100644 --- a/webskins/_default_/tmpl/BaseHeader.tmpl +++ b/webskins/_default_/tmpl/BaseHeader.tmpl @@ -6,6 +6,7 @@ +