56 lines
1.2 KiB
Vue
56 lines
1.2 KiB
Vue
<template>
|
|
<header class="sticky top-0 z-50 border-b bg-zinc-100 backdrop-blur">
|
|
<div class="container mx-auto flex items-center justify-between px-4 py-4">
|
|
<NuxtLink
|
|
to="/"
|
|
class="text-2xl font-bold text-primary"
|
|
>
|
|
MyStore
|
|
</NuxtLink>
|
|
|
|
<nav class="hidden items-center gap-6 md:flex">
|
|
<NuxtLink
|
|
to="/"
|
|
class="text-sm font-medium text-gray-700 transition hover:text-primary"
|
|
>
|
|
Home
|
|
</NuxtLink>
|
|
|
|
<a
|
|
href="#products"
|
|
class="text-sm font-medium text-gray-700 transition hover:text-primary"
|
|
>
|
|
Products
|
|
</a>
|
|
|
|
<a
|
|
href="#about"
|
|
class="text-sm font-medium text-gray-700 transition hover:text-primary"
|
|
>
|
|
About
|
|
</a>
|
|
|
|
<a
|
|
href="#contact"
|
|
class="text-sm font-medium text-gray-700 transition hover:text-primary"
|
|
>
|
|
Contact
|
|
</a>
|
|
</nav>
|
|
|
|
<div class="flex items-center gap-3">
|
|
<UButton
|
|
color="neutral"
|
|
variant="ghost"
|
|
>
|
|
Login
|
|
</UButton>
|
|
|
|
<UButton>
|
|
Get Started
|
|
</UButton>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
</template>
|