From: Aaron Arney <ocularrhythm@users.noreply.github.com>
Date: Wed, 16 Dec 2015 14:34:00 +0000 (-0500)
Subject: Issue #7557 Apply correct styling to hollow button group
X-Git-Tag: v6.1.0~50^2
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=8483f24d97e87f743efd3ad33f618a2a8a75eae3;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Issue #7557 Apply correct styling to hollow button group

Added logic to test for a hollow property within the button-fill variable. If it is present, applies the correct hollow styling to the buttons, even if there is a wrapping color class such as secondary or primary. Also fixes the transparent border being applied to non-stacked and stacked button groups.
---

diff --git a/scss/components/_button-group.scss b/scss/components/_button-group.scss
index 994b992bd..bb9863b35 100644
--- a/scss/components/_button-group.scss
+++ b/scss/components/_button-group.scss
@@ -66,7 +66,10 @@ $buttongroup-expand-max: 6 !default;
 ) {
   #{$selector} {
     width: 100%;
-    border-#{$global-right}: 0;
+
+    &:not(:last-child) {
+      border-#{$global-right}: $buttongroup-spacing solid;
+    }
   }
 }
 
@@ -96,8 +99,16 @@ $buttongroup-expand-max: 6 !default;
 
     // Colors
     @each $name, $color in $foundation-colors {
-      &.#{$name} #{$buttongroup-child-selector} {
-        @include button-style($color, auto, auto);
+      @if $button-fill != hollow {
+        &.#{$name} #{$buttongroup-child-selector} {
+          @include button-style($color, auto, auto);
+        }
+      }
+      @else {
+        &.#{$name} #{$buttongroup-child-selector} {
+          @include button-hollow;
+          @include button-hollow-style($color);
+        }
       }
     }