marcel/familienarchiv
1
0
Fork 0
Code Issues 125 Pull Requests 1 Actions 1 Packages Projects Releases Wiki Activity

feat(UserMenu): brand-mint avatar, white guest icon, focus rings

Browse Source 
- Avatar: bg-brand-mint text-brand-navy (mint circle, navy initials)
- Guest icon button: text-white/60, hover text-white
- Both buttons: focus-visible:ring-2 ring-accent

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-03-30 22:00:22 +02:00
parent 14b1cc7539
commit e65ddc655e
1 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/routes/UserMenu.svelte
View File

@@ -33,7 +33,7 @@ function clickOutside(node: HTMLElement) {
aria-expanded={userMenuOpen}
aria-haspopup="true"
onclick={() => (userMenuOpen = !userMenuOpen)}
class="flex h-8 w-8 items-center justify-center rounded-full bg-primary font-sans text-xs font-bold text-primary-fg transition-opacity hover:opacity-80"
class="flex h-8 w-8 items-center justify-center rounded-full bg-brand-mint font-sans text-xs font-bold text-brand-navy transition-opacity hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-accent"
>
{userInitials}
</button>
@@ -44,7 +44,7 @@ function clickOutside(node: HTMLElement) {
aria-expanded={userMenuOpen}
aria-haspopup="true"
onclick={() => (userMenuOpen = !userMenuOpen)}
class="inline-flex items-center gap-1.5 px-3 py-2 font-sans text-xs font-bold tracking-widest text-ink-3 uppercase transition-colors hover:text-ink"
class="inline-flex items-center gap-1.5 px-3 py-2 font-sans text-xs font-bold tracking-widest text-white/60 uppercase transition-colors hover:text-white focus:outline-none focus-visible:ring-2 focus-visible:ring-accent"
>
<img
src="/degruyter-icons/Simple/Small-16px/SVG/Action/Account-SM.svg"