[FIX] web, web_editor: fix text muted within a dropdown menu

Steps to reproduce the bug:

- Install the "Blogs" app and go to the "/blog" page.
- Click on "Edit" to enter edit mode.
- Go to the "Theme" tab.
- Select the 4th color from the theme colors and choose "black".
- Save the page to exit edit mode.
- Perform a search in the search bar input that yields no results, for
example: "zzz".
- Bug: The message "No results found. Please try another search." is not
visible because it is displayed in white on the white background of the
dropdown.

A previous commit [1] had already addressed the issue for the "Search"
snippet that can be dropped into a page, but this fix wasn't sufficient
to solve the problem everywhere. Indeed, the text-muted in a dropdown
should be adjusted in all cases and not just for snippets; it's a
Bootstrap issue. The text-muted color should be adapted to the
background color of the dropdown.

[1]: https://github.com/odoo/odoo/commit/f9bf40cb53cf487c8736c1f565c2f0d3834acd5e

task-3662985

closes odoo/odoo#158203

X-original-commit: 46fcb3712f0ba68144b03ed23f52157d4dfc789a
Signed-off-by: Benjamin Vray (bvr) <bvr@odoo.com>
Signed-off-by: Outagant Mehdi (mou) <mou@odoo.com>
This commit is contained in:
Benjamin Vray
2024-03-20 13:52:31 +00:00
parent 361e63b880
commit 618fbc1a54
2 changed files with 7 additions and 4 deletions
@@ -229,3 +229,10 @@ $-color-for-gray-200-bg: adjust-color-to-background($body-color, $gray-200);
@include border-radius($input-border-radius, 0);
}
}
// Dropdown
.dropdown .dropdown-menu {
.text-muted {
color: adjust-color-to-background($text-muted, $dropdown-bg, mute-color($color-contrast-light), mute-color($color-contrast-dark)) !important;
}
}
@@ -595,10 +595,6 @@ blockquote {
}
}
.dropdown-menu .dropdown-item-text .text-muted {
// Search autocomplete messages are shown as text-muted entries.
// These need to be reset in case a dark palette is applied.
color: $text-muted !important;
a {
// Search autocomplete's fuzzy matched term is shown as a link
// within an information message.