@asksable/site-connector 0.6.14 → 0.6.15

package/dist/styles.css

@@ -2727,15 +2727,19 @@
 @media (max-width: 1024px) {
   /* Lock the frame to a single height across all steps so the widget
      doesn't bounce as the user moves between services / date / etc.
-     Sized to feel like a mobile app panel: the footer sits near the
-     viewport bottom on tall phones, while the body scrolls internally
-     when a step exceeds it. */
+     Host pages with their own header can set --bw-mobile-viewport-offset
+     so the header + booking frame fit inside the visible viewport. */
   .bw {
-    /* svh (small viewport height) doesn't jump when iOS Safari's URL
-       bar toggles, unlike vh which uses the largest possible height
-       and overflows when bars become visible. */
-    min-height: 92svh;
-    max-height: 92svh;
+    /* svh is the fallback for browsers without dvh support. */
+    min-height: max(0px, calc(100svh - var(--bw-mobile-viewport-offset, 0px)));
+    max-height: max(0px, calc(100svh - var(--bw-mobile-viewport-offset, 0px)));
+  }
+
+  @supports (height: 100dvh) {
+    .bw {
+      min-height: max(0px, calc(100dvh - var(--bw-mobile-viewport-offset, 0px)));
+      max-height: max(0px, calc(100dvh - var(--bw-mobile-viewport-offset, 0px)));
+    }
   }
 
   /* Lock header/footer in the column so they never shrink under
@@ -2768,8 +2772,15 @@
   }
 
   .bw-placeholder {
-    min-height: 92svh;
-    max-height: 92svh;
+    min-height: max(0px, calc(100svh - var(--bw-mobile-viewport-offset, 0px)));
+    max-height: max(0px, calc(100svh - var(--bw-mobile-viewport-offset, 0px)));
+  }
+
+  @supports (height: 100dvh) {
+    .bw-placeholder {
+      min-height: max(0px, calc(100dvh - var(--bw-mobile-viewport-offset, 0px)));
+      max-height: max(0px, calc(100dvh - var(--bw-mobile-viewport-offset, 0px)));
+    }
   }
 
   .bw-placeholder-header {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@asksable/site-connector",
-  "version": "0.6.14",
+  "version": "0.6.15",
   "private": false,
   "type": "module",
   "sideEffects": [