You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
78 lines
2.4 KiB
78 lines
2.4 KiB
import Image from "next/image";
|
|
import Link from "next/link";
|
|
|
|
export function Header() {
|
|
return (
|
|
<header
|
|
id="header"
|
|
className="w-full h-[80px] px-6 lg:px-[352px] py-[24px] flex items-center justify-between z-30 relative"
|
|
>
|
|
{/* Logo (Icon_4178_61387: w: 118, h: 32) */}
|
|
<Link
|
|
href="/"
|
|
className="flex items-center gap-[6px] hover:opacity-90 transition-opacity"
|
|
id="nav-logo"
|
|
>
|
|
<div className="relative w-[32px] h-[32px] flex items-center justify-center">
|
|
<Image
|
|
src="/assets/images/logo_icon.svg"
|
|
alt="TeamBy.ai Logo"
|
|
width={32}
|
|
height={32}
|
|
priority
|
|
unoptimized
|
|
className="w-[32px] h-[32px] object-contain"
|
|
/>
|
|
</div>
|
|
<span className="text-[#ffffff] text-[16px] font-medium tracking-tight">
|
|
TeamBy.ai
|
|
</span>
|
|
</Link>
|
|
|
|
{/* Navigation Links (Navigation_4178_61394: gap: 40px) */}
|
|
<nav
|
|
className="hidden md:flex items-center gap-[40px]"
|
|
id="nav-menu"
|
|
aria-label="Main Navigation"
|
|
>
|
|
<Link
|
|
href="#home"
|
|
id="nav-link-home"
|
|
className="text-[#f1eefd] text-[14px] font-normal hover:text-white transition-colors"
|
|
>
|
|
Home
|
|
</Link>
|
|
<Link
|
|
href="#products"
|
|
id="nav-link-products"
|
|
className="text-[#f1eefd] text-[14px] font-normal hover:text-white transition-colors"
|
|
>
|
|
Products
|
|
</Link>
|
|
<Link
|
|
href="#learn"
|
|
id="nav-link-learn"
|
|
className="text-[#f1eefd] text-[14px] font-normal hover:text-white transition-colors"
|
|
>
|
|
Learn
|
|
</Link>
|
|
<Link
|
|
href="#how-it-works"
|
|
id="nav-link-how-it-works"
|
|
className="text-[#f1eefd] text-[14px] font-normal hover:text-white transition-colors"
|
|
>
|
|
How It Work
|
|
</Link>
|
|
</nav>
|
|
|
|
{/* CTA Header Button (Button_4178_61400: w: 118, h: 28, radius: 8) */}
|
|
<Link
|
|
href="#start"
|
|
id="header-cta-button"
|
|
className="btn-primary-gradient w-[118px] h-[28px] rounded-[8px] px-[10px] py-[4px] flex items-center justify-center text-[16px] leading-[20px] font-normal text-white hover:brightness-110 active:scale-95 transition-all"
|
|
>
|
|
<span className="relative z-10">Start for free</span>
|
|
</Link>
|
|
</header>
|
|
);
|
|
}
|