fixed card bg & color for light & dark mode

tabler · Sep 1, 2022 · df06dca · df06dca
1 parent 0832bd1
commit df06dca
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 5 deletions.
diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss
@@ -382,7 +382,8 @@ $btn-border-radius: $border-radius !default;
 //cards
 $card-title-spacer-y: 1.25rem !default;
 
-$card-bg: $white !default;
+$card-bg: $light !default;
+$card-bg-hover: $white !default;
 $card-color: $dark !default;
 
 $card-border-width: $border-width !default;

diff --git a/src/scss/layout/_dark.scss b/src/scss/layout/_dark.scss
@@ -19,7 +19,9 @@ body:not(.theme-dark) .hide-theme-light {
     --#{$prefix}body-bg-rgb: #{to-rgb($dark-mode-darken)};
 
     --#{$prefix}card-bg: #{$dark-mode-darken};
+    --#{$prefix}card-bg-hover: #{$dark-mode-darken};
     --#{$prefix}card-bg-rgb: #{to-rgb($dark-mode-darken)};
+    --#{$prefix}card-color: #{$dark-mode-text};
 
     --#{$prefix}border-color: #{$dark-mode-border-color};
     --#{$prefix}border-color-light: #{$dark-mode-border-color-light};

diff --git a/src/scss/ui/_buttons.scss b/src/scss/ui/_buttons.scss
@@ -65,8 +65,8 @@
 // Button color variations
 //
 .btn-white {
-  //--#{$prefix}btn-bg: var(--#{$prefix}card-bg);
-  //--#{$prefix}btn-hover-bg: var(--#{$prefix}card-bg);
+  --#{$prefix}btn-bg: var(--#{$prefix}card-bg);
+  --#{$prefix}btn-hover-bg: var(--#{$prefix}card-bg-hover);
 }
 
 @each $color, $value in $theme-colors {

diff --git a/src/scss/ui/_cards.scss b/src/scss/ui/_cards.scss
@@ -1,7 +1,7 @@
 .card {
   --#{$prefix}card-border-radius: var(--#{$prefix}border-radius);
-  --#{$prefix}card-bg: var(--#{$prefix}body-bg);
-  --#{$prefix}card-color: var(--#{$prefix}body-color);
+  --#{$prefix}card-bg: var(--#{$prefix}card-bg);
+  --#{$prefix}card-color: var(--#{$prefix}card-color);
 
   box-shadow: $card-shadow;
   border: $card-border-width solid $card-border-color;