76 lines
4.3 KiB
TypeScript
76 lines
4.3 KiB
TypeScript
import Link from "next/link";
|
|
import { cn } from "@/lib/utils"
|
|
|
|
|
|
const Break = ()=> <hr className={cn("w-100")}></hr>
|
|
|
|
// const Navbar = () => {
|
|
// return (
|
|
// <div className={cn("bg-666666 pt-1 pb-1")}>
|
|
// <Break/>
|
|
// <div className={cn("flex h-20 text-white justify-around items-center")}>
|
|
// <Link href="/">
|
|
// <div>Home</div>
|
|
// </Link>
|
|
// <Link href="/blog">
|
|
// <div>Blog</div>
|
|
// </Link>
|
|
// <Link href="/tools">
|
|
// <div>Tools</div>
|
|
// </Link>
|
|
// <Link href="/demos">
|
|
// <div>Demos</div>
|
|
// </Link>
|
|
// <Link href="/login">
|
|
// <div>Login</div>
|
|
// </Link>
|
|
// <br></br>
|
|
// </div>
|
|
// <Break/>
|
|
// </div>
|
|
// );
|
|
// }
|
|
|
|
|
|
|
|
const Navbar = ()=>{
|
|
return(
|
|
<div className={cn("bg-666666 pt-1 pb-1")}>
|
|
<Break/>
|
|
<nav className="flex items-center justify-between flex-wrap bg-666666 p-6">
|
|
<div className="flex items-center flex-shrink-0 text-white mr-6">
|
|
<svg className="fill-current h-8 w-8 mr-2" width="54" height="54" viewBox="0 0 110 108" xmlns="http://www.w3.org/2000/svg"><path fill="#817e6f" stroke="#817e6f" d="M44.041 3.733C19.347 8.36 1.002 35.479 4.889 61.612c6.132 41.231 55.737 58.121 86.414 29.423 28.694-26.841 16.128-76.613-21.838-86.502-5.508-1.435-19.66-1.88-25.424-.8" fillRule="evenodd"/><path fill="#4f4b42" stroke="#4f4b42" d="M29.315 46.985C22.272 49.893 24.796 61 32.5 61c3.81 0 7.5-3.702 7.5-7.524 0-4.839-5.941-8.448-10.685-6.491M77 46.709C69.367 49.516 70.885 61 78.889 61c7.002 0 10.016-8.104 4.712-12.667-2.736-2.354-3.862-2.631-6.601-1.624m-57.403 6.135c-.346.56-.142 1.319.453 1.687 1.538.95 2.53-.351 1.246-1.635-.718-.718-1.277-.735-1.699-.052m23.986.022c-.431.697-.513 1.537-.183 1.867.895.895 1.871-.421 1.387-1.871-.338-1.016-.574-1.016-1.204.004M66 54c0 .55.675 1 1.5 1s1.5-.45 1.5-1-.675-1-1.5-1-1.5.45-1.5 1m23.5 0c.34.55 1.041 1 1.559 1s.941-.45.941-1-.702-1-1.559-1-1.281.45-.941 1" fillRule="evenodd"/></svg>
|
|
<span className="font-semibold text-xl tracking-tight">Wretched Machines</span>
|
|
</div>
|
|
<div className="block lg:hidden">
|
|
<button className="flex items-center px-3 py-2 border rounded text-gray-200 border-gray-400 hover:text-white hover:border-white">
|
|
<svg className="fill-current h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><title>Menu</title><path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"/></svg>
|
|
</button>
|
|
</div>
|
|
<div className="w-full block flex-grow lg:flex lg:items-center lg:w-auto">
|
|
<div className="text-md lg:flex-grow">
|
|
<Link href="/" className="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white mr-4">
|
|
Home
|
|
</Link>
|
|
<Link href="/blog" className="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white mr-4">
|
|
Blog
|
|
</Link>
|
|
<Link href="/tools" className="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white mr-4">
|
|
Tools
|
|
</Link>
|
|
<Link href="/demos" className="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white mr-4">
|
|
Demos
|
|
</Link>
|
|
</div>
|
|
<div>
|
|
<Link href="/login" className="inline-block text-sm px-4 py-2 leading-none border rounded text-white border-white hover:border-transparent hover:text-teal-500 hover:bg-white mt-4 lg:mt-0">Login</Link>
|
|
<Link href="/register" className="inline-block text-sm px-4 py-2 leading-none border rounded text-white border-white hover:border-transparent hover:text-teal-500 hover:bg-white mt-4 lg:mt-0">Register</Link>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<Break/>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Navbar; |