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:
Classic298 authored and GitHub committed 2026-02-22 14:32:49 -06:00
1 parent 2ef55972ff
commit 1542dad51a
5 files changed
+19 -3

No files matched your search

@@ -208,6 +208,7 @@
<input
class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query}
aria-label={$i18n.t('Search')}
placeholder={$i18n.t('Search')}
/>
</div>
@@ -357,6 +358,7 @@
<td class="px-3 py-1 min-w-[7rem] w-28">
<button
class=" translate-y-0.5"
aria-label={$i18n.t('Change User Role')}
on:click={() => {
selectedUser = user;
showEditUserModal = !showEditUserModal;
@@ -408,6 +410,7 @@
<Tooltip content={$i18n.t('Chats')}>
<button
class="self-center w-fit text-sm px-2 py-2 hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
aria-label={$i18n.t('Chats')}
on:click={async () => {
showUserChatsModal = !showUserChatsModal;
selectedUser = user;
@@ -421,6 +424,7 @@
<Tooltip content={$i18n.t('Edit User')}>
<button
class="self-center w-fit text-sm px-2 py-2 hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
aria-label={$i18n.t('Edit User')}
on:click={async () => {
showEditUserModal = !showEditUserModal;
selectedUser = user;
@@ -447,6 +451,7 @@
<Tooltip content={$i18n.t('Delete User')}>
<button
class="self-center w-fit text-sm px-2 py-2 hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
aria-label={$i18n.t('Delete User')}
on:click={async () => {
showDeleteConfirmDialog = true;
selectedUser = user;