lfg2025/archy
1
0
Fork 0
Code Issues 24 Pull Requests 4 Actions Packages Projects Releases 74 Wiki Activity

feat(app): mobile improvements — native-feel viewport, keyboard, HIG tabs, PWA fix

Browse Source 
- Lock viewport: position:fixed on html/body prevents iOS bounce scroll
- No zoom on input focus: maximum-scale=1, user-scalable=no
- Keyboard-responsive chat: visualViewport API detects keyboard, hides
  tab bar, scrolls chat to bottom, scrollIntoView on input focus
- iOS HIG tab bar: 49pt height, vertical icon+label, safe-area-inset-bottom
- PWA fix: manifest start_url/scope/id changed from '/' to './' for
  subpath deployment compatibility
- PlayerBar: variant prop (fixed/inline), inline on mobile above tab bar,
  fixed on desktop. No more overlap with tab bar.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-04 20:50:06 +00:00
co-authored by Claude Opus 4.6
parent 799ca131d9
commit a0a9cf8e54
9 changed files with 142 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/app/index.html
+3 -3
View File
@@ -1,8 +1,8 @@
<!DOCTYPE html>
<html lang="en">
<html lang="en" class="h-full overflow-hidden">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, viewport-fit=cover" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
<meta name="theme-color" content="#0a0a0a" media="(prefers-color-scheme: dark)" />
<meta name="theme-color" content="#faf9f6" media="(prefers-color-scheme: light)" />
<meta name="apple-mobile-web-app-capable" content="yes" />
@@ -13,7 +13,7 @@
<link rel="apple-touch-icon" href="/apple-touch-icon-180x180.png" />
<title>AIUI</title>
</head>
<body class="antialiased">
<body class="antialiased h-full overflow-hidden fixed w-full">
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>