From e63d0e939ef443859d9fa7ee6ea82ab839b9af2a Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Wed, 13 Apr 2022 20:43:37 -0700 Subject: [PATCH] Manually set hover and active backgrounds and borders for dark and light buttons --- scss/_buttons.scss | 22 +++++++++++++++++++++- 1 file changed, 21 insertions(+), 1 deletion(-) diff --git a/scss/_buttons.scss b/scss/_buttons.scss index a0d7a071e71b..6c2482275b14 100644 --- a/scss/_buttons.scss +++ b/scss/_buttons.scss @@ -103,7 +103,27 @@ // scss-docs-start btn-variant-loops @each $color, $value in $theme-colors { .btn-#{$color} { - @include button-variant($value, $value); + @if $color == "light" { + @include button-variant( + $value, + $value, + $hover-background: shade-color($value, $btn-hover-bg-shade-amount), + $hover-border: shade-color($value, $btn-hover-border-shade-amount), + $active-background: shade-color($value, $btn-active-bg-shade-amount), + $active-border: shade-color($value, $btn-active-border-shade-amount) + ); + } @else if $color == "dark" { + @include button-variant( + $value, + $value, + $hover-background: tint-color($value, $btn-hover-bg-tint-amount), + $hover-border: tint-color($value, $btn-hover-border-tint-amount), + $active-background: tint-color($value, $btn-active-bg-tint-amount), + $active-border: tint-color($value, $btn-active-border-tint-amount) + ); + } @else { + @include button-variant($value, $value); + } } }