o2o-infinith-demo/src/components/Navbar.tsx

25 lines
1.2 KiB
TypeScript

import { Link } from 'react-router';
import { motion } from 'motion/react';
export default function Navbar() {
return (
<nav className="fixed top-0 left-0 right-0 z-50 bg-white/95 border-b border-slate-100">
<div className="max-w-7xl mx-auto px-6 h-20 flex items-center justify-between">
<Link to="/" className="flex items-center gap-2">
<span className="font-serif text-3xl font-black tracking-[0.05em] bg-gradient-to-r from-[#4F1DA1] to-[#021341] bg-clip-text text-transparent">INFINITH</span>
</Link>
<div className="hidden md:flex items-center gap-8 text-sm font-medium text-slate-600">
<a href="#solution" className="hover:text-primary-900 transition-colors">Solution</a>
<a href="#modules" className="hover:text-primary-900 transition-colors">Modules</a>
<a href="#use-cases" className="hover:text-primary-900 transition-colors">Use Cases</a>
</div>
<div className="flex items-center gap-4">
<button className="px-6 py-3 text-sm font-medium text-white rounded-full transition-all shadow-sm hover:shadow-md bg-gradient-to-r from-[#4F1DA1] to-[#021341] hover:opacity-90">
Login
</button>
</div>
</div>
</nav>
);
}