fix: styling updates

This commit is contained in:
Mythie
2023-08-21 19:56:18 +10:00
parent 6c06337f6e
commit 94b9b1060b
5 changed files with 101 additions and 156 deletions

View File

@ -1,35 +1,27 @@
import { useEffect, useState } from 'react';
// This hook is used to get the window size
// It returns an object with the width and height of the window
// Works with window resizing as well, not to be confused with isMobile from is-mobile package
interface WindowSize {
width: number;
height: number;
}
export function useWindowSize(): WindowSize {
const [windowSize, setWindowSize] = useState<WindowSize>({
export function useWindowSize() {
const [size, setSize] = useState({
width: 0,
height: 0,
});
const handleSize = () => {
setWindowSize({
const onResize = () => {
setSize({
width: window.innerWidth,
height: window.innerHeight,
});
};
useEffect(() => {
handleSize();
window.addEventListener('resize', handleSize);
onResize();
window.addEventListener('resize', onResize);
return () => {
window.removeEventListener('resize', handleSize);
window.removeEventListener('resize', onResize);
};
}, []);
return windowSize;
return size;
}