veda/www_veda_2025
12
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ok

Browse Source
This commit is contained in:
sasha-astiadi
2025-08-22 16:13:46 +02:00
parent 63066996a5
commit 9af7391564
4 changed files with 41 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/Header.jsx
View File

@@ -53,18 +53,18 @@ function MobileNavigation() {
return (
<Popover>
<PopoverButton
className="relative z-10 flex h-6 w-6 items-center justify-center ui-not-focus-visible:outline-none"
className="relative z-50 flex h-8 w-8 items-center justify-center ui-not-focus-visible:outline-none"
aria-label="Toggle Navigation"
>
{({ open }) => <MobileNavIcon open={open} />}
</PopoverButton>
<PopoverBackdrop
transition
className="fixed inset-0 bg-slate-50/50 duration-150 data-[closed]:opacity-0 data-[enter]:ease-out data-[leave]:ease-in"
className="fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm duration-150 data-[closed]:opacity-0 data-[enter]:ease-out data-[leave]:ease-in"
/>
<PopoverPanel
transition
className="absolute inset-x-0 top-full mt-4 flex origin-top flex-col rounded-lg bg-bg-sand p-4 text-lg tracking-tight text-nav-dark shadow-xl ring-1 ring-slate-900/5 data-[closed]:scale-95 data-[closed]:opacity-0 data-[enter]:duration-150 data-[leave]:duration-100 data-[enter]:ease-out data-[leave]:ease-in"
className="absolute inset-x-0 top-full z-50 mt-4 flex origin-top flex-col rounded-lg bg-bg-sand border border-slate-200/20 p-4 text-lg tracking-tight text-nav-dark shadow-xl ring-1 ring-slate-900/5 data-[closed]:scale-95 data-[closed]:opacity-0 data-[enter]:duration-150 data-[leave]:duration-100 data-[enter]:ease-out data-[leave]:ease-in"
>
<MobileNavLink href="/">HOME</MobileNavLink>
<MobileNavLink href="/story">STORY</MobileNavLink>
@@ -80,14 +80,14 @@ function MobileNavigation() {
export function Header() {
return (
<header className="fixed top-0 left-0 right-0 z-50 bg-bg-sand backdrop-blur-sm py-4">
<header className="fixed top-0 left-0 right-0 z-50 bg-bg-sand/95 backdrop-blur-sm border-b border-slate-200/20 shadow-sm">
<Container>
<nav className="relative z-50 flex justify-between">
<div className="flex items-center md:gap-x-12">
<Link href="/" aria-label="Home" className="overflow-visible">
<Logo className="h-8 w-auto max-w-none sm:h-9 md:h-10 lg:h-11 xl:h-12" />
<nav className="relative z-50 flex items-center justify-between py-3 lg:py-4">
<div className="flex items-center md:gap-x-8 lg:gap-x-12">
<Link href="/" aria-label="Home" className="overflow-visible flex-shrink-0">
<Logo className="h-7 w-auto max-w-none sm:h-8 md:h-9 lg:h-10" />
</Link>
<div className="hidden md:flex md:gap-x-6">
<div className="hidden md:flex md:gap-x-4 lg:gap-x-6">
<NavLink href="/">HOME</NavLink>
<NavLink href="/story">STORY</NavLink>
<NavLink href="/experiences">EXPERIENCES</NavLink>
@@ -95,13 +95,13 @@ export function Header() {
<NavLink href="/itinerary">ITINERARY</NavLink>
</div>
</div>
<div className="flex items-center gap-x-5 md:gap-x-8">
<Button href="/contact" variant="solidNoRounded" color="bookNow">
<span className="tracking-wide">
<div className="flex items-center gap-x-3 md:gap-x-4">
<Button href="/contact" variant="solidNoRounded" color="bookNow" className="text-xs sm:text-sm">
<span className="tracking-wide font-medium">
Book Now
</span>
</Button>
<div className="-mr-1 md:hidden">
<div className="md:hidden">
<MobileNavigation />
</div>
</div>