[FIX] web: support dark mode in field selector popover

Switch to using scss variables instead of hardcoded colors to support dark mode
in field selector popover.

Steps to reproduce:
Turn on Dark mode. Open Automated actions and add a model. Edit domain and
start typing: text is white on white, the popover does not adapt to dark mode.

opw-3453065

closes odoo/odoo#134458

X-original-commit: 5a57bd799688ee7a2c2e29d775fda73bba34c777
Signed-off-by: Tom De Caluwé (tdc) <tdc@odoo.com>
Signed-off-by: Romeo Fragomeli (rfr) <rfr@odoo.com>
This commit is contained in:
Tom De Caluwé
2023-09-07 09:00:25 +00:00
parent b6ea693753
commit 70a4051646
@@ -9,18 +9,18 @@
.o_model_field_selector_popover {
width: 265px;
background: white;
--o-input-background-color: white;
background-color: $dropdown-bg;
--o-input-background-color: #{$dropdown-bg};
&:focus {
outline: none;
}
.o_model_field_selector_popover_header {
color: white;
.o_model_field_selector_popover_header, .o_model_field_selector_popover_footer {
color: color-contrast(map-get($theme-colors, 'primary'));
background: map-get($theme-colors, 'primary');
font-weight: bold;
padding: 5px 0 5px 0.4em;
padding: 5px 0.4em;
.o_model_field_selector_popover_title {
width: 100%;
@@ -28,14 +28,11 @@
padding: 0px 35px;
text-align: center;
}
.o_model_field_selector_popover_search {
padding-right: 0.4rem;
> .o_input {
font-size: 13px;
padding: 5px 0.4rem;
text-align: left;
line-height: normal;
}
.o_model_field_selector_popover_search > .o_input, > input {
color: $o-main-text-color;
font-size: 115%;
border: none;
padding: 5px 0.4rem;
}
.o_model_field_selector_popover_option {
@include o-position-absolute($top: 0);
@@ -65,28 +62,18 @@
cursor: pointer;
font-family: Arial;
font-size: 13px;
color: #444;
border-bottom: 1px solid #eee;
border-bottom: 1px solid mix($o-black, $dropdown-link-hover-bg, 8%);
&.active {
background: #f5f5f5;
background: $dropdown-link-hover-bg;
}
.o_model_field_selector_popover_item_title {
font-size: 12px;
}
.o_model_field_selector_popover_item_relation {
border-left: 1px solid #eee;
border-radius: 0px;
border-left: 1px solid mix($o-black, $dropdown-link-hover-bg, 8%);
}
}
}
}
.o_model_field_selector_popover_footer {
background: map-get($theme-colors, 'primary');
padding: 5px 0.4em;
> input {
font-size: 13px;
width: 100%;
padding: 0 0.4rem;
}
}
}