Added first UI changes

scm-ui-components/packages/ui-components/src/HelpIcon.js

@@ -1,14 +1,22 @@
-//@flow
-import React from "react";
-import classNames from "classnames";
-
-type Props = {
-};
-
-class HelpIcon extends React.Component<Props> {
-  render() {
-    return <i className={classNames("fa fa-question has-text-info")} />
-  }
-}
-
-export default HelpIcon;
+//@flow
+import React from "react";
+import injectSheet from "react-jss";
+import classNames from "classnames";
+
+type Props = {
+};
+
+const styles = {
+    textinfo: {
+      color: "#98d8f3 !important" 
+    }
+};
+
+class HelpIcon extends React.Component<Props> {
+  render() {
+    const { classes } = this.props;
+    return <i className={classNames("fa fa-question-circle has-text-info", classes.textinfo)}></i>
+  }
+}
+
+export default injectSheet(styles)(HelpIcon);

scm-ui-components/packages/ui-components/src/buttons/AddButton.js

@@ -1,11 +1,11 @@
-//@flow
-import React from "react";
-import Button, { type ButtonProps } from "./Button";
-
-class AddButton extends React.Component<ButtonProps> {
-  render() {
-    return <Button color="default" {...this.props} />;
-  }
-}
-
-export default AddButton;
+//@flow
+import React from "react";
+import Button, { type ButtonProps } from "./Button";
+
+class AddButton extends React.Component<ButtonProps> {
+  render() {
+    return <Button color="default" {...this.props} />;
+  }
+}
+
+export default AddButton;

scm-ui-components/packages/ui-components/src/buttons/CreateButton.js

@@ -1,24 +1,27 @@
-//@flow
-import React from "react";
-import injectSheet from "react-jss";
-import AddButton, { type ButtonProps } from "./Button";
-import classNames from "classnames";
-
-const styles = {
-  spacing: {
-    margin: "1em 0 0 1em"
-  }
-};
-
-class CreateButton extends React.Component<ButtonProps> {
-  render() {
-    const { classes } = this.props;
-    return (
-      <div className={classNames("is-pulled-right", classes.spacing)}>
-        <AddButton {...this.props} />
-      </div>
-    );
-  }
-}
-
-export default injectSheet(styles)(CreateButton);
+//@flow
+import React from "react";
+import injectSheet from "react-jss";
+import SubmitButton, { type ButtonProps } from "./SubmitButton";
+import classNames from "classnames";
+
+const styles = {
+  spacing: {
+    marginTop: "2em",
+    border: "2px solid #e9f7fd",
+    padding: "1em 1em"
+  }
+  
+};
+
+class CreateButton extends React.Component<ButtonProps> {
+  render() {
+    const { classes } = this.props;
+    return (
+      <div className={classNames("has-text-centered", classes.spacing)}>
+        <SubmitButton {...this.props} />
+      </div>
+    );
+  }
+}
+
+export default injectSheet(styles)(CreateButton);

scm-ui-components/packages/ui-components/src/layout/Header.js

@@ -1,31 +1,31 @@
-//@flow
-import * as React from "react";
-import Logo from "./../Logo";
-
-type Props = {
-  children?: React.Node
-};
-
-class Header extends React.Component<Props> {
-  render() {
-    const { children } = this.props;
-    return (
-      <section className="hero is-dark is-small">
-        <div className="hero-body">
-          <div className="container">
-            <div className="columns is-vcentered">
-              <div className="column">
-                <Logo />
-              </div>
-            </div>
-          </div>
-        </div>
-        <div className="hero-foot">
-          <div className="container">{children}</div>
-        </div>
-      </section>
-    );
-  }
-}
-
-export default Header;
+//@flow
+import * as React from "react";
+import Logo from "./../Logo";
+
+type Props = {
+  children?: React.Node
+};
+
+class Header extends React.Component<Props> {
+  render() {
+    const { children } = this.props;
+    return (
+      <section className="hero is-dark is-small">
+        <div className="hero-body">
+          <div className="container">
+            <div className="columns is-vcentered">
+              <div className="column">
+                <Logo />
+              </div>
+            </div>
+          </div>
+        </div>
+        <div className="hero-foot">
+          <div className="container">{children}</div>
+        </div>
+      </section>
+    );
+  }
+}
+
+export default Header;