From 48332b8495e8d24b8738c87d623296418fda866e Mon Sep 17 00:00:00 2001
From: "Carter J. Bastian" <carter.bastian1@gmail.com>
Date: Tue, 28 Feb 2017 19:08:37 -0500
Subject: [PATCH] Make ShapeOption a child of ShapeBar

---
 app/components/ShapeBar.js    | 12 +++++++++---
 app/components/ShapeOption.js | 15 +++++++++++++++
 app/containers/App.js         |  1 -
 3 files changed, 24 insertions(+), 4 deletions(-)
 create mode 100644 app/components/ShapeOption.js

diff --git a/app/components/ShapeBar.js b/app/components/ShapeBar.js
index e3a9847..e64921a 100644
--- a/app/components/ShapeBar.js
+++ b/app/components/ShapeBar.js
@@ -3,13 +3,19 @@ import React, { Component } from 'react';
 var ReactDOM = require('react-dom');
 var electron = require('electron');
 
-// const {Raphael,Paper,Set,Circle,Ellipse,Image,Rect,Text,Path,Line} = require('react-raphael');
+import ShapeOption from './ShapeOption';
 
-export default class Canvas extends Component {
+export default class ShapeBar extends Component {
+  
   render() {
     return (
       <div style={{position: 'absolute', backgroundColor: 'red', width: '100%', height: '10%', margin: 0, padding: 0}}>
-        <div></div>
+        <ShapeOption />
+        <ShapeOption />
+        <ShapeOption />
+        <ShapeOption />
+        <ShapeOption />
+        <ShapeOption />
       </div>);
   }
 }
diff --git a/app/components/ShapeOption.js b/app/components/ShapeOption.js
new file mode 100644
index 0000000..082746c
--- /dev/null
+++ b/app/components/ShapeOption.js
@@ -0,0 +1,15 @@
+// @flow
+import React, { Component } from 'react';
+var ReactDOM = require('react-dom');
+var electron = require('electron');
+
+const {Raphael,Paper,Set,Circle,Ellipse,Image,Rect,Text,Path,Line} = require('react-raphael');
+
+export default class Canvas extends Component {
+  render() {
+    return (
+      <div style={{position: 'relative', float: 'left', backgroundColor: 'grey', width: '10%', height: '90%', marginLeft: '5%', marginTop: '0.5%'}}>
+        <div></div>
+      </div>);
+  }
+}
diff --git a/app/containers/App.js b/app/containers/App.js
index 2a9a321..2766fe2 100644
--- a/app/containers/App.js
+++ b/app/containers/App.js
@@ -17,7 +17,6 @@ export default class App extends Component {
     super(props);
   };
 
-
   render() {
     return (
       <div style={{position: 'absolute', backgroundColor: 'green', width: '100%', height: '100%', margin: 0, padding: 0}}>