Merge version_26_1778236318310 into main
Merge version_26_1778236318310 into main
This commit was merged in pull request #24.
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import { useState, useEffect, useRef } from "react";
|
||||
|
||||
import { Plus, ArrowRight } from "lucide-react";
|
||||
import { Plus, ArrowRight } from "lucide-react";
|
||||
import { cls } from "@/lib/utils";
|
||||
import Button from "@/components/ui/Button";
|
||||
@@ -89,46 +90,46 @@ const NavbarCentered = ({ logo, navItems, ctaButton }: NavbarCenteredProps) => {
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
{menuOpen && (
|
||||
<div
|
||||
ref={menuRef}
|
||||
|
||||
className="md:hidden fixed z-1000 top-3 left-3 right-3 p-6 rounded-lg bg-background/80 backdrop-blur-[2px]"
|
||||
>
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<p className="text-xl text-foreground">Menu</p>
|
||||
<button
|
||||
className="flex items-center justify-center shrink-0 size-9 rounded cursor-pointer primary-button"
|
||||
onClick={() => setMenuOpen(false)}
|
||||
aria-label="Close menu"
|
||||
>
|
||||
<Plus className="w-1/2 h-1/2 text-primary-cta-text rotate-45" strokeWidth={1.5} />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-4">
|
||||
{navItems.map((item, index) => (
|
||||
<div key={item.name}>
|
||||
<a
|
||||
href={item.href}
|
||||
onClick={(e) => handleNavClick(e, item.href, () => setMenuOpen(false))}
|
||||
className="flex items-center justify-between py-2 text-base font-medium text-foreground"
|
||||
>
|
||||
{item.name}
|
||||
<ArrowRight className="size-4 text-foreground" strokeWidth={1.5} />
|
||||
</a>
|
||||
{index < navItems.length - 1 && (
|
||||
<div className="h-px bg-linear-to-r from-transparent via-foreground/20 to-transparent" />
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="mt-6">
|
||||
<Button text={ctaButton.text} href={ctaButton.href} variant="primary" animate={false} className="w-full" />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
ref={menuRef}
|
||||
className={cls(
|
||||
"md:hidden fixed z-1000 top-3 left-3 right-3 p-6 rounded-lg bg-background/80 backdrop-blur-[2px] transition-all duration-300 ease-in-out",
|
||||
menuOpen ? "opacity-100 translate-y-0" : "opacity-0 -translate-y-4 pointer-events-none"
|
||||
)}
|
||||
>
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<p className="text-xl text-foreground">Menu</p>
|
||||
<button
|
||||
className="flex items-center justify-center shrink-0 size-9 rounded cursor-pointer primary-button"
|
||||
onClick={() => setMenuOpen(false)}
|
||||
aria-label="Close menu"
|
||||
>
|
||||
<Plus className="w-1/2 h-1/2 text-primary-cta-text rotate-45" strokeWidth={1.5} />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-4">
|
||||
{navItems.map((item, index) => (
|
||||
<div key={item.name}>
|
||||
<a
|
||||
href={item.href}
|
||||
onClick={(e) => handleNavClick(e, item.href, () => setMenuOpen(false))}
|
||||
className="flex items-center justify-between py-2 text-base font-medium text-foreground"
|
||||
>
|
||||
{item.name}
|
||||
<ArrowRight className="size-4 text-foreground" strokeWidth={1.5} />
|
||||
</a>
|
||||
{index < navItems.length - 1 && (
|
||||
<div className="h-px bg-linear-to-r from-transparent via-foreground/20 to-transparent" />
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="mt-6">
|
||||
<Button text={ctaButton.text} href={ctaButton.href} variant="primary" animate={false} className="w-full" />
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user