codex-webstrapper 0.9.5 → 0.9.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codex-webstrapper",
-  "version": "0.9.5",
+  "version": "0.9.7",
   "type": "module",
   "description": "Web wrapper for Codex desktop assets with bridge + token auth",
   "license": "MIT",

package/src/bridge-shim.js

@@ -339,10 +339,9 @@
           -webkit-text-size-adjust: 100% !important;
         }
 
-        /* Header overflow fix */
+        /* Header — constrain to viewport */
         .h-toolbar {
           max-width: 100vw !important;
-          overflow: hidden !important;
         }
 
         .h-toolbar button {
@@ -354,18 +353,19 @@
         }
 
         /* Prevent iOS auto-zoom on focus (triggers when font-size < 16px) */
-        input, textarea, select, [contenteditable="true"] {
+        input, textarea, select {
           font-size: 16px !important;
           max-width: 100% !important;
           box-sizing: border-box !important;
         }
 
-        /* Disable double-tap zoom */
-        * {
-          touch-action: manipulation;
+        [contenteditable="true"] {
+          max-width: 100% !important;
+          box-sizing: border-box !important;
         }
 
         [contenteditable="true"]:focus {
+          font-size: 16px !important;
           scroll-margin-bottom: 20px;
         }
 
@@ -424,7 +424,10 @@
           --spacing-token-sidebar: 0px !important;
         }
 
-        /* Sidebar becomes full-screen overlay when open */
+        /* Sidebar becomes full-screen overlay when open.
+           When collapsed the app sets opacity-0 but the element still covers
+           the screen (translate is 0 because we zeroed the token). We must
+           disable pointer events so it doesn't block taps on main content. */
         .window-fx-sidebar-surface,
         .w-token-sidebar {
           width: 85vw !important;
@@ -432,6 +435,15 @@
           z-index: 50 !important;
           box-shadow: 4px 0 24px rgba(0, 0, 0, 0.5) !important;
           background-color: rgb(24, 24, 24) !important;
+          pointer-events: none !important;
+          transition: opacity 0.3s ease, pointer-events 0s linear 0.3s !important;
+        }
+
+        /* Re-enable pointer events only when sidebar is visible (open) */
+        .window-fx-sidebar-surface.opacity-100,
+        .w-token-sidebar.opacity-100 {
+          pointer-events: auto !important;
+          transition: opacity 0.3s ease, pointer-events 0s linear 0s !important;
         }
 
         /* Main content takes full width */
@@ -441,12 +453,41 @@
           width: 100vw !important;
         }
 
-        /* Header left section — collapse to fit phone */
+        /* Header toolbar — swipeable so all buttons remain accessible.
+           When the sidebar is collapsed the portal area expands and can
+           push right-side buttons off-screen; scrolling keeps them
+           reachable via horizontal swipe. */
+        .h-toolbar {
+          overflow-x: auto !important;
+          overflow-y: hidden !important;
+          -webkit-overflow-scrolling: touch !important;
+          scrollbar-width: none !important;
+        }
+        .h-toolbar::-webkit-scrollbar {
+          display: none !important;
+        }
+
+        /* Prevent header-left from consuming more than half the bar.
+           The app sets an inline min-width via CSS vars that over-allocates
+           space for the portal area — override it so buttons fit. */
         .app-header-left {
           width: auto !important;
+          min-width: 0 !important;
           max-width: 50vw !important;
-          flex-shrink: 1 !important;
-          padding-left: 8px !important;
+          flex-shrink: 0 !important;
+          padding-left: 4px !important;
+          padding-right: 0 !important;
+        }
+
+        /* Collapse the empty portal gap when sidebar is hidden */
+        .app-header-left-portal {
+          gap: 0 !important;
+          padding-right: 2px !important;
+        }
+
+        /* Keep right-side buttons from shrinking below usable size */
+        .h-toolbar button {
+          flex-shrink: 0 !important;
         }
 
         /* Use stable viewport height */