@@ -0,0 +1,71 @@
|
||||
<template>
|
||||
<footer class="border-t bg-white">
|
||||
<div class="container mx-auto grid gap-10 px-4 py-12 md:grid-cols-4">
|
||||
<div>
|
||||
<h2 class="mb-4 text-2xl font-bold">
|
||||
MyStore
|
||||
</h2>
|
||||
|
||||
<p class="text-sm text-gray-600">
|
||||
Modern e-commerce platform built with Nuxt 4 and Nuxt UI.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 class="mb-4 font-semibold">
|
||||
Company
|
||||
</h3>
|
||||
|
||||
<ul class="space-y-2 text-sm text-gray-600">
|
||||
<li>
|
||||
<a href="#">About</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">Careers</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">Blog</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 class="mb-4 font-semibold">
|
||||
Support
|
||||
</h3>
|
||||
|
||||
<ul class="space-y-2 text-sm text-gray-600">
|
||||
<li>
|
||||
<a href="#">Help Center</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">Terms</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="#">Privacy</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 class="mb-4 font-semibold">
|
||||
Contact
|
||||
</h3>
|
||||
|
||||
<ul class="space-y-2 text-sm text-gray-600">
|
||||
<li>Email: hello@mystore.com</li>
|
||||
<li>Phone: +62 812 3456 7890</li>
|
||||
<li>Indonesia</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="border-t py-4 text-center text-sm text-gray-500">
|
||||
© 2026 MyStore. All rights reserved.
|
||||
</div>
|
||||
</footer>
|
||||
</template>
|
||||
@@ -0,0 +1,55 @@
|
||||
<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>
|
||||
Reference in New Issue
Block a user