Better contrast ratio match between dark and light themes

This commit is contained in:
Kris 2019-01-02 17:54:22 -05:00
parent 49fbedc445
commit 4af7471ead
4 changed files with 10 additions and 10 deletions

View File

@ -20,7 +20,7 @@ sup img.emoji {
height: 300px;
color: dark-light-choose(darken($primary, 40%), blend-primary-secondary(90%));
background-color: $secondary;
border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
border: 1px solid $primary-low;
}
.emoji-picker .categories-column {
@ -29,7 +29,7 @@ sup img.emoji {
flex: 1 0 0;
align-items: center;
justify-content: space-between;
border-right: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
border-right: 1px solid $primary-low;
min-width: 36px;
}
@ -102,7 +102,7 @@ sup img.emoji {
align-items: center;
display: flex;
justify-content: space-between;
border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
border-top: 1px solid $primary-low;
}
.emoji-picker .info {
@ -202,7 +202,7 @@ sup img.emoji {
.emoji-picker .filter {
background-color: none;
border-bottom: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
border-bottom: 1px solid $primary-low;
padding: 5px;
display: flex;
position: relative;

View File

@ -195,14 +195,14 @@ $box-shadow: (
// standard color transformations, use these if possible, and add any new dark-light-diffs here
//primary
$primary-very-low: dark-light-diff($primary, $secondary, 97%, -80%);
$primary-low: dark-light-diff($primary, $secondary, 90%, -65%);
$primary-very-low: dark-light-diff($primary, $secondary, 97%, -82%);
$primary-low: dark-light-diff($primary, $secondary, 90%, -78%);
$primary-low-mid: dark-light-diff($primary, $secondary, 70%, -45%);
$primary-medium: dark-light-diff($primary, $secondary, 50%, -35%);
$primary-high: dark-light-diff($primary, $secondary, 30%, -25%);
//header_primary
$header_primary-low: dark-light-diff($header_primary, $secondary, 90%, -65%);
$header_primary-low: dark-light-diff($header_primary, $secondary, 90%, -78%);
$header_primary-medium: dark-light-diff($header_primary, $secondary, 50%, -35%);
$header_primary-high: dark-light-diff(
$header_primary,

View File

@ -19,8 +19,8 @@
.select-kit-filter {
padding: $input-padding;
border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
border-bottom: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
border-top: 1px solid $primary-low;
border-bottom: 1px solid $primary-low;
.spinner {
flex: 0 0 auto;

View File

@ -14,7 +14,7 @@
}
.select-kit-body {
border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
border: 1px solid $primary-low;
background-clip: padding-box;
box-shadow: shadow("dropdown");
max-width: 300px;