diff --git a/scss/_button-group.scss b/scss/_button-group.scss index 7efe144f97..e0c6c9af40 100644 --- a/scss/_button-group.scss +++ b/scss/_button-group.scss @@ -33,7 +33,7 @@ // Optional: Group multiple button groups together for a toolbar .btn-toolbar { - margin-left: -5px; // Offset the first child's margin + margin-left: -$btn-toolbar-margin; // Offset the first child's margin @include clearfix(); .btn-group, @@ -44,7 +44,7 @@ > .btn, > .btn-group, > .input-group { - margin-left: 5px; + margin-left: $btn-toolbar-margin; } } @@ -104,12 +104,12 @@ // Give the line between buttons some depth .btn-group > .btn + .dropdown-toggle { - padding-right: 8px; - padding-left: 8px; + padding-right: $split-btn-dropdown-toggle-padding-x; + padding-left: $split-btn-dropdown-toggle-padding-x; } .btn-group > .btn-lg + .dropdown-toggle { - padding-right: 12px; - padding-left: 12px; + padding-right: $split-btn-lg-dropdown-toggle-padding-x; + padding-left: $split-btn-lg-dropdown-toggle-padding-x; } // The clickable button for toggling the menu diff --git a/scss/_variables.scss b/scss/_variables.scss index 5c1d07c363..9486dcbb21 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -276,6 +276,10 @@ $btn-padding-x-lg: 1.25rem !default; $btn-padding-y-lg: .75rem !default; $btn-block-spacing-y: 5px !default; +$btn-toolbar-margin: 5px !default; + +$split-btn-dropdown-toggle-padding-x: 8px !default; +$split-btn-lg-dropdown-toggle-padding-x: 12px !default; // Allows for customizing button radius independently from global border radius $btn-border-radius: $border-radius !default;