Fix button group helper class not working per issue #171

mobi · Oct 14, 2019 · a4c53ca · a4c53ca
1 parent 098f3b4
commit a4c53ca
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/projects/go-lib/src/lib/components/go-button/go-button.component.scss b/projects/go-lib/src/lib/components/go-button/go-button.component.scss
@@ -181,14 +181,14 @@ $button__background--loading: rgba($theme-light-border, .4);
   }
 }
 
-.go-button-group {
+::ng-deep .go-button-group {
   display: inline-flex;
   justify-content: flex-start;
   list-style: none;
   margin: 0;
 }
 
-.go-button-group__item {
+::ng-deep .go-button-group__item {
   margin-right: 0.5rem;
 
   &:last-child {

diff --git a/projects/go-tester/src/app/components/test-page-2/test-page-2.component.html b/projects/go-tester/src/app/components/test-page-2/test-page-2.component.html
@@ -83,6 +83,18 @@ <h4 class="go-heading-4">Buttons</h4>
     </go-button>
   </div>
 
+  <div class="go-column go-column--100">
+    <h4 class="go-heading-4">Button Group</h4>
+    <ul class="go-button-group">
+      <li class="go-button-group__item">
+        <go-button>Button 1</go-button>
+      </li>
+      <li class="go-button-group__item">
+        <go-button>Button 2</go-button>
+      </li>
+    </ul>
+  </div>
+
   <div class="go-column go-column--100">
     <h4 class="go-heading-4">Toasts</h4>
     <go-toast type="neutral"