Better search suggestion styles

Lighter style and fifferentiate between hover and focus
This commit is contained in:
Lim Chee Aun 2024-01-06 01:04:14 +08:00
parent e43f2283dd
commit 9a5d749b8d

View file

@ -115,22 +115,25 @@ ul.link-list.hashtag-list li a {
display: none; display: none;
} }
.search-popover-item:is(:hover, :focus, .focus) { .search-popover-item:is(:hover, :focus, .focus) {
background-color: var(--button-bg-color); background-color: var(--link-bg-color);
color: var(--button-text-color); color: var(--text-color);
}
.search-popover-item:is(:focus, .focus) {
box-shadow: inset 4px 0 0 0 var(--button-bg-color);
} }
.search-popover-item :is(mark, q) { .search-popover-item :is(mark, q) {
background-color: var(--bg-faded-blur-color); color: var(--text-color);
color: inherit; background-color: var(--link-bg-color);
} }
.search-popover-item:is(:hover, :focus, .focus) :is(mark, q) { .search-popover-item:is(:hover, :focus, .focus) :is(mark, q) {
background-color: var(--button-bg-color); background-color: var(--link-bg-color);
} }
.search-popover:hover .search-popover-item.focus:not(:hover, :focus), .search-popover:hover .search-popover-item.focus:not(:hover, :focus),
.search-popover:hover .search-popover:hover
.search-popover-item.focus:not(:hover, :focus) .search-popover-item.focus:not(:hover, :focus)
:is(mark, q) { :is(mark, q) {
background-color: unset; /* background-color: unset; */
color: unset; /* color: unset; */
} }
.search-popover-item > span { .search-popover-item > span {
min-width: 0; min-width: 0;