Replace the mobile one-on-one layout with an edge-to-edge spotlight

2024-08-01 13:49:09 -04:00
parent 942e28f3c2
commit eb051ab318
6 changed files with 39 additions and 42 deletions
--- a/src/grid/SpotlightExpandedLayout.module.css
+++ b/src/grid/SpotlightExpandedLayout.module.css
@@ -25,11 +25,18 @@ limitations under the License.

 .pip {
  position: absolute;
-  inline-size: 180px;
-  block-size: 135px;
+  inline-size: 135px;
+  block-size: 160px;
  inset: var(--cpd-space-4x);
 }

+@media (min-width: 600px) {
+  .pip {
+    inline-size: 180px;
+    block-size: 135px;
+  }
+}
+
 .pip[data-block-alignment="start"] {
  inset-block-end: unset;
 }