diff --git a/scss/modules/header/_search.scss b/scss/modules/header/_search.scss index 3cdca61b..f3b92052 100644 --- a/scss/modules/header/_search.scss +++ b/scss/modules/header/_search.scss @@ -23,11 +23,17 @@ } .channel_header { - #header_search_form { - &:hover .search_input { + #search_container { + .search_form:hover .search_input { border: 1px solid $color-shade-light; } + .search_form .search_clear_icon .ts_icon_times_circle { + color: $color-highlight; + } + } + + #header_search_form { #search_spinner { color: $base-font-color; } @@ -37,10 +43,6 @@ z-index: 2; } } - - #search_container .search_form .search_clear_icon .ts_icon_times_circle { - color: $color-highlight; - } } } diff --git a/scss/modules/menu/_autocomplete.scss b/scss/modules/menu/_autocomplete.scss index b97c98db..3c6ffe87 100644 --- a/scss/modules/menu/_autocomplete.scss +++ b/scss/modules/menu/_autocomplete.scss @@ -146,6 +146,31 @@ background-color: $color-shade-darkest; } + footer, + header { + background-color: $color-shade-darkest; + + .keyword::before, + .modifier::before { + background: $color-shade-lightest; + border: 1px solid $color-shade-light; + color: $base-font-color; + } + + .selected { + .keyword::before, + .modifier::before { + background: rgba($color-shade-light, 0.25); + border: $color-shade-lightest; + } + } + + .modifier.incomplete::before { + background: $color-shade-dark; + border: 1px solid $color-shade-darkest; + } + } + ol { li { &.selected {