From d4e401be82aa2a4573f3ca04ab09acea49fa3468 Mon Sep 17 00:00:00 2001
From: Tilo Mitra <tilomitra@gmail.com>
Date: Tue, 23 Jul 2013 11:27:11 -0400
Subject: [PATCH 1/2] add button groups

---
 src/buttons/css/buttons-core.css | 20 ++++++++++++++++++++
 src/buttons/css/buttons.css      | 19 +++++++++++++++++++
 2 files changed, 39 insertions(+)

diff --git a/src/buttons/css/buttons-core.css b/src/buttons/css/buttons-core.css
index 3b81183..2b2118b 100644
--- a/src/buttons/css/buttons-core.css
+++ b/src/buttons/css/buttons-core.css
@@ -17,3 +17,23 @@
     padding: 0;
     border: 0;
 }
+
+/* Inherit .pure-g styles */
+.pure-button-group {
+    letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
+    *letter-spacing: normal; /* reset IE < 8 */
+    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
+    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */
+}
+
+.opera-only :-o-prefocus,
+.pure-button-group {
+    word-spacing: -0.43em;
+}
+
+.pure-button-group .pure-button {
+    letter-spacing: normal;
+    word-spacing: normal;
+    vertical-align: top;
+    text-rendering: auto;
+}
diff --git a/src/buttons/css/buttons.css b/src/buttons/css/buttons.css
index 430294a..97cba2b 100644
--- a/src/buttons/css/buttons.css
+++ b/src/buttons/css/buttons.css
@@ -57,3 +57,22 @@ a.pure-button-selected {
     background-color: rgb(0, 120, 231);
     color: #fff;
 }
+
+/* Button Groups */
+.pure-button-group .pure-button {
+    margin: 0;
+    border-radius: 0;
+    border-right: 1px solid #111;  /* fallback color for rgba() for IE7/8 */
+    border-right: 1px solid rgba(0, 0, 0, 0.2);
+
+}
+
+.pure-button-group .pure-button:first-child {
+    border-top-left-radius: 2px;
+    border-bottom-left-radius: 2px;
+}
+.pure-button-group .pure-button:last-child {
+    border-top-right-radius: 2px;
+    border-bottom-right-radius: 2px;
+    border-right: none;
+}

From 7641b87740dc8cc0ac9b5499c81d7e10fa7d30b3 Mon Sep 17 00:00:00 2001
From: Tilo Mitra <tilomitra@gmail.com>
Date: Tue, 23 Jul 2013 11:27:22 -0400
Subject: [PATCH 2/2] add button groups to manual test page

---
 src/buttons/tests/manual/button.html | 54 ++++++++++++++++++++++++++--
 1 file changed, 52 insertions(+), 2 deletions(-)

diff --git a/src/buttons/tests/manual/button.html b/src/buttons/tests/manual/button.html
index 280b809..abe3ebd 100644
--- a/src/buttons/tests/manual/button.html
+++ b/src/buttons/tests/manual/button.html
@@ -48,7 +48,7 @@
             color: #fff;
             box-shadow: none;
         }
-        
+
         .custom-fonts {
             font-family: 'Open Sans', sans-serif;
         }
@@ -124,6 +124,56 @@
         <input type="submit" class="pure-button pure-button-primary" value="Submit">
         <input type="button" class="pure-button pure-button-primary" value="Input Button">
         <input type="reset" class="pure-button pure-button-primary" value="Reset">
-    </p>    
+    </p>
+
+    <h2>Button Groups</h2>
+    <p>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+        consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+        cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+        proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+    </p>
+    <div class="pure-button-group">
+        <input type="submit" class="pure-button pure-button-primary" value="Submit">
+        <input type="button" class="pure-button pure-button-primary" value="Input Button">
+        <input type="reset" class="pure-button pure-button-primary" value="Reset">
+    </div>
+    <p>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+        consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+        cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+        proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+    </p>
+    <div class="pure-button-group">
+        <a href="#" class="pure-button pure-button-primary" value="Submit">Testing</a>
+        <a href="#" class="pure-button pure-button-primary" value="Input Button">Button</a>
+        <a href="#" class="pure-button pure-button-primary pure-button-active" value="Reset">Groups</a>
+    </div>
+    <p>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+        consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+        cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+        proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+    </p>
+    <div class="pure-button-group">
+        <button class="pure-button">Lorem</button>
+        <button class="pure-button pure-button-active">Ipsum</button>
+        <button class="pure-button">Dolor</button>
+    </div>
+    <p>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+        consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+        cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+        proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+    </p>
+
 </body>
 </html>