Extract $btn-active-box-shadow variable & refactor accordingly

[skip sauce]
[skip validator]

diff --git a/scss/_button-group.scss b/scss/_button-group.scss
index e0c6c9af4003827b63c8d4715b2a3c087b53cb28..4c47725bd71c066e77bddb307b2e43c76e4663fd 100644 (file)
--- a/scss/_button-group.scss
+++ b/scss/_button-group.scss
@@ -115,7 +115,7 @@
 // The clickable button for toggling the menu
 // Remove the gradient and set the same inset shadow as the :active state
 .btn-group.open .dropdown-toggle {
-  @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
+  @include box-shadow($btn-active-box-shadow);
 
   // Show no shadow for `.btn-link` since it has no other button styles.
   &.btn-link {

diff --git a/scss/_buttons.scss b/scss/_buttons.scss
index 9696154f72589e17b7476ceccdc06214bff12700..640fe1dfeb2dbed1280e8ae61fb9480de955c562 100644 (file)
--- a/scss/_buttons.scss
+++ b/scss/_buttons.scss
@@ -34,7 +34,7 @@
   &.active {
     background-image: none;
     outline: 0;
-    @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
+    @include box-shadow($btn-active-box-shadow);
   }
 
   &.disabled,

diff --git a/scss/_variables.scss b/scss/_variables.scss
index b85ab50b19001cac5dc613ce72bffdbeec944ccf..cb478d76a15ec031f51a76d9c8d8fa19beadc27d 100644 (file)
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -237,6 +237,7 @@ $table-border-color:            $gray-lighter !default;
 $btn-padding-x:                  1rem !default;
 $btn-padding-y:                  .375rem !default;
 $btn-font-weight:                normal !default;
+$btn-active-box-shadow:          inset 0 3px 5px rgba(0,0,0,.125) !default;
 
 $btn-primary-color:              #fff !default;
 $btn-primary-bg:                 $brand-primary !default;

diff --git a/scss/mixins/_buttons.scss b/scss/mixins/_buttons.scss
index 61b9f9caff0f77400f3e115866c01baa433c5827..ec250c464c84238e67f407f9e1b11ca583e66b2b 100644 (file)
--- a/scss/mixins/_buttons.scss
+++ b/scss/mixins/_buttons.scss
@@ -33,7 +33,7 @@
         border-color: $active-border;
     // Remove the gradient for the pressed/active state
     background-image: none;
-    @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
+    @include box-shadow($btn-active-box-shadow);
 
     &:hover,
     &:focus,