Better contrast ratio for modal close button and tabs

This commit is contained in:
Josh Perez 2023-05-03 09:09:55 -04:00
parent a6aec37b75
commit 7c651e8773
2 changed files with 25 additions and 34 deletions

View file

@ -66,22 +66,17 @@
}
}
@include light-theme {
&:hover,
&:focus {
background: $color-gray-02;
}
&:active {
background: $color-gray-05;
&:hover,
&:focus {
background: $color-gray-45;
&::before {
background-color: $color-ultramarine;
}
}
@include dark-theme {
&:hover,
&:focus {
background: $color-gray-80;
}
&:active {
background: $color-gray-75;
&:active {
background: $color-gray-45;
&::before {
background-color: $color-ultramarine;
}
}
}
@ -108,23 +103,9 @@
}
}
@include light-theme {
&:hover,
&:focus {
background: $color-gray-02;
}
&:active {
background: $color-gray-05;
}
}
@include dark-theme {
&:hover,
&:focus {
background: $color-gray-80;
}
&:active {
background: $color-gray-75;
}
&:hover,
&:focus {
box-shadow: 0 0 0 2px $color-ultramarine;
}
}

View file

@ -11,16 +11,26 @@
@include font-body-1;
cursor: pointer;
padding: 10px;
padding-bottom: 6px;
border-bottom: 4px solid transparent;
&:focus {
@include mouse-mode {
outline: none;
outline: none;
@include keyboard-mode {
border-bottom-color: $color-ultramarine;
}
}
&--selected {
@include font-body-1-bold;
border-bottom: 2px solid $color-black;
border-bottom: 2px solid;
@include light-theme {
border-bottom-color: $color-black;
}
@include dark-theme {
border-bottom-color: $color-white;
}
}
}
}