139 lines
4.6 KiB
TypeScript
139 lines
4.6 KiB
TypeScript
import Link from "next/link";
|
|
|
|
export default function Nav() {
|
|
return (
|
|
<section className="bg-gray-900">
|
|
<nav className="container mx-auto px-4 relative px-6 py-6 flex justify-between items-center">
|
|
<Link
|
|
className="text-white text-3xl font-bold leading-none flex align-middle"
|
|
href="/"
|
|
>
|
|
<img className="h-12 inline" src="/logo2.svg" alt="" width="auto" />
|
|
<h1 className="ml-4 leading-loose">P4Pillon</h1>
|
|
</Link>
|
|
<div className="lg:hidden">
|
|
<button className="navbar-burger flex items-center text-white p-3">
|
|
<svg
|
|
className="block h-4 w-4 fill-current"
|
|
viewBox="0 0 20 20"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<title>Mobile menu</title>
|
|
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<ul className="hidden absolute top-1/2 left-1/2 transform -translate-y-1/2 -translate-x-1/2 lg:flex lg:mx-auto lg:flex lg:items-center lg:w-auto lg:space-x-6">
|
|
<li>
|
|
<Link
|
|
className="text-sm text-gray-300 hover:text-white"
|
|
href="/#concepts"
|
|
>
|
|
Concepts
|
|
</Link>
|
|
</li>
|
|
<li className="text-gray-800">
|
|
<svg
|
|
className="w-4 h-4 current-fill"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"
|
|
/>
|
|
</svg>
|
|
</li>
|
|
<li>
|
|
<Link className="text-sm text-white font-bold" href="/#projects">
|
|
Projets
|
|
</Link>
|
|
</li>
|
|
<li className="text-gray-800">
|
|
<svg
|
|
className="w-4 h-4 current-fill"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"
|
|
/>
|
|
</svg>
|
|
</li>
|
|
<li>
|
|
<Link
|
|
className="text-sm text-gray-300 hover:text-white"
|
|
href="/#roadmap"
|
|
>
|
|
La SCIC
|
|
</Link>
|
|
</li>
|
|
<li className="text-gray-800">
|
|
<svg
|
|
className="w-4 h-4 current-fill"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"
|
|
/>
|
|
</svg>
|
|
</li>
|
|
<li>
|
|
<Link
|
|
className="text-sm text-gray-300 hover:text-white"
|
|
href="/blog"
|
|
>
|
|
Blog
|
|
</Link>
|
|
</li>
|
|
{/* <li className="text-gray-800">
|
|
<svg
|
|
className="w-4 h-4 current-fill"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"
|
|
/>
|
|
</svg>
|
|
</li>
|
|
<li>
|
|
<a
|
|
className="text-sm text-gray-300 hover:text-white"
|
|
href="https://staging.p4pillon.org/annuaire/#45.55349,2.02698,10z"
|
|
>
|
|
Annuaire
|
|
</a>
|
|
</li> */}
|
|
</ul>
|
|
<a
|
|
className="hidden lg:inline-block py-2 px-6 bg-pink-500 hover:bg-pink-600 text-sm text-white font-bold rounded-l-xl rounded-t-xl transition duration-200"
|
|
href="https://apps.p4pillon.org/"
|
|
>
|
|
Se connecter
|
|
</a>
|
|
</nav>
|
|
</section>
|
|
);
|
|
}
|