feat(#35): make basket more prominent in nav

This commit is contained in:
OllyNicholass
2024-10-29 20:44:45 +00:00
parent 7c6afd169c
commit 4be732005e
7 changed files with 84 additions and 47 deletions
+4 -29
View File
@@ -44,17 +44,17 @@
</button>
</div>
<!-- Dropdown content -->
<NavLinks isMobile />
<NavLinks isMobile {session} {supabase} />
</Dropdown>
</div>
<a href="/" class="text-white font-bold text-xl">SvelteKit SaaS Boilerplate</a>
<div class="hidden lg:block">
<NavLinks />
<NavLinks {session} />
</div>
<!-- Right Side: Basket & User Account -->
<div class="flex items-center space-x-4">
<!-- Basket/Checkout Icon -->
<a href="/checkout" class="btn btn-ghost btn-circle hidden lg:flex">
<a href="/checkout" class="btn btn-ghost btn-circle">
<div class="indicator">
<svg
xmlns="http://www.w3.org/2000/svg"
@@ -78,7 +78,7 @@
<!-- User Account Dropdown -->
<Dropdown posRight>
<div slot="dropdown">
<div class="btn btn-ghost btn-circle avatar placeholder">
<div class="btn btn-ghost btn-circle avatar placeholder hidden md:flex">
<div class="w-10 rounded-full">
{#if session?.user}
<div class="user-circle text-primary-content border-primary-content">
@@ -100,32 +100,7 @@
</div>
<!-- Dropdown content -->
{#if session?.user}
<li class="lg:hidden">
<a href="/checkout">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z"
/>
</svg>
Basket
{#if localBasket.items.length > 0}
<span class="badge badge-md indicator-item bg-primary text-primary-content"
>{localBasket.items.length}</span
>
{/if}
</a>
</li>
<li><a href="/account">Account</a></li>
<li><a href="/settings">Settings</a></li>
<li><SignOut {supabase} /></li>
{:else}
<MagicLink {supabase} />