fix(a11y): enhance accessibility for admin user components (#21717)
This commit adds aria-labels to the search inputs, select fields, action buttons, and close buttons on modals across the admin users layout and the site changelog modal for improved screen reader support.
This commit is contained in:
@@ -133,6 +133,7 @@
|
||||
<div class=" text-lg font-medium self-center">{$i18n.t('Add User')}</div>
|
||||
<button
|
||||
class="self-center"
|
||||
aria-label={$i18n.t('Close')}
|
||||
on:click={() => {
|
||||
show = false;
|
||||
}}
|
||||
@@ -182,6 +183,7 @@
|
||||
<select
|
||||
class="w-full capitalize rounded-lg text-sm bg-transparent dark:disabled:text-gray-500 outline-hidden"
|
||||
bind:value={_user.role}
|
||||
aria-label={$i18n.t('Role')}
|
||||
placeholder={$i18n.t('Enter Your Role')}
|
||||
required
|
||||
>
|
||||
@@ -200,6 +202,7 @@
|
||||
class="w-full text-sm bg-transparent disabled:text-gray-500 dark:disabled:text-gray-500 outline-hidden"
|
||||
type="text"
|
||||
bind:value={_user.name}
|
||||
aria-label={$i18n.t('Name')}
|
||||
placeholder={$i18n.t('Enter Your Full Name')}
|
||||
autocomplete="off"
|
||||
required
|
||||
@@ -217,6 +220,7 @@
|
||||
class="w-full text-sm bg-transparent disabled:text-gray-500 dark:disabled:text-gray-500 outline-hidden"
|
||||
type="email"
|
||||
bind:value={_user.email}
|
||||
aria-label={$i18n.t('Email')}
|
||||
placeholder={$i18n.t('Enter Your Email')}
|
||||
required
|
||||
/>
|
||||
@@ -231,6 +235,7 @@
|
||||
class="w-full text-sm bg-transparent disabled:text-gray-500 dark:disabled:text-gray-500 outline-hidden"
|
||||
type="password"
|
||||
bind:value={_user.password}
|
||||
aria-label={$i18n.t('Password')}
|
||||
placeholder={$i18n.t('Enter Your Password')}
|
||||
autocomplete="off"
|
||||
required
|
||||
|
||||
Reference in New Issue
Block a user