From 357f0168badc50a38f902f677c31c0901f7134e2 Mon Sep 17 00:00:00 2001 From: sravan Date: Sat, 18 Jul 2026 00:55:17 +0530 Subject: [PATCH] fix(mobile): keyboard resize:none + web-tunable JS lift (deterministic, no plugin fight) resize:native gave contradictory results (covered vs header) because the safe-area plugin fights it. Set resize:none so the native layer does nothing, and lift the composer purely in JS by keyboardHeight * KB_LIFT. Once resize:none is built, the lift is web-tunable with zero further builds. Build marker -> 2026-07-18-batch100. Co-Authored-By: Claude Opus 4.8 --- mobile/capacitor.config.json | 2 +- server/public/home.html | 23 +++++++++++++++-------- 2 files changed, 16 insertions(+), 9 deletions(-) diff --git a/mobile/capacitor.config.json b/mobile/capacitor.config.json index cb11352..afd4b3d 100644 --- a/mobile/capacitor.config.json +++ b/mobile/capacitor.config.json @@ -17,7 +17,7 @@ "offsetForKeyboardInsetBug": false }, "Keyboard": { - "resize": "native" + "resize": "none" }, "SplashScreen": { "launchShowDuration": 900, diff --git a/server/public/home.html b/server/public/home.html index 10b577d..f2e6999 100644 --- a/server/public/home.html +++ b/server/public/home.html @@ -1069,9 +1069,11 @@ directly above the keyboard (no nav sandwiched between the text box and the keyboard). The panel then only needs to clear the home indicator. */ body.chat-open .rail{display:none;} - /* Composer clears the home indicator; @capacitor/keyboard resize:native shrinks the WebView when the - keyboard opens so this bottom edge lands right on top of the keyboard (no JS lift — that overshot). */ - body.chat-open .content .panel{bottom:var(--sab);} + /* Composer clears the home indicator; with keyboard resize:none we raise it by --kb (the reported + keyboard height, set by the Keyboard listener) so it sits on the keyboard. No home indicator while + the keyboard is up, so --sab collapses to 0. */ + body.chat-open .content .panel{bottom:calc(var(--sab) + var(--kb));transition:bottom .18s ease;} + body.kb-open{--sab:0px;} /* Native-style push/pop: the conversation slides in from the right when opened and slides back out when you go back, so navigation has a clear direction (like Teams/WhatsApp). */ @keyframes bzConvoIn{from{transform:translateX(100%);}to{transform:translateX(0);}} @@ -1110,7 +1112,7 @@ - // juggling here — we only tag so CSS can make small native-only tweaks if needed. (function(){ try{ var C=window.Capacitor; if(!C||!C.isNativePlatform||!C.isNativePlatform()) return; var p=(C.getPlatform&&C.getPlatform())||''; var r=document.documentElement; r.classList.add('native-app'); if(p) r.classList.add('native-'+p); - // Keyboard: @capacitor/keyboard resize:native already lifts the composer to sit on the keyboard, so we - // do NOT add any JS lift (that double-lifted it up to the header). We only keep the thread pinned to the - // newest message when the keyboard appears. + // Keyboard: with resize:none the native layer does NOTHING, so we lift the composer ourselves by the + // reported keyboard height (× a tunable factor). This is fully web-controllable now — if the lift is a + // touch high/low we adjust KB_LIFT here and redeploy, no rebuild. + var KB_LIFT=1.0; // fraction of keyboardHeight to raise the composer by (calibrate via web if needed) var KB=C.Plugins&&C.Plugins.Keyboard; - if(KB && KB.addListener){ KB.addListener('keyboardDidShow', function(){ var b=document.getElementById('msgs'); if(b) b.scrollTop=b.scrollHeight; }); } + if(KB && KB.addListener){ + KB.addListener('keyboardWillShow', function(info){ var h=Math.round(((info&&info.keyboardHeight)||0)*KB_LIFT); r.style.setProperty('--kb', h+'px'); document.body.classList.add('kb-open'); }); + KB.addListener('keyboardDidShow', function(){ var b=document.getElementById('msgs'); if(b) b.scrollTop=b.scrollHeight; }); + KB.addListener('keyboardWillHide', function(){ r.style.setProperty('--kb','0px'); document.body.classList.remove('kb-open'); }); + } }catch(_){} })();
Biz Connect
Loading…