fix app height for ios

This commit is contained in:
Felix Roos 2023-02-19 13:50:08 +01:00
parent ceb3aa0627
commit f3f18ffca7
3 changed files with 13 additions and 1 deletions

View File

@ -80,4 +80,13 @@ const { strudelTheme } = settings;
}
setTheme(get().theme);
watch(setTheme, 'theme');
// https://medium.com/quick-code/100vh-problem-with-ios-safari-92ab23c852a8
const appHeight = () => {
const doc = document.documentElement;
doc.style.setProperty('--app-height', `${window.innerHeight}px`);
};
if (typeof window !== 'undefined') {
window.addEventListener('resize', appHeight);
appHeight();
}
</script>

View File

@ -30,7 +30,7 @@ const githubEditUrl = `${CONFIG.GITHUB_EDIT_URL}/${currentFile}`;
</title>
</head>
<body class="h-screen text-gray-50 bg-background">
<body class="h-app-height text-gray-50 bg-background">
<div class="w-full h-full space-y-4 flex flex-col">
<header class="max-w-full fixed top-0 w-full z-[100]">
<Header currentPage={currentPage} />

View File

@ -25,6 +25,9 @@ module.exports = {
gutterBorder: 'var(--gutterBorder)',
lineHighlight: 'var(--lineHighlight)',
},
spacing: {
'app-height': 'var(--app-height)',
},
typography(theme) {
return {
DEFAULT: {