logo

components/Navbar.tsx

@@ -2,11 +2,12 @@ import Link from "next/link";
 import { IoMenu as MenuIcon, IoClose as CloseIcon } from "react-icons/io5";
 import { useState } from "react";
 import { motion, AnimatePresence } from "framer-motion";
+import { Logo } from "./Logo";
 
 const links = [
   { name: "blog", href: "/blog" },
   { name: "projects", href: "/projects" },
-  { name: "github", href: "https://github.com/kookroach" },
+  { name: "github", href: "https://git.peroxy.dev/kookroach" },
 ];
 export const Navbar = () => {
   const [showMenu, setShowMenu] = useState(false);
@@ -16,9 +17,13 @@ export const Navbar = () => {
       <Link
         href="/"
         id="logo"
-        className="flex flex-row gap-2 items-end transition-all ease-in duration-100 text-action hover:text-secondary"
+        className="flex flex-row gap-2 items-center group"
       >
-        <div className="font-bold text-4xl font-mono">peroxy</div>
+        <Logo />
+        <div className="font-bold text-4xl font-mono transition-all ease-in duration-100 text-action group-hover:text-secondary">
+          peroxy
+          <span className="text-sm">.dev</span>
+        </div>
       </Link>
       <div className="hidden lg:flex flex-row gap-10 items-center font-medium font-mono">
         {links.map(({ name, href }) => (