tabshift/pocketbase
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[#4607] fixed the keyboard-accebility of the Admin UI dropdowns

Browse Source
This commit is contained in:
Gani Georgiev
2024-03-22 20:06:18 +02:00
parent b596bbdc3e
commit 0122d4f527
48 changed files with 552 additions and 453 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
ui/src/App.svelte
View File

@@ -117,23 +117,29 @@
</a>
</nav>
<figure class="thumb thumb-circle link-hint closable">
<div
tabindex="0"
role="button"
aria-label="Logged admin menu"
class="thumb thumb-circle link-hint closable"
>
<img
src="{import.meta.env.BASE_URL}images/avatars/avatar{$admin?.avatar || 0}.svg"
alt="Avatar"
aria-hidden="true"
/>
<Toggler class="dropdown dropdown-nowrap dropdown-upside dropdown-left">
<a href="/settings/admins" class="dropdown-item closable" use:link>
<i class="ri-shield-user-line" />
<a href="/settings/admins" class="dropdown-item closable" role="menuitem" use:link>
<i class="ri-shield-user-line" aria-hidden="true" />
<span class="txt">Manage admins</span>
</a>
<hr />
<button type="button" class="dropdown-item closable" on:click={logout}>
<i class="ri-logout-circle-line" />
<button type="button" class="dropdown-item closable" role="menuitem" on:click={logout}>
<i class="ri-logout-circle-line" aria-hidden="true" />
<span class="txt">Logout</span>
</button>
</Toggler>
</figure>
</div>
</aside>
{/if}