This commit is contained in:
Emre
2025-10-11 00:33:25 +03:00
parent f450d61ccf
commit 60fa49c0ef
5 changed files with 90 additions and 93 deletions

View File

@@ -4,9 +4,8 @@ import { motion, AnimatePresence } from 'framer-motion';
import { cn } from '../../lib/cn';
const navItems = [
{ label: 'Home', to: '/' },
{ label: 'About', to: '/about' },
{ label: 'Technology', to: '/technology' },
{ label: 'Solutions', to: '/technology' },
{ label: 'Use Cases', to: '/usecases' },
];
@@ -36,36 +35,38 @@ export const Header = () => {
isScrolled ? 'bg-mist/95 shadow-lg backdrop-blur-sm' : 'bg-transparent',
)}
>
<div className="mx-auto flex max-w-6xl items-center justify-between px-6 py-4 lg:px-8">
<Link to="/" className="flex items-center">
<img
src="/images/geomind_logo.png"
alt="Geomind logo"
className="h-12 w-auto object-contain"
/>
</Link>
<nav className="hidden items-center gap-8 md:flex">
{navItems.map(({ label, to }) => (
<NavLink
key={to}
to={to}
className={({ isActive }) =>
cn(
'text-sm font-medium uppercase tracking-wide text-slate-500 transition-colors duration-300',
isActive && 'text-brand-600',
)
}
>
{label}
</NavLink>
))}
<a
href="mailto:support@threefold.tech"
className="rounded-full border border-brand-200 bg-white px-4 py-2 text-sm font-semibold text-brand-700 shadow-subtle transition-all duration-300 hover:-translate-y-0.5 hover:border-brand-700 hover:bg-brand-700 hover:text-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-300 focus-visible:ring-offset-2"
>
Contact
</a>
</nav>
<div className="mx-auto flex max-w-6xl items-center justify-between py-4">
<div className="flex items-center gap-8">
<Link to="/" className="flex items-center">
<img
src="/images/geomind_logo.png"
alt="Geomind logo"
className="h-8 w-auto object-contain"
/>
</Link>
<nav className="hidden items-center gap-8 md:flex">
{navItems.map(({ label, to }) => (
<NavLink
key={to}
to={to}
className={({ isActive }) =>
cn(
'text-sm font-medium uppercase tracking-wide text-slate-500 transition-colors duration-300',
isActive && 'text-brand-600',
)
}
>
{label}
</NavLink>
))}
</nav>
</div>
<a
href="mailto:support@threefold.tech"
className="rounded-full border border-brand-200 bg-white px-4 py-2 text-sm font-semibold text-brand-700 shadow-subtle transition-all duration-300 hover:-translate-y-0.5 hover:border-brand-700 hover:bg-brand-700 hover:text-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-300 focus-visible:ring-offset-2"
>
Contact
</a>
<button
type="button"
aria-label="Toggle navigation"