refactor: move ".no-gap" button-group modifier to its own mixin

diff --git a/scss/components/_button-group.scss b/scss/components/_button-group.scss
index 925be9fee422d33391c3e0656171462025da60f2..1754887ebd77261ec976f4720188218c37862892 100644 (file)
--- a/scss/components/_button-group.scss
+++ b/scss/components/_button-group.scss
@@ -75,14 +75,16 @@ $buttongroup-radius-on-each: true !default;
   }
 }
 
-  // No Gaps
-  &.no-gaps {
-    #{$child-selector} {
-      margin-#{$global-right}: 0;
-      
-      + #{$child-selector} {
-        border-#{$global-left}: 0;
-      }
+/// Make buttons bonded without gap between them. Borders between buttons are merged
+/// @param {String} $selector [$buttongroup-child-selector] - Selector for the buttons inside a button group.
+@mixin button-group-no-gap(
+  $selector: $buttongroup-child-selector
+) {
+  #{$selector} {
+    margin-#{$global-right}: 0;
+
+    + #{$child-selector} {
+      border-#{$global-left}: 0;
     }
   }
 }
@@ -258,6 +260,10 @@ $buttongroup-radius-on-each: true !default;
       }
     }
 
+    &.no-gaps {
+      @include button-group-no-gap;
+    }
+
     &.stacked,
     &.stacked-for-small,
     &.stacked-for-medium {