#31 : Add progress storybook
This commit is contained in:
13
src/components/Progress/stories/Progress.stories.js
Normal file
13
src/components/Progress/stories/Progress.stories.js
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
import ProgressView from './ProgressView.svelte';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
title: 'Default Components/Progress',
|
||||||
|
component: ProgressView
|
||||||
|
};
|
||||||
|
|
||||||
|
const Template = ({ ...args }) => ({
|
||||||
|
Component: ProgressView,
|
||||||
|
props: args
|
||||||
|
});
|
||||||
|
|
||||||
|
export const Primary = Template.bind({});
|
||||||
23
src/components/Progress/stories/ProgressView.svelte
Normal file
23
src/components/Progress/stories/ProgressView.svelte
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
<script>
|
||||||
|
import Progress from '../Progress.svelte'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Progress value
|
||||||
|
*/
|
||||||
|
export let value = 0
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="progress-container">
|
||||||
|
<Progress
|
||||||
|
{value}
|
||||||
|
>
|
||||||
|
</Progress>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.progress-container {
|
||||||
|
width: 100%;
|
||||||
|
height: 5px;
|
||||||
|
background-color: rgba(93, 93, 93, 0.5);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user