Add input focus blur variable

twbs · Feb 11, 2021 · 2f03e32 · 2f03e32
1 parent df79aad
commit 2f03e32
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 2 deletions.
diff --git a/scss/_variables.scss b/scss/_variables.scss
@@ -592,7 +592,8 @@ $input-btn-line-height:       $line-height-base !default;
 $input-btn-focus-width:         .25rem !default;
 $input-btn-focus-color-opacity: .25 !default;
 $input-btn-focus-color:         rgba($component-active-bg, $input-btn-focus-color-opacity) !default;
-$input-btn-focus-box-shadow:    0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
+$input-btn-focus-blur:          0 !default;
+$input-btn-focus-box-shadow:    0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default;
 
 $input-btn-padding-y-sm:      .25rem !default;
 $input-btn-padding-x-sm:      .5rem !default;

diff --git a/scss/mixins/_forms.scss b/scss/mixins/_forms.scss
@@ -21,7 +21,7 @@
   $icon,
   $tooltip-color: color-contrast($color),
   $tooltip-bg-color: rgba($color, $form-feedback-tooltip-opacity),
-  $focus-box-shadow: 0 0 0 $input-focus-width rgba($color, $input-btn-focus-color-opacity)
+  $focus-box-shadow: 0 0 $input-btn-focus-blur $input-focus-width rgba($color, $input-btn-focus-color-opacity)
 ) {
   .#{$state}-feedback {
     display: none;