https://reiiyuki.github.io/ske-12-ui/
https://www.figma.com/file/YM9lLAGmNJsrrmhCd7eQ0GpN/SKE12?node-id=16%3A2
Development
npm start
Deploy GH-Pages
npm run build:story
git add .
git commit -m "Update Docs"
git subtree push --prefix docs origin gh-pages
Build Library
npm run build:lib
Write it in src/components
. If they are the group of components, please categorize it into sub folder in src/components
.
If you are completely done your job on it, please export it in src/index.js
as the following example:
export { default as Button } from 'components/button/Button'
Note: Please use mixins for develop components, if it doesn't exist in mixins please update mixins for the nice future of this library.
Write it in src/mixins
.
Note: Don't export mixins in src/index.js
! Because it's already nice, when you call ske-12-ui/mixins/colors
.
- Create the story folder in
stories
. - Write
index.js
file with the following template:
import baseStory from 'stories/utils/baseStory'
import SpaceEvenlyDecorator from 'stories/utils/decorators/SpaceEvenlyDecorator' // If you use decorator
baseStory('Button', module) // baseStory(name of story)
.addDecorator(SpaceEvenlyDecorator) // If you want to wrap all of your sample in something please use decorator
.addWithJSX('Default Button', require('./DefaultButton').default) // .addWithJSX(Name of sample, require(sample component).default)
- Write your sample components
- Require it in
stories/index.js