From 9819390cae7d74556b0c19e8ede57d973078cb1d Mon Sep 17 00:00:00 2001 From: Jeremy Theintz <61942008+swiiny@users.noreply.github.com> Date: Sun, 24 Mar 2024 13:11:45 +0100 Subject: [PATCH] fix: use 100dvh instead of 100vh to prevent mobile overflow --- .../base/components/pages/home/HomePage/HomePage.module.scss | 2 +- packages/mui/components/pages/home/HomePage/HomePage.tsx | 2 +- .../components/pages/home/HomePage/HomePage.styles.ts | 2 +- packages/stylex/app/_components/home/HomePage/HomePage.tsx | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/base/components/pages/home/HomePage/HomePage.module.scss b/packages/base/components/pages/home/HomePage/HomePage.module.scss index ebae26be..fd745fc7 100644 --- a/packages/base/components/pages/home/HomePage/HomePage.module.scss +++ b/packages/base/components/pages/home/HomePage/HomePage.module.scss @@ -5,7 +5,7 @@ flex-direction: column; justify-content: space-evenly; - height: 100vh; + height: 100dvh; padding-top: 100px; diff --git a/packages/mui/components/pages/home/HomePage/HomePage.tsx b/packages/mui/components/pages/home/HomePage/HomePage.tsx index cb8dd2a1..c97393a9 100644 --- a/packages/mui/components/pages/home/HomePage/HomePage.tsx +++ b/packages/mui/components/pages/home/HomePage/HomePage.tsx @@ -12,7 +12,7 @@ const boxStyles = { justifyContent: 'space-evenly', paddingX: { xs: '15px', md: '32px', lg: '64px' }, paddingTop: '30px', - height: '100vh' + height: '100dvh' }; const HomePage: FC = () => { diff --git a/packages/styled-components/components/pages/home/HomePage/HomePage.styles.ts b/packages/styled-components/components/pages/home/HomePage/HomePage.styles.ts index 41143c66..46bfb726 100644 --- a/packages/styled-components/components/pages/home/HomePage/HomePage.styles.ts +++ b/packages/styled-components/components/pages/home/HomePage/HomePage.styles.ts @@ -9,7 +9,7 @@ export const StyledMainContainer = styled.div` flex-direction: column; justify-content: space-evenly; - height: 100vh; + height: 100dvh; padding-top: 32px; padding-left: 15px; diff --git a/packages/stylex/app/_components/home/HomePage/HomePage.tsx b/packages/stylex/app/_components/home/HomePage/HomePage.tsx index 279b026b..16be91a8 100644 --- a/packages/stylex/app/_components/home/HomePage/HomePage.tsx +++ b/packages/stylex/app/_components/home/HomePage/HomePage.tsx @@ -12,7 +12,7 @@ const styles = stylex.create({ flexDirection: 'column', justifyContent: 'space-evenly', alignItems: 'center', - height: '100svh', + height: '100dvh', paddingTop: spacing.m, paddingLeft: { default: spacing['2xs'],