43 lines
1.5 KiB
HTML
43 lines
1.5 KiB
HTML
<header>
|
|
<nav
|
|
class="bg-gray-50 wrapper py-4 flex gap-x-5 sm:gap-x-10 items-center shadow-lg shadow-gray-400/20"
|
|
>
|
|
<div class="">
|
|
<a href="/" class="px-3 py-1 bg-gray-800 text-white">eKart</a>
|
|
</div>
|
|
|
|
<div class="flex-1 grid grid-cols-[1fr_auto]">
|
|
<input
|
|
type="text"
|
|
class="w-full border border-gray-300 text-sm rounded-full rounded-r-none px-6 py-1"
|
|
placeholder="Search watches, brands, products..."
|
|
/>
|
|
<button class="btn btn-ghost rounded-l-none! py-1 px-3 border-l-0!">
|
|
<lucide-angular [img]="SearchIcon" class="w-5" />
|
|
</button>
|
|
</div>
|
|
|
|
<div class="flex space-x-4">
|
|
<div class="flex text-gray-600">
|
|
<button
|
|
popovertarget="popover-1"
|
|
style="anchor-name: --anchor-1"
|
|
class="btn btn-ghost py-1 px-2 rounded-r-none!"
|
|
>
|
|
<lucide-angular [img]="UserIcon" class="w-5" />
|
|
</button>
|
|
<button class="btn btn-ghost py-1 px-2 rounded-l-none! border-l-0!">
|
|
<lucide-angular [img]="CartIcon" class="w-5" />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<ul class="dropdown" popover id="popover-1" style="position-anchor: --anchor-1">
|
|
<li><a routerLink="/login" class="block h-full w-full" href="">Login</a></li>
|
|
<li><a class="block h-full w-full" href="">My Account</a></li>
|
|
<li><a class="block h-full w-full" href="">Orders</a></li>
|
|
<li><a class="block h-full w-full" href="">Wishlist</a></li>
|
|
<li><a class="block h-full w-full" href="">Notifications</a></li>
|
|
</ul>
|
|
</header>
|