Files
dcorya/src/components/Header.tsx
T
Alireza HassaniandCursor 3576052f9d Polish header icon alignment and banner hover overlays.
Align cart with search/profile controls and show banner slot text only on hover.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-09-30 10:58:28 +03:30

71 lines
2.4 KiB
TypeScript

import Image from "next/image";
import Link from "next/link";
import CartPopover from "./CartPopover";
import ProfileMenu from "./ProfileMenu";
import ProductsMegaMenu from "./ProductsMegaMenu";
import { buildCategoryTree } from "@/lib/categories";
import { meshkee } from "@/lib/meshkee";
const navLinks = [
{ href: "/blog", label: "بلاگ" },
{ href: "/satisfaction", label: "مشتریان راضی" },
{ href: "/purchaseguide", label: "راهنمای خرید" },
];
export default async function Header() {
const categoriesRes = await meshkee.getCategories("product").catch(() => ({ items: [] }));
const categories = buildCategoryTree(categoriesRes.items);
return (
<header className="relative sticky top-0 z-50 h-16 border-b border-black/10 bg-white shadow-[0_2px_10px_rgba(0,0,0,0.06)]">
<div className="mx-auto flex h-full max-w-7xl items-center justify-between gap-6 px-4 sm:px-6 lg:px-8">
<Link href="/" className="shrink-0">
<Image
src="/images/logo.png"
alt="دکوریا"
width={110}
height={36}
priority
className="h-9 w-auto"
/>
</Link>
<nav className="hidden items-center gap-7 lg:flex">
<Link
href="/"
className="text-sm font-medium text-neutral-700 transition-colors hover:text-primary"
>
صفحه اصلی
</Link>
<ProductsMegaMenu categories={categories} />
{navLinks.map((link) => (
<Link
key={link.label}
href={link.href}
className="text-sm font-medium text-neutral-700 transition-colors hover:text-primary"
>
{link.label}
</Link>
))}
</nav>
<div className="flex items-center gap-5">
<button
aria-label="جستجو"
className="inline-flex h-9 w-9 items-center justify-center text-neutral-600 transition-colors hover:text-primary"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" className="h-5 w-5">
<circle cx="11" cy="11" r="7" stroke="currentColor" strokeWidth="1.8" />
<path d="m20 20-3.5-3.5" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
</svg>
</button>
<CartPopover />
<ProfileMenu />
</div>
</div>
</header>
);
}