diff --git a/src-ui/src/styles.scss b/src-ui/src/styles.scss index 5dcf2bf9e..967b416ad 100644 --- a/src-ui/src/styles.scss +++ b/src-ui/src/styles.scss @@ -262,13 +262,14 @@ a.btn-link:focus-visible, } .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked { - background-color: var(--pngx-bg-alt) !important; + background-color: var(--pngx-bg-darker) !important; color: var(--pngx-body-color-accent) !important; } .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected, .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked { - background: none; + font-weight: bold; + background-color: var(--pngx-bg-alt2) !important; } } diff --git a/src-ui/src/theme.scss b/src-ui/src/theme.scss index 3596f002a..806966ec7 100644 --- a/src-ui/src/theme.scss +++ b/src-ui/src/theme.scss @@ -24,6 +24,7 @@ $color-mode-type: data; --pngx-success-darken-10: hsl(152, 69%, 11%); // based on success #198754 --pngx-bg-alt: #fff; --pngx-bg-darker: var(--bs-gray-100); + --pngx-bg-alt2: var(--bs-gray-200); --pngx-focus-alpha: 0.3; } @@ -78,6 +79,7 @@ $form-check-radio-checked-bg-image-dark: url("data:image/svg+xml,<svg xmlns='htt --bs-light: #1c1c1f; --bs-light-rgb: 28, 28, 31; --bs-border-color: #47494f; + --pngx-bg-alt2: #232323; --pngx-bg-darker: #101216; --bs-tertiary-bg: var(--pngx-bg-darker); --pngx-bg-alt: #242529; @@ -195,9 +197,9 @@ $form-check-radio-checked-bg-image-dark: url("data:image/svg+xml,<svg xmlns='htt mix-blend-mode: luminosity; } - .ng-dropdown-panel .ng-dropdown-panel-items .ng-option:hover, - .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked { - background-color: var(--bs-light); + .paperless-input-select .ng-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option:not(.ng-option-selected):hover, + .paperless-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked { + background-color: var(--bs-light) !important; } .ng-select-multiple .ng-select-container .ng-value-container .ng-value {