39443-vm/frontend/src/components/PublicSiteHeader.tsx
2026-04-04 15:53:16 +00:00

42 lines
1.5 KiB
TypeScript

import Link from 'next/link';
import React from 'react';
import BaseButton from './BaseButton';
import { webPagesNavBar } from '../menuNavBar';
type Props = {
title?: string;
subtitle?: string;
};
export default function PublicSiteHeader({
title = 'Gracey Corporate Stay Portal',
subtitle = 'Corporate stay operations',
}: Props) {
return (
<header className="sticky top-0 z-30 border-b border-slate-200/80 bg-white/90 backdrop-blur">
<div className="mx-auto flex max-w-6xl items-center justify-between gap-4 px-6 py-4 lg:px-10">
<Link href="/" className="min-w-0">
<div className="text-[11px] font-medium uppercase tracking-[0.28em] text-slate-500">{subtitle}</div>
<div className="truncate text-base font-semibold text-slate-950 md:text-lg">{title}</div>
</Link>
<div className="hidden items-center gap-6 md:flex">
<nav className="flex items-center gap-5 text-sm text-slate-600">
{webPagesNavBar.map((item) => (
<Link key={item.href || item.label} href={item.href || '/'} className="transition-colors hover:text-slate-950">
{item.label}
</Link>
))}
</nav>
<div className="flex items-center gap-3">
<BaseButton href="/login" color="whiteDark" label="Login" small />
<BaseButton href="/command-center" color="info" label="Open workspace" small />
</div>
</div>
</div>
</header>
);
}