diff --git a/packages/shared-ui/src/navigation/PillNavigation.svelte b/packages/shared-ui/src/navigation/PillNavigation.svelte index 3f0e4894a..b96d19788 100644 --- a/packages/shared-ui/src/navigation/PillNavigation.svelte +++ b/packages/shared-ui/src/navigation/PillNavigation.svelte @@ -552,6 +552,20 @@ // light/dark/system toggle, theme button. const userMenuBarItems = $derived.by(() => { const out: PillDropdownItem[] = []; + // Guest → put "Anmelden" first. Everything else in the menu + // (settings, theme, logout) is a user-only action or a trivial + // toggle, so the login entry should be the obvious call-to-action + // at the top of the bar. + if (!userEmail && loginHref) { + out.push({ + id: 'login', + label: 'Anmelden', + icon: 'login', + onClick: () => { + window.location.href = loginHref; + }, + }); + } if (settingsHref) { out.push({ id: 'settings', @@ -758,10 +772,14 @@ {#if (userEmail || loginHref) && barMode} {@const userLabel = userEmail ? truncateEmail(userEmail) : guestMenuLabel} + {@const userBarConfig = { id: 'user', - label: userLabel, - icon: 'user', + label: userEmail ? userLabel : '', + icon: userEmail ? 'user' : undefined, items: userMenuBarItems, }} = { compass: Compass, moon: Moon, sun: Sun, + login: SignIn, logout: SignOut, chevronDown: CaretDown, menu: List,