Merge pull request #10 from RandellDawson/feature/styled-components-theme

Implemented styled-components theme.

dashboard-client/app/app/src/components/Tabs.js

@@ -8,21 +8,21 @@ const Container = styled.div`
 `;
 
 const Tab = styled.div`
-  background: ${({ active }) => active ? 'blue' : 'white'};
+  background: ${({ active, theme }) => active ? theme.primary : 'white'};
-  color: ${({ active }) => active ? 'white' : 'blue'};
+  color: ${({ active, theme }) => active ? 'white' : theme.primary};
   font-size: 18px;
   padding: 5px;
-  border: 2px solid blue;
+  border: 2px solid ${({ theme }) => theme.primary};
   border-left: none;
 
   &:hover {
     cursor: pointer;
-    background: blue;
+    background: ${({ theme }) => theme.primary};
     color: white;
   }
 
   &:first-child {
-    border-left: 2px solid blue;
+    border-left: 2px solid ${({ theme }) => theme.primary};
   }
 `;
 

dashboard-client/app/app/src/index.js

@@ -1,12 +1,17 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+
 import './index.css';
-import App from './App';
 import * as serviceWorker from './serviceWorker';
+import theme from './theme';
 
-ReactDOM.render(<App />, document.getElementById('root'));
+import App from './App';
+import { ThemeProvider } from 'styled-components';
+
+ReactDOM.render(
+  <ThemeProvider theme={theme}>
+    <App />
+  </ThemeProvider>,
+  document.getElementById('root'));
 
-// If you want your app to work offline and load faster, you can change
-// unregister() to register() below. Note this comes with some pitfalls.
-// Learn more about service workers: http://bit.ly/CRA-PWA
 serviceWorker.unregister();

dashboard-client/app/app/src/theme/index.js

@@ -0,0 +1,5 @@
+const theme = {
+  primary: 'blue'
+};
+
+export default theme;