Sravan/BizGaze_Remote
0
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix(ios): status-bar inset via StatusBar plugin, hide nav in open chat, bulletproof h-scroll

Browse Source 
Root cause from device screenshots: the iOS Capacitor WebView reports env(safe-area-inset-*)=0,
so CSS padding did nothing and content slid under the Dynamic Island (every page: home/share/
connect/login) and the bottom nav was clipped.
- Use the already-installed StatusBar plugin: setOverlaysWebView(false) pushes content below the
  status bar natively (no rebuild). Applied on all entry pages via a small native-chrome snippet.
- Hard-code the bottom home-indicator inset (--sab:34px on html.native-ios) since env() can't give it.
- #2 keyboard: hide the bottom tab bar inside an open conversation so the composer sits directly on
  the keyboard (was sandwiched between composer and keyboard).
- #3 h-scroll: clip every scroll surface + overflow-wrap:anywhere so long content can't widen the page.
Build marker -> 2026-07-17-batch91.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Sravan
2026-07-17 17:19:37 +05:30
parent 95e13a707e
commit a609bfd2e0
4 changed files with 59 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/public/share.html
+9 -1
View File
@@ -2,8 +2,16 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>Biz Connect — Share your screen</title>
<script>
// Native shell: push content below the status bar/notch (the Capacitor WebView reports safe-area insets
// as 0, so the back button/header would otherwise slide under the Dynamic Island).
(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);
var SB=C.Plugins&&C.Plugins.StatusBar; if(SB){ try{ SB.setOverlaysWebView({overlay:false}); }catch(_){}; try{ SB.setStyle({style:'DARK'}); }catch(_){}; try{ SB.setBackgroundColor({color:'#ffffff'}); }catch(_){} }
}catch(_){} })();
</script>
<meta name="theme-color" content="#1F3B73">
<link rel="icon" href="/favicon.ico?v=3" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png?v=3">