button component can be wide

This commit is contained in:
Kiril Videlov 2023-03-28 15:35:18 +02:00 committed by Kiril Videlov
parent 74ddc05509
commit cb3432292d
2 changed files with 24 additions and 1 deletions

View File

@ -2,6 +2,7 @@
export let primary = false;
export let filled = true;
export let small = false;
export let wide = false;
export let label: string;
</script>
@ -34,7 +35,8 @@ And the following optional props:
: filled
? 'default-filled'
: 'default-nofill'}
{small ? 'size-small' : 'size-normal'}
{small ? 'short' : ''}
{wide ? 'wide' : ''}
"
type="button"
on:click
@ -98,4 +100,7 @@ And the following optional props:
.size-small {
@apply px-2 py-1;
}
.wide {
width: 119.5px;
}
</style>

View File

@ -40,6 +40,24 @@ export const PrimarySmall: Story = {
}
};
export const PrimaryWide: Story = {
args: {
primary: true,
wide: true,
label: 'Button'
}
};
export const PrimarySmallWide: Story = {
args: {
primary: true,
wide: true,
small: true,
label: 'Button'
}
};
export const PrimaryFilledSmall: Story = {
args: {
primary: true,