From acc114711ca890c46ad9a594049b17d94464af4e Mon Sep 17 00:00:00 2001
From: Jon Rohan <yes@jonrohan.codes>
Date: Mon, 19 Nov 2018 13:34:53 -0800
Subject: [PATCH] Reverting primer-buttons flex group

---
 modules/primer-buttons/lib/button-group.scss | 35 +++++++++++---------
 1 file changed, 19 insertions(+), 16 deletions(-)

diff --git a/modules/primer-buttons/lib/button-group.scss b/modules/primer-buttons/lib/button-group.scss
index 048e813b..82e96f6f 100644
--- a/modules/primer-buttons/lib/button-group.scss
+++ b/modules/primer-buttons/lib/button-group.scss
@@ -5,38 +5,39 @@
 @warn ".BtnGroup-form will be deprecated in version 11. Use .BtnGroup-parent instead.";
 
 .BtnGroup {
-  display: inline-flex;
-  align-items: middle;
+  display: inline-block;
+  vertical-align: middle;
+  @include clearfix();
 
   // Proper spacing for multiple button groups (a la, gollum editor)
   + .BtnGroup,
   + .btn {
-    margin-left: $spacer-2;
+    margin-left: 5px;
   }
 }
 
 .BtnGroup-item {
   position: relative;
+  float: left;
   border-right-width: 0;
   border-radius: 0;
 
   &:first-child {
-    border-top-left-radius: $border-radius;
-    border-bottom-left-radius: $border-radius;
+    border-top-left-radius: 3px;
+    border-bottom-left-radius: 3px;
   }
 
   &:last-child {
-    border-right-width: $border-width;
-    border-top-right-radius: $border-radius;
-    border-bottom-right-radius: $border-radius;
+    border-right-width: 1px;
+    border-top-right-radius: 3px;
+    border-bottom-right-radius: 3px;
   }
 
   &.selected,
   &:focus,
   &:active,
   &:hover {
-    z-index: 1;
-    border-right-width: $border-width;
+    border-right-width: 1px;
 
     + .BtnGroup-item,
     + .BtnGroup-parent .BtnGroup-item,
@@ -48,15 +49,17 @@
 
 .BtnGroup-parent,
 .BtnGroup-form {
+  float: left;
+
   &:first-child .BtnGroup-item {
-    border-top-left-radius: $border-radius;
-    border-bottom-left-radius: $border-radius;
+    border-top-left-radius: 3px;
+    border-bottom-left-radius: 3px;
   }
 
   &:last-child .BtnGroup-item {
-    border-right-width: $border-width;
-    border-top-right-radius: $border-radius;
-    border-bottom-right-radius: $border-radius;
+    border-right-width: 1px;
+    border-top-right-radius: 3px;
+    border-bottom-right-radius: 3px;
   }
 
   .BtnGroup-item {
@@ -69,7 +72,7 @@
   &:active,
   &:hover {
     .BtnGroup-item {
-      border-right-width: $border-width;
+      border-right-width: 1px;
     }
 
     + .BtnGroup-item,