Enhance navigation components to conditionally display role switcher based on user login status

- Updated AppHeader.vue to show the role switcher only when the user is logged in, improving the relevance of displayed options.
- Modified CartButton.vue to adjust spacing based on item presence, enhancing visual consistency.

These changes aim to refine user navigation and ensure a more tailored experience within the application.
This commit is contained in:
Bastian Masanek
2025-11-03 19:22:29 +01:00
parent a22e4b42ca
commit 2bda321fe7
2 changed files with 5 additions and 5 deletions

View File

@@ -17,8 +17,8 @@ const { loggedIn } = useAuth()
<img src="/img/experimenta-logo-white.svg" alt="experimenta Logo" class="h-16 w-auto md:h-20 lg:h-22" />
</NuxtLink>
<!-- Role Switcher (Desktop only) -->
<div class="hidden lg:block">
<!-- Role Switcher (Desktop only, only when logged in) -->
<div v-if="loggedIn" class="hidden lg:block">
<RoleSwitcher />
</div>
</div>
@@ -40,8 +40,8 @@ const { loggedIn } = useAuth()
</div>
</div>
<!-- Mobile: Role switcher in collapsible section (optional) -->
<div class="lg:hidden mobile-role-section">
<!-- Mobile: Role switcher in collapsible section (only when logged in) -->
<div v-if="loggedIn" class="lg:hidden mobile-role-section">
<div class="container px-4 py-2.5">
<RoleSwitcher />
</div>