fix: fix new #modal spacing, if no title is given

dnbexperience · Oct 22, 2020 · d77736b · d77736b
1 parent 4210bf6
commit d77736b
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/packages/dnb-ui-lib/src/components/modal/__tests__/__snapshots__/Modal.test.js.snap b/packages/dnb-ui-lib/src/components/modal/__tests__/__snapshots__/Modal.test.js.snap
@@ -1485,14 +1485,16 @@ button.dnb-button::-moz-focus-inner {
   .dnb-modal__wrapper {
     position: relative;
     z-index: 1;
-    padding-top: calc(var(--modal-spacing) / 2);
     padding-bottom: calc(var(--modal-spacing) * 1.75); }
     @media screen and (max-width: 40em) {
       .dnb-modal__wrapper {
         padding-bottom: calc(var(--modal-spacing) * 1.25); } }
   .dnb-modal__content--drawer .dnb-modal__wrapper {
-    padding-top: calc(var(--modal-spacing) * 0.75);
     padding-bottom: calc(var(--modal-spacing) * 2); }
+  .dnb-modal__title ~ .dnb-modal__wrapper {
+    padding-top: calc(var(--modal-spacing) / 2); }
+  .dnb-modal__content--drawer .dnb-modal__title ~ .dnb-modal__wrapper {
+    padding-top: calc(var(--modal-spacing) * 0.75); }
   .dnb-modal__wrapper__inner {
     padding-bottom: calc(var(--modal-spacing) * 2);
     margin-bottom: calc(var(--modal-spacing) * -1.75); }

diff --git a/packages/dnb-ui-lib/src/components/modal/style/_modal.scss b/packages/dnb-ui-lib/src/components/modal/style/_modal.scss
@@ -229,17 +229,21 @@
     position: relative;
     z-index: 1;
 
-    padding-top: calc(var(--modal-spacing) / 2);
     padding-bottom: calc(var(--modal-spacing) * 1.75);
 
     @include allBelow(small) {
       padding-bottom: calc(var(--modal-spacing) * 1.25);
     }
   }
   &__content--drawer &__wrapper {
-    padding-top: calc(var(--modal-spacing) * 0.75);
     padding-bottom: calc(var(--modal-spacing) * 2);
   }
+  &__title ~ &__wrapper {
+    padding-top: calc(var(--modal-spacing) / 2);
+  }
+  &__content--drawer &__title ~ &__wrapper {
+    padding-top: calc(var(--modal-spacing) * 0.75);
+  }
 
   &__wrapper__inner {
     padding-bottom: calc(var(--modal-spacing) * 2);