Rafael Lopes
8e29dde2a1
- Telas iniciais do projeto criadas - Estrutura de pastas e arquivos definida - Componentes instalados e linguagem definida - Vite configurado para React e build de dev rapida - Mockups de dados criados para desenvolvimento dos módulos - Documentação inicial criada para guiar o desenvolvimento e uso do projeto
31 lines
646 B
JavaScript
31 lines
646 B
JavaScript
import { useEffect, useState } from 'react';
|
|
|
|
function getViewportWidth() {
|
|
if (typeof window === 'undefined') {
|
|
return 1440;
|
|
}
|
|
|
|
return window.innerWidth;
|
|
}
|
|
|
|
export function useViewport() {
|
|
const [width, setWidth] = useState(getViewportWidth);
|
|
|
|
useEffect(() => {
|
|
function handleResize() {
|
|
setWidth(window.innerWidth);
|
|
}
|
|
|
|
window.addEventListener('resize', handleResize);
|
|
return () => window.removeEventListener('resize', handleResize);
|
|
}, []);
|
|
|
|
return {
|
|
width,
|
|
isWideDesktop: width >= 1500,
|
|
isDesktop: width >= 1180,
|
|
isTablet: width < 1180 && width >= 760,
|
|
isMobile: width < 760,
|
|
};
|
|
}
|