Add colors and fonts stories

stories/components/ColorsStory.js

+import React from 'react'
+
+const ColorsStory = () => (
+  <table className="table" style={{fontSize: 30, lineHeight: 1, cellSpacing: 5}}>
+    <tbody>
+    <tr>
+      <td style={{ background: '#4990e2', width: 100 }}>&nbsp;</td>
+      <th>blue</th>
+      <td>#4990e2</td>
+    </tr>
+    </tbody>
+  </table>
+)
+
+export default ColorsStory

stories/components/FontsStory.js

+import React from 'react'
+
+const FontsStory = () => (
+  <div style={{ fontSize: 50, lineHeight: 1.2 }}>
+    <div style={{ fontFamily: 'Fira Sans' }}>Fira Sans</div>
+    <div style={{ fontFamily: 'Fira Sans Book' }}>Fira Sans Book</div>
+    <div style={{ fontFamily: 'Fira Sans Condensed' }}>Fira Sans Condensed</div>
+    <div style={{ fontFamily: 'Vollkorn' }}>Vollkorn</div>
+  </div>
+)
+
+export default FontsStory

stories/index.js

@@ -31,6 +31,9 @@ import DecisionForm from '../app/components/DecisionForm'
 import ReviewForm from '../app/components/ReviewForm'
 import Navigation from '../app/components/Navigation'
 
+import ColorsStory from './components/ColorsStory'
+import FontsStory from './components/FontsStory'
+
 // storiesOf('Welcome', module)
 //   .add('to Storybook', () => <Welcome showApp={linkTo('Button')} />)
 
@@ -41,6 +44,10 @@ const currentUser = {
   username: 'foo'
 }
 
+storiesOf('Styles', module)
+  .add('colors', () => <ColorsStory/>)
+  .add('fonts', () => <FontsStory/>)
+
 storiesOf('Declarations', module)
   .add('questions', () => (
     <DeclarationQuestions declarations={submittedProject.declarations}