alee/golfgame
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

Use window.innerHeight for mobile viewport height on Chrome Android

Browse Source 
Set --app-height CSS custom property from window.innerHeight via JS,
which is the only reliable way to get the actual visible viewport on
Chrome Android. Falls back to 100vh if JS hasn't loaded.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken
2026-02-22 14:28:58 -05:00
parent 097f241c6f
commit 7dc27fe882
2 changed files with 16 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
client/style.css
View File

@@ -4906,9 +4906,7 @@ body.screen-shake {
}
body.mobile-portrait {
height: 100vh;
height: -webkit-fill-available;
height: 100dvh;
height: var(--app-height, 100vh);
overflow: hidden;
overscroll-behavior: contain;
touch-action: manipulation;
@@ -4916,19 +4914,18 @@ body.mobile-portrait {
body.mobile-portrait #app {
padding: 0;
height: 100%;
height: var(--app-height, 100vh);
overflow: hidden;
}
/* --- Mobile: Game screen fills viewport --- */
/* IMPORTANT: Must include .active to avoid overriding .screen { display: none } */
body.mobile-portrait #game-screen.active {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: var(--app-height, 100vh);
max-height: var(--app-height, 100vh);
overflow: hidden;
margin-left: 0;
width: 100%;
display: flex;
flex-direction: column;
}