modal-patch-mobile (#199)

Remove container on body to fix older Chrome versions
rei · Jan 17, 2025 · e1b2fe8 · e1b2fe8
1 parent c93de21
commit e1b2fe8
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 3 deletions.
diff --git a/src/components/modal/examples/Modal.vue b/src/components/modal/examples/Modal.vue
@@ -75,6 +75,7 @@
     <async-modal />
     <br />
     <long-modal />
+    <div class="spacer" />
   </div>
 </template>
 
@@ -113,4 +114,8 @@ export default {
     min-height: 80vh; /* fixes a safari display bug */
   }
 }
+
+.spacer {
+  height: 100vh;
+}
 </style>
diff --git a/src/components/modal/styles/CdrModal.module.scss b/src/components/modal/styles/CdrModal.module.scss
@@ -10,7 +10,7 @@ $modal-animation-duration: 150ms;
   }
 
   inset: 0;
-  height: 100vh;
+  height: 100%;
   overflow-y: scroll;
   position: fixed;
   visibility: visible;

diff --git a/src/dev/SinkWrapper.vue b/src/dev/SinkWrapper.vue
@@ -67,6 +67,7 @@ export default {
     align-items: center;
     gap: 8px;
     margin-bottom: 8px;
+    container-type: inline-size;
   }
 
   &__container {

diff --git a/src/styles/cdr-reset.scss b/src/styles/cdr-reset.scss
@@ -45,8 +45,6 @@ body {
   /* cdr-color-background-primary */
 
   background-color: #ffffff;
-  container-name: cdr-body;
-  container-type: inline-size;
 }
 
 h1,