feat(Modal): css and html structure improvements 7741641864

mondaycom · Oct 31, 2024 · 3fd90e6 · 3fd90e6
1 parent a44aea7
commit 3fd90e6
Showing 1 changed file with 9 additions and 4 deletions.
diff --git a/packages/core/src/components/ModalNew/layouts/ModalMediaLayout/ModalMediaLayout.module.scss b/packages/core/src/components/ModalNew/layouts/ModalMediaLayout/ModalMediaLayout.module.scss
@@ -4,32 +4,37 @@
   overflow: hidden;
 
   .media {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    overflow: hidden;
+    position: relative;
     width: 100%;
-    height: var(--modal-top-media-height, 240px);
     flex-shrink: 0;
 
+    height: var(--modal-top-media-height, 240px);
     @media (min-width: 1280px) {
       --modal-top-media-height: 260px;
     }
-
     @media (min-width: 1440px) {
       --modal-top-media-height: 260px;
     }
-
     @media (min-width: 1720px) {
       --modal-top-media-height: 320px;
     }
   }
 
   .header {
     width: 100%;
-    margin-block: var(--spacing-large) var(--spacing-small);
     text-align: center;
+    margin-block: var(--spacing-xl) var(--spacing-small);
+    padding-inline: var(--modal-inline-padding);
   }
 
   .content {
     width: 100%;
     flex: 1;
     align-self: flex-start;
+    padding-block-end: var(--spacing-large);
   }
 }