diff --git a/server/public/connect.html b/server/public/connect.html index 23b38f6..2496e02 100644 --- a/server/public/connect.html +++ b/server/public/connect.html @@ -2,8 +2,16 @@ - + Biz Connect — Agent Console + diff --git a/server/public/home.html b/server/public/home.html index 491f5fc..1a77caa 100644 --- a/server/public/home.html +++ b/server/public/home.html @@ -23,6 +23,11 @@ bottom rail (the "gap"). overscroll-behavior:none pins the page; the rail's own height already includes the home-indicator inset. */ html,body{height:100%;overscroll-behavior:none;} + /* Safe-area insets. The iOS Capacitor WebView reports env(safe-area-inset-*)=0, so on the native app + we (a) push content below the status bar/notch with StatusBar.setOverlaysWebView(false) — see the + native-chrome script — and (b) hard-code the bottom home-indicator inset here (env() can't give it). */ + :root{--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);} + html.native-ios{--sab:34px;} body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--ink);margin:0;display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;position:fixed;inset:0;width:100%;} /* ---- Top bar ---- */ @@ -1020,10 +1025,11 @@ relocated into the chat-list header (see placeHdrRight). The shell is pushed below the device status bar so no view overlaps it. */ header{display:none;} - /* #3: kill any horizontal drift on phones (long content, 100vw children, safe-area math) — the page - should never pan left/right. */ - html,body{overflow-x:hidden;max-width:100vw;} - .shell,.content,.chatcol,.panel,.convo,.convo-msgs,.chatlist{overflow-x:hidden;max-width:100%;} + /* #3: kill any horizontal drift on phones (long content, over-wide children, safe-area math) — the + page must never pan left/right. Clip every scroll surface and let long words/URLs wrap. */ + html,body{overflow-x:hidden;} + .shell,.content,.chatcol,.panel,.convo,.convo-msgs,.chatlist,.side-head,.side-search-row,.chat-row{overflow-x:hidden;max-width:100%;min-width:0;} + .chat-main,.msg,.msg-body,.bubble{min-width:0;max-width:100%;overflow-wrap:anywhere;} /* #1/#5: the top safe-area inset (notch / Dynamic Island) is applied PER SURFACE — the chat-list column and each content panel — rather than on the whole shell, so nothing hides under the island and there's no double-padding. Bottom inset is handled by the fixed nav + panel bottom below. */ @@ -1037,8 +1043,8 @@ indicator and drifted with the URL bar. Use border-box + a height that INCLUDES the inset, pin it with a promoted layer, and use px-unit env() fallbacks (unitless 0 breaks calc() on Safari). */ .rail{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;box-sizing:border-box; - height:calc(60px + env(safe-area-inset-bottom,0px)); - padding:0 .3rem env(safe-area-inset-bottom,0px) .3rem; + height:calc(60px + var(--sab)); + padding:0 .3rem var(--sab) .3rem; flex-direction:row;justify-content:space-around;align-items:center;gap:0; border-right:none;border-top:1px solid var(--line);box-shadow:0 -3px 14px rgba(20,30,60,.08); transform:translateZ(0)!important;-webkit-transform:translateZ(0)!important;z-index:1200;background:var(--card);} @@ -1052,12 +1058,17 @@ /* Meeting room code: always fully visible, full-width, easy to read */ .meet-bar .code{flex:1 1 100%;font-size:.9rem;white-space:normal;word-break:break-word;text-align:center;background:var(--blue-soft);border-radius:8px;padding:.35rem .5rem;} /* Chat: one pane at a time (list, then the open conversation) */ - .chatcol{width:100%;flex:1 1 100%;padding-top:env(safe-area-inset-top,0px);padding-bottom:calc(60px + env(safe-area-inset-bottom,0px));} + .chatcol{width:100%;flex:1 1 100%;padding-top:var(--sat);padding-bottom:calc(60px + var(--sab));} body.chat-open .chatcol{display:none;} .content{display:none;} body.chat-open .content, .shell:not(.is-chat) .content{display:block;} .shell:not(.is-chat) .chatcol{display:none;} - .content .panel{top:env(safe-area-inset-top,0px);bottom:calc(60px + env(safe-area-inset-bottom,0px));} /* below the notch; clear the bottom nav + home indicator */ + .content .panel{top:var(--sat);bottom:calc(60px + var(--sab));} /* below the notch; clear the bottom nav + home indicator */ + /* #2 (mobile keyboard): inside an open conversation, hide the bottom tab bar so the composer sits + 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;} + body.chat-open .content .panel{bottom:var(--sab);} /* Bigger touch targets */ .chat-row{padding:.7rem .85rem;} .convo-head{padding:.7rem .85rem;} @@ -1084,7 +1095,7 @@ - +
Biz Connect
Loading…
diff --git a/server/public/index.html b/server/public/index.html index e077d84..f2dcd38 100644 --- a/server/public/index.html +++ b/server/public/index.html @@ -4,6 +4,14 @@ Biz Connect + diff --git a/server/public/share.html b/server/public/share.html index d8dea4f..f0dc827 100644 --- a/server/public/share.html +++ b/server/public/share.html @@ -2,8 +2,16 @@ - + Biz Connect — Share your screen +