small input field ui improvements

This commit is contained in:
Samuel Andert 2023-08-08 11:11:48 +02:00
parent 3b0640875e
commit 1240549cd4
3 changed files with 4 additions and 4 deletions

View File

@ -124,7 +124,7 @@
</script>
<div class="p-6">
<form on:submit|preventDefault={handleNext} on:keydown={handleKeyDown} class="w-full max-w-md">
<form on:submit|preventDefault={handleNext} on:keydown={handleKeyDown} class="w-full">
{#if !$state.matches('submitting')}
<div class="mb-4">
{#if $errors[fields[$state.context.currentField].name]}

View File

@ -15,12 +15,12 @@
<select
name={field.name}
bind:this={inputElement}
class="w-full px-3 py-2 bg-transparent border-gray-100 rounded-md border-1 ring-0 ring-white focus:outline-none focus:ring-2 focus:ring-blue-500"
class="select"
size="5"
bind:value={$form[field.name]}
aria-invalid={$errors[field.name] ? 'true' : undefined}
{...constraints[field.name]}
>
<option value="">Select...</option>
<option value="apple">Apple</option>
<option value="banana">Banana</option>
<option value="coconut">Coconut</option>

View File

@ -15,7 +15,7 @@
<textarea
name={field.name}
bind:this={inputElement}
class="w-full px-3 py-2 bg-transparent border-gray-100 rounded-md border-1 ring-0 ring-white focus:outline-none focus:ring-2 focus:ring-blue-500"
class="w-full px-3 py-2 bg-transparent border-gray-100 rounded-md textarea border-1 ring-0 ring-white focus:outline-none focus:ring-2 focus:ring-blue-500"
bind:value={$form[field.name]}
aria-invalid={$errors[field.name] ? 'true' : undefined}
{...constraints[field.name]}