samuelandert.eth/auth.andert.me
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

updated button design of Forms

Browse Source
This commit is contained in:
Samuel Andert 2023-08-08 13:04:02 +02:00
parent 72d597efc8
commit 31ee2a507d
1 changed files with 37 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
src/lib/components/refactor/ComposerForm.svelte
View File

@ -167,13 +167,6 @@
<p class="text-2xl text-center text-white">
{fields[$state.context.currentField].description}
</p>
<!-- <label
for={fields[$state.context.currentField].name}
class="block mb-2 font-semibold text-center text-white"
>
{fields[$state.context.currentField].name.charAt(0).toUpperCase() +
fields[$state.context.currentField].name.slice(1)}
</label> -->
{/if}
</div>
{#if fields[$state.context.currentField].type === 'text'}
@ -205,43 +198,43 @@
submitted
{/if}
<div class="flex justify-between mt-4">
{#each $possibleActions as action (action)}
{#if action === 'PREV'}
<button
type="button"
on:click={() => send(action)}
class="px-4 py-2 text-white bg-blue-500 rounded-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500"
disabled={$state.context.currentField === 0}
>
{action}
</button>
{/if}
{/each}
{#each $possibleActions as action (action)}
{#if action !== 'NEXT' && action !== 'PREV' && action !== 'SUBMIT'}
<button
type="button"
on:click={() => send(action)}
class="px-4 py-2 text-white bg-blue-500 rounded-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500"
>
{action}
</button>
{/if}
{/each}
{#each $possibleActions as action (action)}
{#if action === 'NEXT' || action === 'SUBMIT'}
<button
type="button"
on:click={() => handleNext()}
class="px-4 py-2 text-white bg-blue-500 rounded-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500"
disabled={$errors[fields[$state.context.currentField].name]}
>
{action}
</button>
{/if}
{/each}
<div>
{#each $possibleActions as action (action)}
{#if action === 'PREV'}
<button
type="button"
on:click={() => send(action)}
class="btn btn-xl variant-filled"
disabled={$state.context.currentField === 0}
>
{action}
</button>
{/if}
{/each}
</div>
<div>
{#each $possibleActions as action (action)}
{#if action !== 'NEXT' && action !== 'PREV' && action !== 'SUBMIT'}
<button type="button" on:click={() => send(action)} class="btn btn-xl variant-filled">
{action}
</button>
{/if}
{/each}
</div>
<div>
{#each $possibleActions as action (action)}
{#if action === 'NEXT' || action === 'SUBMIT'}
<button
type="button"
on:click={() => handleNext()}
class="btn btn-xl variant-filled"
disabled={$errors[fields[$state.context.currentField].name]}
>
{action}
</button>
{/if}
{/each}
</div>
</div>
</form>
</div>