storybook-styles
storybook-styles copied to clipboard
Add custom styles to the storybook preview panel
Storybook styles
This storybook decorator allows you to add custom styles to the storybook preview panel.
Getting Started
npm install --save @sambego/storybook-styles
Then write your stories like this:
import React from 'react';
import { storiesOf } from "@storybook/react";
import styles from "@sambego/storybook-styles";
storiesOf("Button", module)
.addDecorator(styles({
fontFamily: 'Helvetica, Arial, sans-serif',
background: '#e1ecfa',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
height: '500px',
}))
.add("with text", () => <button>Click me</button>);
The style decorator accepts a JavaScript object with camelCased style properties which will be applied around the content of the preview area.