#6372: Fix toast colors in dark mode

This commit is contained in:
checktheroads 2021-05-22 17:17:31 -07:00
parent ee2de33643
commit 0a01629b15
6 changed files with 12 additions and 3 deletions

Binary file not shown.

File diff suppressed because one or more lines are too long

Binary file not shown.

File diff suppressed because one or more lines are too long

View File

@ -65,6 +65,7 @@
// Use proper contrasting color for badge & progress-bar foreground color. // Use proper contrasting color for badge & progress-bar foreground color.
@each $color, $value in $theme-colors { @each $color, $value in $theme-colors {
.badge, .badge,
.toast,
.progress-bar { .progress-bar {
&.bg-#{$color} { &.bg-#{$color} {
color: color-contrast($value); color: color-contrast($value);

View File

@ -1,5 +1,6 @@
// Dark Mode Theme Variables and Overrides. // Dark Mode Theme Variables and Overrides.
@use 'sass:map';
@import './theme-base.scss'; @import './theme-base.scss';
$primary: $blue-300; $primary: $blue-300;
@ -259,9 +260,16 @@ $carousel-dark-control-icon-filter: invert(1) grayscale(100);
// Close // Close
$btn-close-color: $white; $btn-close-color: $white;
$btn-close-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$btn-close-color}'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>");
$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%); $btn-close-white-filter: invert(1) grayscale(100%) brightness(200%);
$btn-close-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$btn-close-color}'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>");
@each $color, $value in $theme-colors {
.bg-#{$color} button.btn-close {
background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{color-contrast($value)}'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>");
}
}
// Code // Code
$code-color: $gray-200; $code-color: $gray-200;
$kbd-color: $white; $kbd-color: $white;