Add clearer selected state

This commit is contained in:
Justin Edmund 2023-01-27 11:40:39 -08:00
parent c5c08b6a78
commit f85874d962
3 changed files with 16 additions and 1 deletions

View file

@ -10,7 +10,11 @@
width: 100%;
&[data-state='checked'] {
background: var(--input-bg-hover);
background: var(--selected-item-bg);
&:hover {
background: var(--selected-item-bg-hover);
}
h4 {
color: var(--button-text-hover);

View file

@ -16,6 +16,9 @@
--accent-blue: #{$accent--blue--light};
--accent-yellow: #{$accent--yellow--light};
--selected-item-bg: #{$selected--item--bg--light};
--selected-item-bg-hover: #{$selected--item--bg--light--hover};
// Light - Menus
--dialog-bg: #{$dialog--bg--light};
@ -143,6 +146,9 @@
--accent-blue: #{$accent--blue--dark};
--accent-yellow: #{$accent--yellow--dark};
--selected-item-bg: #{$selected--item--bg--dark};
--selected-item-bg-hover: #{$selected--item--bg--dark--hover};
// Dark - Dialogs
--dialog-bg: #{$dialog--bg--dark};

View file

@ -83,6 +83,11 @@ $accent--blue--dark: #6195f4;
$accent--yellow--light: #c89d39;
$accent--yellow--dark: #f9cc64;
$selected--item--bg--dark: #f9cc645d;
$selected--item--bg--dark--hover: #fcc33f81;
$selected--item--bg--light: #f9cc645d;
$selected--item--bg--light--hover: #ecbc4c6f;
// Colors -- Elements
$wind-text-00: #023e28;
$wind-text-10: #006a43;