Move some color definitions for autocomplete into dark/light.css

This commit is contained in:
MareStare 2025-03-13 23:19:46 +00:00
parent cae4df68bc
commit 7cf02793e1
3 changed files with 23 additions and 5 deletions

View file

@ -165,5 +165,14 @@
--dnp-warning-hover-color: hsl(from $vote-down-color h s calc(l + 10));
--poll-form-label-background: hsl(from $border-color h s calc(l + 8));
--tag-dropdown-hover-background: hsl(from $meta-color h s calc(l - 4));
--autocomplete-history-color: $block-header-link-text-color
--autocomplete-history-match-color: hsl(from $block-header-link-text-color h s calc(l + 20));
--autocomplete-tag-color: $foreground-color;
--autocomplete-tag-match-color: hsl(from $foreground-color h s calc(l + 20));
--autocomplete-tag-count-color: $foreground-half-color
--autocomplete-match-selected-color: hsl(from $background-color h s calc(l + 10));
}
}

View file

@ -162,5 +162,14 @@
--dnp-warning-hover-color: hsl(from $vote-down-color h s calc(l + 10));
--poll-form-label-background: hsl(from $base-color h calc(s - 16) calc(l + 36));
--tag-dropdown-hover-background: hsl(from $foreground-color h s calc(l - 10));
--autocomplete-history-color: $block-header-link-text-color
--autocomplete-history-match-color: hsl(from $block-header-link-text-color h s calc(l + 20));
--autocomplete-tag-color: $foreground-color;
--autocomplete-tag-match-color: hsl(from $foreground-color h s calc(l + 20));
--autocomplete-tag-count-color: $foreground-half-color
--autocomplete-match-selected-color: hsl(from $background-color h s calc(l + 10));
}
}

View file

@ -68,7 +68,7 @@
}
.autocomplete__item__history {
color: var(--block-header-link-text-color);
color: var(--autocomplete-history-color);
}
.autocomplete__item__history__icon {
@ -84,7 +84,7 @@
font-weight: bold;
/* Use a lighter color to highlight the matched part of the query */
color: lch(from var(--block-header-link-text-color) calc(l + 20) c h);
color: var(--autocomplete-history-match-color);
}
.autocomplete__item__tag__match {
@ -93,11 +93,11 @@
.autocomplete__item__tag__match:not(.autocomplete__item--selected) {
/* Use a lighter color to highlight the matched part of the query */
color: lch(from var(--foreground-color) calc(l + 20) c h);
color: var(--autocomplete-tag-match-color);
}
.autocomplete__item__tag__count {
color: var(--foreground-half-color);
color: var(--autocomplete-tag-count-color);
/*
Reduce the space size between groups of 3 digits in big numbers like "1 000 000".
@ -107,7 +107,7 @@
}
.autocomplete__item:hover:not(.autocomplete__item--selected) {
background: lch(from var(--background-color) calc(l + 10) c h);
background: var(--autocomplete-match-selected-color);
}
.autocomplete__item--selected,