Fixed #32512 -- Fixed admin dark theme for autocomplete fields.

This commit is contained in:
mimi89999 2021-03-06 17:39:54 +01:00 committed by Mariusz Felisiak
parent afb0eb8bb3
commit 0df5c8187a
2 changed files with 16 additions and 8 deletions

View File

@ -80,7 +80,7 @@ select.admin-autocomplete {
} }
.select2-container--admin-autocomplete.select2-container--disabled .select2-selection--single { .select2-container--admin-autocomplete.select2-container--disabled .select2-selection--single {
background-color: #eee; background-color: var(--darkened-bg);
cursor: default; cursor: default;
} }
@ -94,7 +94,7 @@ select.admin-autocomplete {
} }
.select2-container--admin-autocomplete .select2-selection--multiple { .select2-container--admin-autocomplete .select2-selection--multiple {
background-color: white; background-color: var(--body-bg);
border: 1px solid var(--border-color); border: 1px solid var(--border-color);
border-radius: 4px; border-radius: 4px;
cursor: text; cursor: text;
@ -130,7 +130,7 @@ select.admin-autocomplete {
} }
.select2-container--admin-autocomplete .select2-selection--multiple .select2-selection__choice { .select2-container--admin-autocomplete .select2-selection--multiple .select2-selection__choice {
background-color: #e4e4e4; background-color: var(--darkened-bg);
border: 1px solid var(--border-color); border: 1px solid var(--border-color);
border-radius: 4px; border-radius: 4px;
cursor: default; cursor: default;
@ -172,7 +172,7 @@ select.admin-autocomplete {
} }
.select2-container--admin-autocomplete.select2-container--disabled .select2-selection--multiple { .select2-container--admin-autocomplete.select2-container--disabled .select2-selection--multiple {
background-color: #eee; background-color: var(--darkened-bg);
cursor: default; cursor: default;
} }
@ -190,12 +190,20 @@ select.admin-autocomplete {
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.select2-container--admin-autocomplete .select2-search--dropdown {
background: var(--darkened-bg);
}
.select2-container--admin-autocomplete .select2-search--dropdown .select2-search__field { .select2-container--admin-autocomplete .select2-search--dropdown .select2-search__field {
background: var(--body-bg);
color: var(--body-fg);
border: 1px solid var(--border-color); border: 1px solid var(--border-color);
border-radius: 4px;
} }
.select2-container--admin-autocomplete .select2-search--inline .select2-search__field { .select2-container--admin-autocomplete .select2-search--inline .select2-search__field {
background: transparent; background: transparent;
color: var(--body-fg);
border: none; border: none;
outline: 0; outline: 0;
box-shadow: none; box-shadow: none;
@ -257,7 +265,7 @@ select.admin-autocomplete {
.select2-container--admin-autocomplete .select2-results__option--highlighted[aria-selected] { .select2-container--admin-autocomplete .select2-results__option--highlighted[aria-selected] {
background-color: var(--primary); background-color: var(--primary);
color: var(--body-bg); color: var(--primary-fg);
} }
.select2-container--admin-autocomplete .select2-results__group { .select2-container--admin-autocomplete .select2-results__group {

View File

@ -9,6 +9,7 @@
--primary: #79aec8; --primary: #79aec8;
--secondary: #417690; --secondary: #417690;
--accent: #f5dd5d; --accent: #f5dd5d;
--primary-fg: #fff;
--body-fg: #333; --body-fg: #333;
--body-bg: #fff; --body-bg: #fff;
@ -18,7 +19,7 @@
--header-color: #ffc; --header-color: #ffc;
--header-branding-color: var(--accent); --header-branding-color: var(--accent);
--header-bg: var(--secondary); --header-bg: var(--secondary);
--header-link-color: #fff; --header-link-color: var(--primary-fg);
--breadcrumbs-fg: #c4dce8; --breadcrumbs-fg: #c4dce8;
--breadcrumbs-link-fg: var(--body-bg); --breadcrumbs-link-fg: var(--body-bg);
@ -59,14 +60,13 @@
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:root { :root {
--primary: #264b5d; --primary: #264b5d;
--primary-fg: #eee;
--body-fg: #eeeeee; --body-fg: #eeeeee;
--body-bg: #121212; --body-bg: #121212;
--body-quiet-color: #e0e0e0; --body-quiet-color: #e0e0e0;
--body-loud-color: #ffffff; --body-loud-color: #ffffff;
--header-link-color: #eeeeee;
--breadcrumbs-link-fg: #e0e0e0; --breadcrumbs-link-fg: #e0e0e0;
--breadcrumbs-bg: var(--primary); --breadcrumbs-bg: var(--primary);