From 8d52c87e6cebb2a2e80da0958ad12b91611b0682 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rasmus=20W=C3=B8lk?= <rasmuswoelk@Rasmuss-MacBook-Pro.local>
Date: Mon, 27 Nov 2017 15:49:25 +0100
Subject: [PATCH] Added story

---
 atom.cson                        | 12 ++++++++
 lib/Checkbox/Checkbox.css        |  3 +-
 lib/Checkbox/Checkbox.stories.js | 51 ++++++++++++++++++++++++++++++++
 3 files changed, 64 insertions(+), 2 deletions(-)
 create mode 100644 atom.cson
 create mode 100644 lib/Checkbox/Checkbox.stories.js

diff --git a/atom.cson b/atom.cson
new file mode 100644
index 000000000..19302cb4f
--- /dev/null
+++ b/atom.cson
@@ -0,0 +1,12 @@
+"*":
+  editor:
+    backUpBeforeSaving: true
+    fontSize: 13
+    invisibles: {}
+    lineHeight: 2.5
+    scrollPastEnd: true
+    scrollSensitivity: 80
+    showIndentGuide: true
+    showInvisibles: true
+    tabLength: 2
+    zoomFontWhenCtrlScrolling: true
diff --git a/lib/Checkbox/Checkbox.css b/lib/Checkbox/Checkbox.css
index a8432d5d5..a33331a6a 100644
--- a/lib/Checkbox/Checkbox.css
+++ b/lib/Checkbox/Checkbox.css
@@ -44,8 +44,7 @@
   flex-grow: 2;
   padding: 7px 2px;
   margin: 0 4px;
-  font-size: 0.8rem;
-  font-weight: bold;
+  font-weight: 600;
   color: var(--labelColor);
 
   &.error {
diff --git a/lib/Checkbox/Checkbox.stories.js b/lib/Checkbox/Checkbox.stories.js
new file mode 100644
index 000000000..9cd1ac357
--- /dev/null
+++ b/lib/Checkbox/Checkbox.stories.js
@@ -0,0 +1,51 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react'; // eslint-disable-line import/no-extraneous-dependencies
+import Checkbox from './Checkbox';
+
+class CheckboxExample extends React.Component {
+  constructor() {
+    super();
+    this.state = {
+      selected: 'option_1',
+      options: [
+        {
+          label: 'Option 1',
+          value: 'option_1',
+        },
+        {
+          label: 'Option 2',
+          value: 'option_2',
+        },
+        {
+          label: 'Option 3',
+          value: 'option_3',
+        },
+        {
+          label: 'Option 4',
+          value: 'option_4',
+        },
+        {
+          label: 'Option 5 (with error)',
+          value: 'option_5',
+          error: true,
+        },
+      ],
+    };
+  }
+  render() {
+    const { selected, options } = this.state;
+    return (
+      <div style={{ padding: '15px' }}>
+        { options.map(option => (
+          <Checkbox
+            id={option.value}
+            label={option.label}
+          />
+        )) }
+      </div>
+    );
+  }
+}
+
+storiesOf('Checkbox', module)
+  .add('Basic Usage', () => (<CheckboxExample />));