From c2a64f67b9e46512012b7abbaaf82f5214e7f194 Mon Sep 17 00:00:00 2001
From: Adam Raider <adam.raider@wework.com>
Date: Mon, 4 Feb 2019 13:14:07 -0500
Subject: [PATCH] fix(grid): Remove grid default attr

---
 packages/ray/lib/global/_variables.scss |  6 +--
 packages/ray/stories/grid.stories.js    | 63 +++++++++----------------
 2 files changed, 26 insertions(+), 43 deletions(-)

diff --git a/packages/ray/lib/global/_variables.scss b/packages/ray/lib/global/_variables.scss
index 92db009f..7f5211ac 100644
--- a/packages/ray/lib/global/_variables.scss
+++ b/packages/ray/lib/global/_variables.scss
@@ -106,19 +106,19 @@ $grid-breakpoints: (
   sm: 0px,
   md: 600px,
   lg: 1195px
-) !default;
+);
 
 $container-max-widths: (
   sm: 100%,
   md: 100%,
   lg: 1320px
-) !default;
+);
 
 $container-gutters: (
   sm: 1rem,
   md: 3rem,
   lg: 3.75rem
-) !default;
+);
 
 @include _assert-ascending($grid-breakpoints, '$grid-breakpoints');
 @include _assert-starts-at-zero($grid-breakpoints);
diff --git a/packages/ray/stories/grid.stories.js b/packages/ray/stories/grid.stories.js
index a99df8da..ed1a0644 100644
--- a/packages/ray/stories/grid.stories.js
+++ b/packages/ray/stories/grid.stories.js
@@ -3,46 +3,29 @@ import { storiesOf } from '@storybook/react';
 import { throttle, range } from 'lodash';
 import withPadding from './util/withPadding';
 
-class PageWidth extends React.Component {
-  state = {
-    width: window.innerWidth
-  };
-
-  componentDidMount() {
-    window.addEventListener(
-      'resize',
-      throttle(() => {
-        this.setState({ width: window.innerWidth });
-      }, 100)
-    );
-  }
-
-  render() {
-    return this.state.width;
-  }
-}
-
-storiesOf('Grid', module).addWithJSX('default', () => (
-  <div style={{ backgroundColor: 'hsl(144, 100%, 75%)' }}>
-    <div className="ray--container">
-      <div
-        className="ray--row"
-        style={{ backgroundColor: 'hsl(0, 100%, 75%)' }}
-      >
-        {range(12).map(n => (
-          <div className="ray--col-1">
-            <div
-              style={{
-                minHeight: '100vh',
-                paddingBottom: '100%',
-                backgroundColor: 'hsl(255, 100%, 75%)'
-              }}
-            >
-              {n + 1}
+storiesOf('Grid', module)
+  .addWithJSX('default', () => (
+    <div style={{ backgroundColor: 'hsl(144, 100%, 75%)' }}>
+      <div className="ray--container">
+        <div
+          className="ray--row"
+          style={{ backgroundColor: 'hsl(0, 100%, 75%)' }}
+        >
+          {range(12).map(n => (
+            <div className="ray--col-1">
+              <div
+                style={{
+                  minHeight: '100vh',
+                  paddingBottom: '100%',
+                  backgroundColor: 'hsl(255, 100%, 75%)'
+                }}
+              >
+                {n + 1}
+              </div>
             </div>
-          </div>
-        ))}
+          ))}
+        </div>
       </div>
     </div>
-  </div>
-));
+  ))
+  .add('ray--container', () => <div className="ray--container">asdsads</div>);