commit ba19ffdfd442c7ebe66f482b90f6bc65a0e9b8be
author Laurence Maultsby <laurence.maultsby@riftio.com> Tue Mar 07 13:59:18 2017 -0500
committer Laurence Maultsby <laurence.maultsby@riftio.com> Tue Mar 07 13:59:18 2017 -0500
tree a2cf2c5b9c17194b431721b6a71e8adb3946abcd
parent 625a4c2118c4d095daf2a264643798eddf4d0491

User Management: Create and delete. Initial pass.

Signed-off-by: Laurence Maultsby <laurence.maultsby@riftio.com>

skyquake/framework/widgets/button/button.scss

diff --git a/skyquake/framework/widgets/button/button.scss b/skyquake/framework/widgets/button/button.scss
index c972e14..e4eb7a4 100644
--- a/skyquake/framework/widgets/button/button.scss
+++ b/skyquake/framework/widgets/button/button.scss
@@ -1,6 +1,6 @@
 
 /*
- * 
+ *
  *   Copyright 2016 RIFT.IO Inc
  *
  *   Licensed under the Apache License, Version 2.0 (the "License");
@@ -62,15 +62,18 @@
 ############################################################################ */
 
 .SqButton {
-  align-items: center;
+  -ms-flex-align: center;
+      align-items: center;
   border-style: solid;
   border-radius: 3px;
   border-width: 0px;
   cursor: pointer;
+  display: -ms-inline-flexbox;
   display: inline-flex;
   font-size: 1rem;
   height: 50px;
-  justify-content: center;
+  -ms-flex-pack: center;
+      justify-content: center;
   margin: 0 10px;
   outline: none;
   padding: 0 15px;
@@ -107,7 +110,7 @@
 
   /* Focus */
   &:focus {
-    // box-shadow: $focus-shadow;
+    /* box-shadow: $focus-shadow;*/
     border: 1px solid red;
   }
 
@@ -256,11 +259,14 @@
       fill: $primaryForeground;
     }
   }
-
-
 }
 
-
+.sqButtonGroup {
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-pack: center;
+      justify-content: center;
+}
 
 
 

skyquake/framework/widgets/button/sq-button.jsx

diff --git a/skyquake/framework/widgets/button/sq-button.jsx b/skyquake/framework/widgets/button/sq-button.jsx
index ae93128..8d0ec77 100644
--- a/skyquake/framework/widgets/button/sq-button.jsx
+++ b/skyquake/framework/widgets/button/sq-button.jsx
@@ -36,17 +36,35 @@
             Class += " is-disabled";
         }
         return (
-                <div style={{display: 'flex'}}>
+        <div style={{display: 'flex'}} onClick={this.props.onClick}>
             <div className={Class} tabIndex="0">
-            {svgHTML}
-              <div className="SqButton-content">{label}</div>
+                {svgHTML}
+                <div className="SqButton-content">{label}</div>
             </div>
+        </div>
+        )
+    }
+}
+
+export class ButtonGroup extends React.Component {
+    render() {
+        let className = "sqButtonGroup";
+        if (this.props.className) {
+            className = `${className} ${this.props.className}`
+        }
+        return (
+            <div className={className} style={this.props.style}>
+                {this.props.children}
             </div>
         )
     }
 }
 
+
 SqButton.defaultProps = {
+    onClick: function(e) {
+        console.log('Clicked')
+    },
     icon: false,
     primary: false,
     disabled: false,