fix: website

Signed-off-by: Ameya Shenoy <shenoy.ameya@gmail.com>
This commit is contained in:
Ameya Shenoy 2025-06-09 12:26:15 +05:30
parent 00628a1876
commit dd641fc5aa
4 changed files with 59 additions and 29 deletions

View file

@ -139,3 +139,7 @@
pointer-events: none;
}
}
* {
cursor: none;
}

View file

@ -0,0 +1,7 @@
export default function NotFound() {
return (
<main className="flex items-center justify-center h-screen">
404 | This page could not be found
</main>
);
}

View file

@ -1,9 +1,10 @@
"use client";
import { useRef, useEffect, FC } from "react";
import { useRef, useEffect, FC, useState } from "react";
import gsap from "gsap";
const GSAPCursor: FC = () => {
const cursorRef = useRef<HTMLDivElement>(null);
const [position, setPosition] = useState({ x: 0, y: 0 });
// For touch devices, return null
if (typeof window !== "undefined" && "ontouchstart" in window) return null;
@ -31,14 +32,32 @@ const GSAPCursor: FC = () => {
};
}, []);
useEffect(() => {
const handleMouseMove = (e: MouseEvent) => {
setPosition({ x: e.clientX, y: e.clientY });
};
window.addEventListener("mousemove", handleMouseMove);
return () => window.removeEventListener("mousemove", handleMouseMove);
}, []);
return (
<div
ref={cursorRef}
className="fixed w-8 h-8 rounded-full border-2 border-dotted border-red-500 bg-transparent pointer-events-none z-50"
style={{
transform: "translate(-50%, -50%)",
}}
/>
<div>
<div
ref={cursorRef}
className="fixed w-8 h-8 rounded-full border-2 border-dotted border-red-500 bg-transparent pointer-events-none z-60"
style={{
transform: "translate(-50%, -50%)",
}}
/>
<div
className="w-2 h-2 rounded-full bg-black dark:bg-white absolute pointer-events-none z-60"
style={{
left: `${position.x}px`,
top: `${position.y}px`,
transform: "translate(-50%, -50%)", // Centers the dot on the cursor
}}
/>
</div>
);
};

View file

@ -11,47 +11,47 @@ import {
export function NavigationMenu() {
return (
<div className="flex justify-center fixed left-1/2 -translate-x-1/2 -translate-y-1/2 bottom-5 md:top-10 md:bottom-auto z-50">
<Button variant="ghost">
<Link href="/">
<div className="flex justify-center fixed left-1/2 -translate-x-1/2 -translate-y-1/2 bottom-5 md:top-10 md:bottom-auto z-20">
<Link href="/">
<Button variant="ghost">
<div className="hidden md:inline">Home</div>
<div className="md:hidden">
<House />
</div>
</Link>
</Button>
<Button variant="ghost">
<Link href="/blog">
</Button>
</Link>
<Link href="/blog">
<Button variant="ghost">
<div className="hidden md:inline">Blog</div>
<div className="md:hidden">
<NotebookPen />
</div>
</Link>
</Button>
<Button variant="ghost">
<Link href="/portfolio">
</Button>
</Link>
<Link href="/portfolio">
<Button variant="ghost">
<div className="hidden md:inline">Portfolio</div>
<div className="md:hidden">
<BriefcaseBusiness />
</div>
</Link>
</Button>
<Button variant="ghost">
<Link href="/talk">
</Button>
</Link>
<Link href="/talk">
<Button variant="ghost">
<div className="hidden md:inline">Talk</div>
<div className="md:hidden">
<MessageCircleMore />
</div>
</Link>
</Button>
<Button variant="ghost">
<Link href="/references">
</Button>
</Link>
<Link href="/references">
<Button variant="ghost">
<div className="hidden md:inline">References</div>
<div className="md:hidden">
<Handshake />
</div>
</Link>
</Button>
</Button>
</Link>
<ModeToggle />
</div>
);