bender/5c693b3c-de57-466b-a834-0a99b3a016be
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2_1776779127540 into main #4

Merged
bender merged 1 commits from version_2_1776779127540 into main 2026-04-21 13:48:32 +00:00
Conversation 0 Commits 1 Files Changed 2 +13 -13
2 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/App.tsx
View File

@@ -11,7 +11,7 @@ import TestimonialMetricsCards from '@/components/sections/testimonial/Testimoni
export default function App() {
return (
<>
<div className="pt-24">
<div id="nav" data-section="nav">
<NavbarCentered
logo="IT Academy"
@@ -168,6 +168,6 @@ export default function App() {
]}
/>
</div>
</>
</div>
);
}

22
src/components/ui/NavbarCentered.tsx
View File

@@ -59,19 +59,19 @@ const NavbarCentered = ({ logo, navItems, ctaButton }: NavbarCenteredProps) => {
<>
<nav
className={cls(
"fixed z-1000 top-0 left-0 w-full transition-all duration-500 ease-in-out",
isScrolled ? "h-15 bg-background/80 backdrop-blur-sm" : "h-20 bg-background/0 backdrop-blur-0"
"fixed z-50 top-4 left-1/2 -translate-x-1/2 rounded-full shadow-lg px-6 md:px-8 py-3 backdrop-blur-xl bg-white/10 border border-white/20 transition-all duration-500 ease-in-out w-[calc(100%-2rem)] md:w-auto",
isScrolled ? "bg-white/15 shadow-xl" : ""
)}
>
<div className="relative flex items-center justify-between h-full w-content-width mx-auto">
<Link to="/" className="text-xl font-medium text-foreground">{logo}</Link>
<div className="flex items-center justify-between md:justify-center gap-4 md:gap-8">
<Link to="/" className="text-xl font-medium text-foreground whitespace-nowrap">{logo}</Link>
<div className="hidden md:flex absolute left-1/2 items-center gap-6 -translate-x-1/2">
<div className="hidden md:flex items-center gap-6">
{navItems.map((item) => (
<NavLink
key={item.name}
href={item.href}
className="text-base text-foreground hover:opacity-70 transition-opacity"
className="text-base text-foreground hover:opacity-70 transition-opacity whitespace-nowrap"
>
{item.name}
</NavLink>
@@ -83,7 +83,7 @@ const NavbarCentered = ({ logo, navItems, ctaButton }: NavbarCenteredProps) => {
</div>
<button
className="flex md:hidden items-center justify-center shrink-0 h-8 w-8 bg-foreground rounded cursor-pointer"
className="flex md:hidden items-center justify-center shrink-0 h-8 w-8 bg-foreground rounded-full cursor-pointer"
onClick={() => setMenuOpen(!menuOpen)}
aria-label="Toggle menu"
aria-expanded={menuOpen}
@@ -103,12 +103,12 @@ const NavbarCentered = ({ logo, navItems, ctaButton }: NavbarCenteredProps) => {
animate={{ y: 0 }}
exit={{ y: "-135%" }}
transition={{ type: "spring", damping: 26, stiffness: 170 }}
className="md:hidden fixed z-1000 top-3 left-3 right-3 p-6 card rounded"
className="md:hidden fixed z-50 top-20 left-4 right-4 p-6 card rounded-2xl border border-white/10 shadow-2xl backdrop-blur-xl"
>
<div className="flex items-center justify-between mb-6">
<p className="text-xl text-foreground">Menu</p>
<p className="text-xl text-foreground font-medium">Menu</p>
<button
className="flex items-center justify-center shrink-0 h-8 w-8 bg-foreground rounded cursor-pointer"
className="flex items-center justify-center shrink-0 h-8 w-8 bg-foreground rounded-full cursor-pointer"
onClick={() => setMenuOpen(false)}
aria-label="Close menu"
>
@@ -144,4 +144,4 @@ const NavbarCentered = ({ logo, navItems, ctaButton }: NavbarCenteredProps) => {
);
};
export default NavbarCentered;
export default NavbarCentered;