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

fix(aiui)+docs: keyboard-resize parity for standalone AIUI; companion handover note

Browse Source 
Operator-reported: keyboard opening in chat pads the tab bar and scrolls the
page instead of scaling the chat window. Triage: neode-ui already ships
interactive-widget=resizes-content + the --visual-viewport-height var, so
mobile-web Chrome resizes correctly — but an Android WebView ignores that meta
entirely, and the described pan-plus-padding is the adjustPan/edge-to-edge-
without-IME-insets signature. Companion-side fix documented for handover in
docs/companion-keyboard-viewport.md (manifest adjustResize, or IME insets when
edge-to-edge, plus a chrome://inspect verification recipe). Web side gets the
one real parity gap: AIUI's standalone index.html lacked the meta neode-ui has.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
archipelago
2026-08-04 03:21:53 -04:00
co-authored by Claude Opus 5
parent 86129d5da2
commit 57628a2aa4
2 changed files with 108 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
aiui/packages/app/index.html
+9 -1
View File
@@ -2,7 +2,15 @@
<html lang="en" class="h-full overflow-hidden">
<head>
<meta charset="UTF-8" />
<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" />
<!-- interactive-widget=resizes-content: when the soft keyboard opens,
Chrome (108+) resizes the LAYOUT viewport instead of only the visual
one, so window.innerHeight shrinks and full-height layouts scale to
the space above the keyboard rather than scrolling under it.
neode-ui's index.html already carries this; this adds parity for
AIUI's standalone mode. Ignored by iOS Safari and by Android WebView —
the companion app controls keyboard resize itself via
windowSoftInputMode/IME insets (see docs/companion-keyboard-viewport.md). -->
<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, interactive-widget=resizes-content" />
<meta name="theme-color" content="#0a0a0a" media="(prefers-color-scheme: dark)" />
<meta name="theme-color" content="#faf9f6" media="(prefers-color-scheme: light)" />
<meta name="mobile-web-app-capable" content="yes" />