diff options
Diffstat (limited to 'storybook')
-rw-r--r-- | storybook/config.js | 12 | ||||
-rw-r--r-- | storybook/stories/autosuggest_textarea.story.jsx | 6 | ||||
-rw-r--r-- | storybook/stories/button.story.jsx | 1 | ||||
-rw-r--r-- | storybook/stories/loading_indicator.story.jsx | 6 | ||||
-rw-r--r-- | storybook/stories/tabs_bar.story.jsx | 6 | ||||
-rw-r--r-- | storybook/storybook.css | 3 | ||||
-rw-r--r-- | storybook/storybook.scss | 15 | ||||
-rw-r--r-- | storybook/webpack.config.js | 13 |
8 files changed, 47 insertions, 15 deletions
diff --git a/storybook/config.js b/storybook/config.js index d9fde833c..4a111a8b9 100644 --- a/storybook/config.js +++ b/storybook/config.js @@ -1,8 +1,14 @@ -import { configure } from '@kadira/storybook'; +import { configure, setAddon } from '@kadira/storybook'; +import IntlAddon from 'react-storybook-addon-intl'; import React from 'react'; import { storiesOf, action } from '@kadira/storybook'; +import { addLocaleData } from 'react-intl'; +import en from 'react-intl/locale-data/en'; +import '../app/assets/stylesheets/components.scss' +import './storybook.scss' -import './storybook.css' +setAddon(IntlAddon); +addLocaleData(en); window.storiesOf = storiesOf; window.action = action; @@ -11,7 +17,7 @@ window.React = React; function loadStories () { require('./stories/loading_indicator.story.jsx'); require('./stories/button.story.jsx'); - require('./stories/tabs_bar.story.jsx'); + require('./stories/autosuggest_textarea.story.jsx'); } configure(loadStories, module); diff --git a/storybook/stories/autosuggest_textarea.story.jsx b/storybook/stories/autosuggest_textarea.story.jsx new file mode 100644 index 000000000..7d84ff1e1 --- /dev/null +++ b/storybook/stories/autosuggest_textarea.story.jsx @@ -0,0 +1,6 @@ +import { storiesOf } from '@kadira/storybook'; +import AutosuggestTextarea from '../../app/assets/javascripts/components/components/autosuggest_textarea.jsx' + +storiesOf('AutosuggestTextarea', module) + .add('default state', () => <AutosuggestTextarea />) + .add('with text', () => <AutosuggestTextarea value='Hello' />) diff --git a/storybook/stories/button.story.jsx b/storybook/stories/button.story.jsx index fe6d57ad0..fc392abef 100644 --- a/storybook/stories/button.story.jsx +++ b/storybook/stories/button.story.jsx @@ -1,3 +1,4 @@ +import { storiesOf } from '@kadira/storybook'; import Button from '../../app/assets/javascripts/components/components/button.jsx' storiesOf('Button', module) diff --git a/storybook/stories/loading_indicator.story.jsx b/storybook/stories/loading_indicator.story.jsx index d169e4f55..f4a961c4e 100644 --- a/storybook/stories/loading_indicator.story.jsx +++ b/storybook/stories/loading_indicator.story.jsx @@ -1,6 +1,6 @@ +import { storiesOf } from '@kadira/storybook'; import LoadingIndicator from '../../app/assets/javascripts/components/components/loading_indicator.jsx' +import { IntlProvider } from 'react-intl'; storiesOf('LoadingIndicator', module) - .add('default state', () => ( - <LoadingIndicator /> - )); + .add('default state', () => <IntlProvider><LoadingIndicator /></IntlProvider>); diff --git a/storybook/stories/tabs_bar.story.jsx b/storybook/stories/tabs_bar.story.jsx deleted file mode 100644 index daaedca5a..000000000 --- a/storybook/stories/tabs_bar.story.jsx +++ /dev/null @@ -1,6 +0,0 @@ -import TabsBar from '../../app/assets/javascripts/components/features/ui/components/tabs_bar.jsx' - -storiesOf('TabsBar', module) - .add('default state', () => ( - <TabsBar /> - )); diff --git a/storybook/storybook.css b/storybook/storybook.css deleted file mode 100644 index 3bda9e64c..000000000 --- a/storybook/storybook.css +++ /dev/null @@ -1,3 +0,0 @@ -#root { - padding: 4rem; -} diff --git a/storybook/storybook.scss b/storybook/storybook.scss new file mode 100644 index 000000000..b0145f9bd --- /dev/null +++ b/storybook/storybook.scss @@ -0,0 +1,15 @@ +@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,400italic); +@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,500); + +#root { + font-family: 'Roboto', sans-serif; + background: #282c37; + font-size: 13px; + line-height: 18px; + font-weight: 400; + color: #fff; + padding-bottom: 140px; + text-rendering: optimizelegibility; + font-feature-settings: "kern"; + padding: 4rem; +} diff --git a/storybook/webpack.config.js b/storybook/webpack.config.js new file mode 100644 index 000000000..0ce563e1a --- /dev/null +++ b/storybook/webpack.config.js @@ -0,0 +1,13 @@ +const path = require('path'); + +module.exports = { + module: { + loaders: [ + { + test: /.scss$/, + loaders: ["style", "css", "sass"], + include: path.resolve(__dirname, '../') + } + ] + } +} |