gitbutlerapp/gitbutler
1
1
Fork 0
mirror of https://github.com/gitbutlerapp/gitbutler.git synced 2024-12-24 10:02:26 +03:00
Code Issues Packages Projects Releases Wiki Activity

Modified buttons for full-width which was not update in the button-component

Browse Source
This commit is contained in:
Ian Donahue 2023-04-05 17:57:22 +02:00
parent 541a72de0c
commit e5e47bf64a
3 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/components/Button/Button.stories.svelte
View File

@ -6,7 +6,7 @@
import Button from './Button.svelte';
const heights = ['basic', 'small'] as const;
const widths = ['basic', 'long'] as const;
const widths = ['basic', 'full-width'] as const;
const content = [
[IconHome, 'Label'],

4
src/lib/components/ButtonGroup/ButtonGroup.stories.svelte
View File

@ -16,7 +16,7 @@
<ButtonGroup
leftLabel="Cancel"
rightLabel="Submit"
width="long"
width="full-width"
leftAction={noop}
rightAction={noop}
/>
@ -37,7 +37,7 @@
leftLabel="Cancel"
rightLabel="Submit"
middleLabel="Middle"
width="long"
width="full-width"
leftAction={noop}
rightAction={noop}
/>

8
src/lib/components/ButtonGroup/ButtonGroup.svelte
View File

@ -7,7 +7,7 @@
export let rightAction: () => void;
export let middleLabel: string | undefined = undefined;
export let middleAction: (() => void) | undefined = undefined;
export let width: 'basic' | 'long' = 'basic';
export let width: 'basic' | 'full-width' = 'basic';
</script>
{#if !middleLabel}
@ -22,13 +22,13 @@
{:else}
<div class="btn-group btn-group--segmented">
<button class="joined-base rounded-l-lg border-l border-t border-b" on:click={leftAction}>
<span class="my-2 {width === 'long' ? 'mx-[31.5px]' : 'mx-[16px]'}">{leftLabel}</span>
<span class="my-2 {width === 'full-width' ? 'mx-[31.5px]' : 'mx-[16px]'}">{leftLabel}</span>
</button>
<button class="joined-base border" on:click={middleAction}>
<span class="my-2 {width === 'long' ? 'mx-[31.5px]' : 'mx-[16px]'}">{middleLabel}</span>
<span class="my-2 {width === 'full-width' ? 'mx-[31.5px]' : 'mx-[16px]'}">{middleLabel}</span>
</button>
<button class="joined-base rounded-r-lg border-r border-t border-b" on:click={rightAction}>
<span class="my-2 {width === 'long' ? 'mx-[31.5px]' : 'mx-[16px]'}">{rightLabel}</span>
<span class="my-2 {width === 'full-width' ? 'mx-[31.5px]' : 'mx-[16px]'}">{rightLabel}</span>
</button>
</div>
{/if}