fix(core/modal): fix padding (#1126)

siemens · Feb 29, 2024 · 37d90fb · 37d90fb
1 parent e7e7d47
commit 37d90fb
Show file tree

Hide file tree

Showing 26 changed files with 9 additions and 9 deletions.
diff --git a/packages/core/src/components/modal-content/modal-content.scss b/packages/core/src/components/modal-content/modal-content.scss
@@ -14,5 +14,5 @@
   display: block;
   position: relative;
   overflow: auto;
-  padding: 0.125rem 0.625rem 0.125rem 0.625rem;
+  padding: 0.25rem 0.75rem;
 }
diff --git a/packages/core/src/components/modal-footer/modal-footer.scss b/packages/core/src/components/modal-footer/modal-footer.scss
@@ -11,8 +11,7 @@
 :host {
   @include ix-component;
   display: flex;
-  padding: 0.625rem;
-  padding-top: 1.5rem;
+  padding: 0.5rem;
   justify-content: flex-end;
   align-items: center;
   gap: 0.5rem;

diff --git a/packages/core/src/components/modal-header/modal-header.scss b/packages/core/src/components/modal-header/modal-header.scss
@@ -11,13 +11,13 @@
 :host {
   @include ix-component;
   display: flex;
-  padding: 2px 16px 16px 10px;
+  padding: 0.5rem;
   align-items: center;
   align-self: stretch;
 
   .modal-close {
     margin-left: auto;
-    margin-right: -20px;
+    margin-right: -1rem;
   }
 
   .modal-icon {

diff --git a/packages/core/src/components/modal/modal.scss b/packages/core/src/components/modal/modal.scss
@@ -20,6 +20,7 @@
 
   dialog {
     margin: 0;
+    padding: 1rem;
     left: 50%;
   }
 
@@ -66,8 +67,8 @@
   }
 
   .modal-size-full-screen {
-    left: 0px !important;
-    top: 0px !important;
+    left: 0 !important;
+    top: 0 !important;
     transform: none !important;
 
     width: calc(100% - 28px);
@@ -84,8 +85,8 @@
     position: fixed;
     width: 100vw;
     height: 100vh;
-    top: 0px;
-    left: 0px;
+    top: 0;
+    left: 0;
 
     pointer-events: none;
   }

diff --git a/...al/modal.e2e.ts-snapshots/modal-basic-1-chromium---theme-classic-dark-linux.png b/...al/modal.e2e.ts-snapshots/modal-basic-1-chromium---theme-classic-dark-linux.png
diff --git a/...l/modal.e2e.ts-snapshots/modal-basic-1-chromium---theme-classic-light-linux.png b/...l/modal.e2e.ts-snapshots/modal-basic-1-chromium---theme-classic-light-linux.png
diff --git a/...dal/modal.e2e.ts-snapshots/modal-icon-1-chromium---theme-classic-dark-linux.png b/...dal/modal.e2e.ts-snapshots/modal-icon-1-chromium---theme-classic-dark-linux.png
diff --git a/...al/modal.e2e.ts-snapshots/modal-icon-1-chromium---theme-classic-light-linux.png b/...al/modal.e2e.ts-snapshots/modal-icon-1-chromium---theme-classic-light-linux.png
diff --git a/...-snapshots/modal-should-show-centered-1-chromium---theme-classic-dark-linux.png b/...-snapshots/modal-should-show-centered-1-chromium---theme-classic-dark-linux.png
diff --git a/...snapshots/modal-should-show-centered-1-chromium---theme-classic-light-linux.png b/...snapshots/modal-should-show-centered-1-chromium---theme-classic-light-linux.png
diff --git a/...modal.e2e.ts-snapshots/modal-size-360-1-chromium---theme-classic-dark-linux.png b/...modal.e2e.ts-snapshots/modal-size-360-1-chromium---theme-classic-dark-linux.png
diff --git a/...odal.e2e.ts-snapshots/modal-size-360-1-chromium---theme-classic-light-linux.png b/...odal.e2e.ts-snapshots/modal-size-360-1-chromium---theme-classic-light-linux.png
diff --git a/...modal.e2e.ts-snapshots/modal-size-480-1-chromium---theme-classic-dark-linux.png b/...modal.e2e.ts-snapshots/modal-size-480-1-chromium---theme-classic-dark-linux.png
diff --git a/...odal.e2e.ts-snapshots/modal-size-480-1-chromium---theme-classic-light-linux.png b/...odal.e2e.ts-snapshots/modal-size-480-1-chromium---theme-classic-light-linux.png
diff --git a/...modal.e2e.ts-snapshots/modal-size-600-1-chromium---theme-classic-dark-linux.png b/...modal.e2e.ts-snapshots/modal-size-600-1-chromium---theme-classic-dark-linux.png
diff --git a/...odal.e2e.ts-snapshots/modal-size-600-1-chromium---theme-classic-light-linux.png b/...odal.e2e.ts-snapshots/modal-size-600-1-chromium---theme-classic-light-linux.png
diff --git a/...modal.e2e.ts-snapshots/modal-size-720-1-chromium---theme-classic-dark-linux.png b/...modal.e2e.ts-snapshots/modal-size-720-1-chromium---theme-classic-dark-linux.png
diff --git a/...odal.e2e.ts-snapshots/modal-size-720-1-chromium---theme-classic-light-linux.png b/...odal.e2e.ts-snapshots/modal-size-720-1-chromium---theme-classic-light-linux.png
diff --git a/...modal.e2e.ts-snapshots/modal-size-840-1-chromium---theme-classic-dark-linux.png b/...modal.e2e.ts-snapshots/modal-size-840-1-chromium---theme-classic-dark-linux.png
diff --git a/...odal.e2e.ts-snapshots/modal-size-840-1-chromium---theme-classic-light-linux.png b/...odal.e2e.ts-snapshots/modal-size-840-1-chromium---theme-classic-light-linux.png
diff --git a/...e.ts-snapshots/modal-size-full-screen-1-chromium---theme-classic-dark-linux.png b/...e.ts-snapshots/modal-size-full-screen-1-chromium---theme-classic-dark-linux.png
diff --git a/....ts-snapshots/modal-size-full-screen-1-chromium---theme-classic-light-linux.png b/....ts-snapshots/modal-size-full-screen-1-chromium---theme-classic-light-linux.png
diff --git a/...2e.ts-snapshots/modal-size-full-width-1-chromium---theme-classic-dark-linux.png b/...2e.ts-snapshots/modal-size-full-width-1-chromium---theme-classic-dark-linux.png
diff --git a/...e.ts-snapshots/modal-size-full-width-1-chromium---theme-classic-light-linux.png b/...e.ts-snapshots/modal-size-full-width-1-chromium---theme-classic-light-linux.png
diff --git a/....e2e.ts-snapshots/modal-with-dropdown-1-chromium---theme-classic-dark-linux.png b/....e2e.ts-snapshots/modal-with-dropdown-1-chromium---theme-classic-dark-linux.png
diff --git a/...e2e.ts-snapshots/modal-with-dropdown-1-chromium---theme-classic-light-linux.png b/...e2e.ts-snapshots/modal-with-dropdown-1-chromium---theme-classic-light-linux.png