Merge pull request #13566 from itk-dev/8908-accessibility-enhancements

feat: Accessibility enhancements
This commit is contained in:
Tim Jaeryang Baek
2025-05-07 22:07:57 +04:00
committed by GitHub
3 changed files with 23 additions and 10 deletions

View File

@@ -43,6 +43,7 @@
fill="currentColor"
class="w-5 h-5"
>
<p class="sr-only">{$i18n.t('Close')}</p>
<path
d="M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z"
/>

View File

@@ -87,6 +87,7 @@
<div class="flex justify-center mt-8">
<div class="flex flex-col justify-center items-center">
<button
aria-labelledby="get-started"
class="relative z-20 flex p-1 rounded-full bg-white/5 hover:bg-white/10 transition font-medium text-sm"
on:click={() => {
getStartedHandler();
@@ -94,12 +95,12 @@
>
<ArrowRightCircle className="size-6" />
</button>
<div class="mt-1.5 font-primary text-base font-medium">{$i18n.t(`Get started`)}</div>
<div id="get-started" class="mt-1.5 font-primary text-base font-medium">
{$i18n.t(`Get started`)}
</div>
</div>
</div>
</div>
<!-- <div class="absolute bottom-12 left-0 right-0 w-full"></div> -->
</div>
</div>
{/if}

View File

@@ -188,7 +188,7 @@
crossorigin="anonymous"
src="{WEBUI_BASE_URL}/static/splash.png"
class=" w-6 rounded-full"
alt="logo"
alt=""
/>
</div>
</div>
@@ -235,7 +235,7 @@
</div>
{#if $config?.onboarding ?? false}
<div class=" mt-1 text-xs font-medium text-gray-500">
<div class="mt-1 text-xs font-medium text-gray-600 dark:text-gray-500">
ⓘ {$WEBUI_NAME}
{$i18n.t(
'does not make any external connections, and your data stays securely on your locally hosted server.'
@@ -248,10 +248,13 @@
<div class="flex flex-col mt-4">
{#if mode === 'signup'}
<div class="mb-2">
<div class=" text-sm font-medium text-left mb-1">{$i18n.t('Name')}</div>
<label for="name" class="text-sm font-medium text-left mb-1 block"
>{$i18n.t('Name')}</label
>
<input
bind:value={name}
type="text"
id="name"
class="my-0.5 w-full text-sm outline-hidden bg-transparent"
autocomplete="name"
placeholder={$i18n.t('Enter Your Full Name')}
@@ -262,23 +265,29 @@
{#if mode === 'ldap'}
<div class="mb-2">
<div class=" text-sm font-medium text-left mb-1">{$i18n.t('Username')}</div>
<label for="username" class="text-sm font-medium text-left mb-1 block"
>{$i18n.t('Username')}</label
>
<input
bind:value={ldapUsername}
type="text"
class="my-0.5 w-full text-sm outline-hidden bg-transparent"
autocomplete="username"
name="username"
id="username"
placeholder={$i18n.t('Enter Your Username')}
required
/>
</div>
{:else}
<div class="mb-2">
<div class=" text-sm font-medium text-left mb-1">{$i18n.t('Email')}</div>
<label for="email" class="text-sm font-medium text-left mb-1 block"
>{$i18n.t('Email')}</label
>
<input
bind:value={email}
type="email"
id="email"
class="my-0.5 w-full text-sm outline-hidden bg-transparent"
autocomplete="email"
name="email"
@@ -289,11 +298,13 @@
{/if}
<div>
<div class=" text-sm font-medium text-left mb-1">{$i18n.t('Password')}</div>
<label for="password" class="text-sm font-medium text-left mb-1 block"
>{$i18n.t('Password')}</label
>
<input
bind:value={password}
type="password"
id="password"
class="my-0.5 w-full text-sm outline-hidden bg-transparent"
placeholder={$i18n.t('Enter Your Password')}
autocomplete="current-password"