diff --git a/src/app/layout.tsx b/src/app/layout.tsx index fa13d5d..cf9047d 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -48,7 +48,7 @@ export default async function RootLayout({ -
+
{children} diff --git a/src/app/page.tsx b/src/app/page.tsx index 0005f77..525c384 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -264,9 +264,6 @@ export default function Home(): ReactNode { return ( <>
-
-
-

Project Library

diff --git a/src/hooks/use-mobile.ts b/src/hooks/use-mobile.ts index 2b0fe1d..39849ca 100644 --- a/src/hooks/use-mobile.ts +++ b/src/hooks/use-mobile.ts @@ -3,17 +3,17 @@ import * as React from "react" const MOBILE_BREAKPOINT = 768 export function useIsMobile() { - const [isMobile, setIsMobile] = React.useState(undefined) + const [isMobile, setIsMobile] = React.useState(undefined) - React.useEffect(() => { - const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`) - const onChange = () => { - setIsMobile(window.innerWidth < MOBILE_BREAKPOINT) - } - mql.addEventListener("change", onChange) - setIsMobile(window.innerWidth < MOBILE_BREAKPOINT) - return () => mql.removeEventListener("change", onChange) - }, []) + React.useEffect(() => { + const onResize = () => { + setIsMobile(window.innerWidth < MOBILE_BREAKPOINT) + console.log("resize"); + }; + window.addEventListener("resize", onResize) + setIsMobile(window.innerWidth < MOBILE_BREAKPOINT) + return () => window.removeEventListener("resize", onResize) + }, []); - return !!isMobile + return !!isMobile }