Skip to content

Commit

Permalink
Fixes the storybook docs styling
Browse files Browse the repository at this point in the history
  • Loading branch information
stuarthendren committed Mar 18, 2021
1 parent 91a4f9a commit 2f00006
Show file tree
Hide file tree
Showing 2 changed files with 27 additions and 3 deletions.
24 changes: 24 additions & 0 deletions .storybook/components/DocContainer.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import React from 'react'
import { DocsContainer as BaseContainer } from '@storybook/addon-docs/blocks'
import { useDarkMode } from 'storybook-dark-mode'
import { themes } from '@storybook/theming'

export const DocsContainer = ({ children, context }) => {
const dark = useDarkMode()

return (
<BaseContainer
context={{
...context,
parameters: {
...context.parameters,
docs: {
theme: dark ? themes.dark : themes.light,
},
},
}}
>
{children}
</BaseContainer>
)
}
6 changes: 3 additions & 3 deletions .storybook/preview.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { committedLight } from './committed/theme.js'
import { withTheme } from './committed/withTheme'
import { withTheme } from './committed/withTheme';
import { DocsContainer } from './components/DocContainer';

export const decorators = [withTheme]
export const parameters = {
Expand All @@ -24,6 +24,6 @@ export const parameters = {
},
},
docs: {
theme: committedLight,
container: DocsContainer,
},
}

0 comments on commit 2f00006

Please sign in to comment.