diff --git a/src/Screens/Home.tsx b/src/Screens/Home.tsx index 4e19159..ce6baa5 100644 --- a/src/Screens/Home.tsx +++ b/src/Screens/Home.tsx @@ -4,9 +4,13 @@ import AnimatedBackground from '../Components/AnimatedBackground' import Cursor from '../Components/Cursor' import Parallax from '../Components/Parallax' import Letters from '../Screens/Letters' +import { useInnerWindowSize } from '../util' const Home: React.FC = () => { - return
+ + const {height, width} = useInnerWindowSize() + + return

diff --git a/src/util.ts b/src/util.ts index af04793..7cf6623 100644 --- a/src/util.ts +++ b/src/util.ts @@ -1,5 +1,22 @@ import { useEffect, useState } from 'react' +type Size = { width: number, height: number } +export const useInnerWindowSize = (): Size => { + const getCurrentSize = (): Size => ({ + height: window.innerHeight, + width: window.innerWidth, + }) + + let [size, setSize] = useState(getCurrentSize) + + useEffect(() => { + const handle = () => setSize(getCurrentSize()) + window.addEventListener('resize', handle) + return () => window.removeEventListener('resize', handle) + }, []) + + return size +} export const useIsMousePresent = () => { let [present, setPresent] = useState(false)