feat: disable zoom and fix iOS viewport issues

- Add user-scalable=no and interactive-widget=overlays-content to viewport meta tag
- Implement iOS viewport height fixes to prevent keyboard-related layout shifts
- Use dynamic viewport height (100dvh) for better mobile support
- Add fixed positioning and overflow controls to prevent viewport changes
- Enable scrolling only within #app container for better UX
This commit is contained in:
Jose Olarte III
2025-09-30 21:06:13 +08:00
parent 0c627f4822
commit f4144c7469
2 changed files with 20 additions and 2 deletions

View File

@@ -7,6 +7,24 @@
html {
font-family: 'Work Sans', ui-sans-serif, system-ui, sans-serif !important;
}
/* Fix iOS viewport height changes when keyboard appears/disappears */
html, body {
height: 100%;
height: 100vh;
height: 100dvh; /* Dynamic viewport height for better mobile support */
overflow: hidden; /* Disable all scrolling on html and body */
position: fixed; /* Force fixed positioning to prevent viewport changes */
width: 100%;
top: 0;
left: 0;
}
#app {
height: 100vh;
height: 100dvh;
overflow-y: auto;
}
}
@layer components {