Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

ColorPicker story updated with the latest conventions

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-09-18 11:25:45 +03:00
parent 5f7e35ddab
commit a449a8f00c
2 changed files with 12 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
storybook/stories/ColorPicker/ColorPicker.js
View file

@ -3,16 +3,12 @@ const { storiesOf } = require('@storybook/react');
const { ColorPicker } = require('stremio/common');
const styles = require('./styles');
const ColorPickerExampleusage = () => {
storiesOf('ColorPicker', module).add('ColorPicker', () => {
const [color, setColor] = React.useState('rgba(166, 196, 213, 0.97)');
return (
<div className={styles['demo-container']}>
<ColorPicker
value={color}
onChange={setColor}
/>
<div className={styles['test-output']}>Current color is {color}</div>
<div className={styles['color-picker-container']}>
<ColorPicker value={color} onChange={setColor} />
<div className={styles['color-output-label']}>Current color is {color}</div>
</div>
);
}
storiesOf('ColorPicker', module).add('ColorPicker', () => <ColorPickerExampleusage />);
});

11
storybook/stories/ColorPicker/styles.less
View file

@ -1,5 +1,8 @@
.demo-container {
color: var(--color-surfacelighter);
padding: 1rem;
.test-output { margin-top: 1rem; }
.color-picker-container {
padding: 1rem;
.color-output-label {
margin-top: 1rem;
color: var(--color-surfacelighter);
}
}