From d20e7b387e5d9c75ccb4b08657cba714b68dcd34 Mon Sep 17 00:00:00 2001
From: Simon Adcock <simonadcock2@gmail.com>
Date: Thu, 18 Feb 2021 17:36:34 +0000
Subject: [PATCH] fix storybook padding hacks

---
 src/core/components/layout/columns.stories.tsx             | 7 -------
 src/core/components/layout/container.stories.tsx           | 7 -------
 src/core/components/layout/inline.stories.tsx              | 7 -------
 src/core/components/layout/stack.stories.tsx               | 7 -------
 .../components/layout/stories/columns/collapse-below.tsx   | 1 +
 src/core/components/layout/stories/columns/with-width.tsx  | 2 ++
 src/core/components/layout/tiles.stories.tsx               | 7 -------
 7 files changed, 3 insertions(+), 35 deletions(-)

diff --git a/src/core/components/layout/columns.stories.tsx b/src/core/components/layout/columns.stories.tsx
index 335f4aa94..1a9f6b25f 100644
--- a/src/core/components/layout/columns.stories.tsx
+++ b/src/core/components/layout/columns.stories.tsx
@@ -1,15 +1,8 @@
-import React from 'react';
 import { Columns } from './index';
 
-const gridStoryWrapper = (storyFn: () => JSX.Element) => {
-	// override 8px margin applied globally to every preview body
-	return <div style={{ margin: '0 -8px' }}>{storyFn()}</div>;
-};
-
 export default {
 	title: 'Columns',
 	component: Columns,
-	decorators: [gridStoryWrapper],
 };
 
 export * from './stories/columns/default';
diff --git a/src/core/components/layout/container.stories.tsx b/src/core/components/layout/container.stories.tsx
index cfbf0f282..48b81ddfb 100644
--- a/src/core/components/layout/container.stories.tsx
+++ b/src/core/components/layout/container.stories.tsx
@@ -1,15 +1,8 @@
-import React from 'react';
 import { Container } from './index';
 
-const gridStoryWrapper = (storyFn: () => JSX.Element) => {
-	// override 8px margin applied globally to every preview body
-	return <div style={{ margin: '0 -8px' }}>{storyFn()}</div>;
-};
-
 export default {
 	title: 'Container',
 	component: Container,
-	decorators: [gridStoryWrapper],
 };
 
 export * from './stories/container/default';
diff --git a/src/core/components/layout/inline.stories.tsx b/src/core/components/layout/inline.stories.tsx
index cf44760c6..3b04d6fc2 100644
--- a/src/core/components/layout/inline.stories.tsx
+++ b/src/core/components/layout/inline.stories.tsx
@@ -1,15 +1,8 @@
-import React from 'react';
 import { Inline } from './index';
 
-const gridStoryWrapper = (storyFn: () => JSX.Element) => {
-	// override 8px margin applied globally to every preview body
-	return <div style={{ margin: '0 -8px' }}>{storyFn()}</div>;
-};
-
 export default {
 	title: 'Inline',
 	component: Inline,
-	decorators: [gridStoryWrapper],
 };
 
 export * from './stories/inline/default';
diff --git a/src/core/components/layout/stack.stories.tsx b/src/core/components/layout/stack.stories.tsx
index 6e76a730c..784cec018 100644
--- a/src/core/components/layout/stack.stories.tsx
+++ b/src/core/components/layout/stack.stories.tsx
@@ -1,15 +1,8 @@
-import React from 'react';
 import { Stack } from './index';
 
-const gridStoryWrapper = (storyFn: () => JSX.Element) => {
-	// override 8px margin applied globally to every preview body
-	return <div style={{ margin: '0 -8px' }}>{storyFn()}</div>;
-};
-
 export default {
 	title: 'Stack',
 	component: Stack,
-	decorators: [gridStoryWrapper],
 };
 
 export * from './stories/stack/default';
diff --git a/src/core/components/layout/stories/columns/collapse-below.tsx b/src/core/components/layout/stories/columns/collapse-below.tsx
index 2e8c6071d..d1cf55e93 100644
--- a/src/core/components/layout/stories/columns/collapse-below.tsx
+++ b/src/core/components/layout/stories/columns/collapse-below.tsx
@@ -31,5 +31,6 @@ collapseBelowTablet.story = {
 	name: 'collapse below tablet',
 	parameters: {
 		viewport: { defaultViewport: 'phablet' },
+		layout: 'fullscreen',
 	},
 };
diff --git a/src/core/components/layout/stories/columns/with-width.tsx b/src/core/components/layout/stories/columns/with-width.tsx
index 9c27bc05a..d96dda4e7 100644
--- a/src/core/components/layout/stories/columns/with-width.tsx
+++ b/src/core/components/layout/stories/columns/with-width.tsx
@@ -89,6 +89,7 @@ withWidthDesktop.story = {
 	name: 'with width desktop',
 	parameters: {
 		viewport: { defaultViewport: 'desktop' },
+		layout: 'fullscreen',
 	},
 };
 
@@ -98,5 +99,6 @@ withWidthTablet.story = {
 	name: 'with width tablet',
 	parameters: {
 		viewport: { defaultViewport: 'tablet' },
+		layout: 'fullscreen',
 	},
 };
diff --git a/src/core/components/layout/tiles.stories.tsx b/src/core/components/layout/tiles.stories.tsx
index e9fdb70a6..b336ab567 100644
--- a/src/core/components/layout/tiles.stories.tsx
+++ b/src/core/components/layout/tiles.stories.tsx
@@ -1,15 +1,8 @@
-import React from 'react';
 import { Tiles } from './index';
 
-const gridStoryWrapper = (storyFn: () => JSX.Element) => {
-	// override 8px margin applied globally to every preview body
-	return <div style={{ margin: '0 -8px' }}>{storyFn()}</div>;
-};
-
 export default {
 	title: 'Tiles',
 	component: Tiles,
-	decorators: [gridStoryWrapper],
 };
 
 export * from './stories/tiles/default';