Add .BtnGroup-parent

primer · Jul 2, 2018 · 4fe1a4c · 4fe1a4c
1 parent c8cab2f
commit 4fe1a4c
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/modules/primer-buttons/README.md b/modules/primer-buttons/README.md
@@ -223,12 +223,12 @@ Have a hankering for a series of buttons that are attached to one another? Wrap
 </div>
 ```
 
-Add `.BtnGroup-form` to `<form>`s within `.BtnGroup`s for proper spacing and rounded corners.
+Add `.BtnGroup-parent` to parent elements, like `<form>`s or `<details>`s, within `.BtnGroup`s for proper spacing and rounded corners.
 
 ```html
 <div class="BtnGroup">
   <button class="btn BtnGroup-item" type="button">Button</button>
-  <form class="BtnGroup-form">
+  <form class="BtnGroup-parent">
     <button class="btn BtnGroup-item" type="button">Button in a form</button>
   </form>
   <button class="btn BtnGroup-item" type="button">Button</button>

diff --git a/modules/primer-buttons/lib/button-group.scss b/modules/primer-buttons/lib/button-group.scss
@@ -38,12 +38,14 @@
     border-right-width: 1px;
 
     + .BtnGroup-item,
+    + .BtnGroup-parent .BtnGroup-item,
     + .BtnGroup-form .BtnGroup-item {
       border-left-width: 0;
     }
   }
 }
 
+.BtnGroup-parent,
 .BtnGroup-form {
   float: left;
 
@@ -72,6 +74,7 @@
     }
 
     + .BtnGroup-item,
+    + .BtnGroup-parent .BtnGroup-item,
     + .BtnGroup-form .BtnGroup-item {
       border-left-width: 0;
     }