@livelayer/react 0.15.3 → 0.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +3 -3
- package/dist/index.mjs +1019 -1033
- package/dist/styles.css +32 -9
- package/package.json +1 -1
package/dist/styles.css
CHANGED
|
@@ -141,15 +141,28 @@
|
|
|
141
141
|
pointer-events: auto;
|
|
142
142
|
}
|
|
143
143
|
|
|
144
|
-
/* Mobile
|
|
145
|
-
.
|
|
146
|
-
.
|
|
144
|
+
/* Mobile minimized is the explicit "shrink to a bottom bar" state the
|
|
145
|
+
user picks via the minimize button. Honor that intent — full-width
|
|
146
|
+
72px dock anchored to the bottom. */
|
|
147
|
+
.ll-widget--mobile.ll-widget--minimized {
|
|
147
148
|
left: 0;
|
|
148
149
|
right: 0;
|
|
149
150
|
bottom: 0;
|
|
150
151
|
top: auto;
|
|
151
152
|
}
|
|
152
153
|
|
|
154
|
+
/* Mobile expanded was previously also pinned edge-to-edge (100vw ×
|
|
155
|
+
80dvh). That made the idle widget cover ~60% of the phone screen
|
|
156
|
+
before the visitor had tapped anything — repeatedly reported as
|
|
157
|
+
"this is blocking the entire interface." Mobile expanded now uses
|
|
158
|
+
the same card shape as desktop, sized down to fit comfortably in a
|
|
159
|
+
phone viewport. The position prop (bottom-right by default) anchors
|
|
160
|
+
it via the rules in .ll-widget[data-position="..."] above. */
|
|
161
|
+
.ll-widget--mobile.ll-widget--expanded {
|
|
162
|
+
/* Inherits left/right/top/bottom from the position-prop rules.
|
|
163
|
+
Nothing to override here. */
|
|
164
|
+
}
|
|
165
|
+
|
|
153
166
|
/* ── Embedded experience mode ──────────────────────────────────────
|
|
154
167
|
When `experienceMode="EMBEDDED"`, the widget renders inline within
|
|
155
168
|
the host container instead of as a fixed-position floating overlay.
|
|
@@ -576,12 +589,22 @@
|
|
|
576
589
|
}
|
|
577
590
|
|
|
578
591
|
.ll-expanded--mobile {
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
592
|
+
/* Card layout — same shape as desktop, sized to fit comfortably in
|
|
593
|
+
a phone viewport with breathing room on every side. The min()
|
|
594
|
+
calls bound the card on small phones (iPhone SE at 320×568 still
|
|
595
|
+
gets a usable card with ~32px margins) while keeping a generous
|
|
596
|
+
default on modern devices (iPhone 16 Pro at 402×874 gets the
|
|
597
|
+
full 380×540 card). dvh accounts for the iOS dynamic toolbar so
|
|
598
|
+
the card never gets clipped behind the URL bar or home indicator.
|
|
599
|
+
|
|
600
|
+
Was previously `100vw × 80dvh` edge-to-edge bottom sheet — covered
|
|
601
|
+
~60% of the screen in the idle state before the visitor had even
|
|
602
|
+
tapped anything. The expanded layout is now position-aware on
|
|
603
|
+
mobile too (see .ll-widget--mobile.ll-widget--expanded above) so
|
|
604
|
+
the position prop anchors the card to the chosen corner. */
|
|
605
|
+
width: min(380px, calc(100vw - 32px));
|
|
606
|
+
height: min(540px, calc(100dvh - 32px));
|
|
607
|
+
border-radius: 20px;
|
|
585
608
|
}
|
|
586
609
|
|
|
587
610
|
/* ── Background layers ───────────────────────────────────────── */
|