add
This commit is contained in:
@@ -35,6 +35,9 @@ export default function Home() {
|
||||
<section id="features">
|
||||
<UseCases />
|
||||
</section>
|
||||
<section id="clickable-gallery">
|
||||
<ClickableGallery />
|
||||
</section>
|
||||
<section id="get-started">
|
||||
<GetStarted />
|
||||
</section>
|
||||
|
@@ -1,7 +1,6 @@
|
||||
import { type Metadata } from 'next'
|
||||
import { Mulish } from 'next/font/google'
|
||||
import clsx from 'clsx'
|
||||
import SmoothScrollProvider from '@/components/SmoothScrollProvider'
|
||||
|
||||
import '@/styles/tailwind.css'
|
||||
|
||||
@@ -27,7 +26,7 @@ export default function RootLayout({
|
||||
}) {
|
||||
return (
|
||||
<html lang="en" className={clsx('antialiased', mulish.variable)}>
|
||||
<body className="bg-black text-white"><SmoothScrollProvider>{children}</SmoothScrollProvider></body>
|
||||
<body className="bg-black text-white">{children}</body>
|
||||
</html>
|
||||
)
|
||||
}
|
||||
|
@@ -8,6 +8,20 @@ export function NavLinks() {
|
||||
let [hoveredIndex, setHoveredIndex] = useState<number | null>(null)
|
||||
let timeoutRef = useRef<number | null>(null)
|
||||
|
||||
const handleClick = (e: React.MouseEvent<HTMLAnchorElement>, href: string) => {
|
||||
if (href.startsWith('/#')) {
|
||||
e.preventDefault();
|
||||
const targetId = href.substring(2);
|
||||
const targetElement = document.getElementById(targetId);
|
||||
|
||||
if (targetElement) {
|
||||
targetElement.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return [
|
||||
['About', '/#about'],
|
||||
['Network', '/#network'],
|
||||
@@ -20,6 +34,7 @@ export function NavLinks() {
|
||||
key={label}
|
||||
href={href}
|
||||
className="relative -mx-3 -my-2 rounded-lg px-3 py-2 text-sm text-white transition-colors delay-150 hover:text-gray-300 hover:delay-0"
|
||||
onClick={(e) => handleClick(e, href)}
|
||||
onMouseEnter={() => {
|
||||
if (timeoutRef.current) {
|
||||
window.clearTimeout(timeoutRef.current)
|
||||
|
@@ -1,8 +0,0 @@
|
||||
'use client'
|
||||
|
||||
import { useSmoothScroll } from '@/hooks/use-smooth-scroll';
|
||||
|
||||
export default function SmoothScrollProvider({ children }: { children: React.ReactNode }) {
|
||||
useSmoothScroll();
|
||||
return <>{children}</>;
|
||||
}
|
@@ -1,28 +0,0 @@
|
||||
import { useEffect } from 'react';
|
||||
|
||||
export const useSmoothScroll = () => {
|
||||
useEffect(() => {
|
||||
const handleLinkClick = (e: MouseEvent) => {
|
||||
const target = e.target as HTMLAnchorElement;
|
||||
const href = target.getAttribute('href');
|
||||
|
||||
if (href && href.startsWith('#')) {
|
||||
e.preventDefault();
|
||||
const targetId = href.substring(1);
|
||||
const targetElement = document.getElementById(targetId);
|
||||
|
||||
if (targetElement) {
|
||||
targetElement.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener('click', handleLinkClick);
|
||||
|
||||
return () => {
|
||||
document.removeEventListener('click', handleLinkClick);
|
||||
};
|
||||
}, []);
|
||||
};
|
Reference in New Issue
Block a user