filecoin-project/slate
1
1
Fork 0
mirror of https://github.com/filecoin-project/slate.git synced 2024-11-23 05:54:49 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix(auth): 100vh on mobile overflowing

Browse Source
This commit is contained in:
Aminejv 2021-06-22 20:48:00 +01:00
parent 6cd82c41f3
commit 9f57a1cab9
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
scenes/SceneAuth/index.js
View File

@ -28,7 +28,7 @@ const STYLES_ROOT = css`
text-align: center;
font-size: 1rem;
min-height: 100vh;
height: 100vh;
width: 100vw;
position: relative;
overflow: hidden;
@ -166,12 +166,23 @@ const BackgroundGenerator = ({ children, ...props }) => {
const backgroundIdx = Utilities.getRandomNumberBetween(0, AUTH_BACKGROUNDS.length - 1);
return AUTH_BACKGROUNDS[backgroundIdx];
}, []);
// NOTE(amine): fix for 100vh overflowing in mobile
// https://bugs.webkit.org/show_bug.cgi?id=141832
const [height, setHeight] = React.useState();
React.useLayoutEffect(() => {
if (!window) return;
const windowInnerHeight = window.innerHeight;
setHeight(windowInnerHeight);
}, []);
return (
<div style={{ backgroundImage: `url(${background})` }} {...props}>
<div style={{ backgroundImage: `url(${background})`, height }} {...props}>
{children}
</div>
);
};
const WithCustomWrapper = (Component) => (props) => {
return (
<WebsitePrototypeWrapper>