fix(Dialog): make action buttons responsive (#2373)

* make dialog action buttons responsive
dnbexperience · May 31, 2023 · 3e1f146 · 3e1f146
1 parent a02a8fe
commit 3e1f146
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 7 deletions.
diff --git a/packages/dnb-eufemia/src/components/dialog/__tests__/__snapshots__/Dialog.test.tsx.snap b/packages/dnb-eufemia/src/components/dialog/__tests__/__snapshots__/Dialog.test.tsx.snap
@@ -2292,12 +2292,11 @@ html[data-visual-test] .dnb-modal__overlay, .dnb-modal__overlay--no-animation {
 .dnb-dialog__actions {
   padding-top: 1.5rem;
   display: flex;
+  flex-flow: row wrap;
   justify-content: center;
+  gap: 1rem;
   width: 100%;
 }
-.dnb-dialog__actions > :not(:last-child) {
-  margin-right: 1rem;
-}
 .dnb-dialog--information .dnb-dialog__actions {
   justify-content: left;
 }

diff --git a/packages/dnb-eufemia/src/components/dialog/style/dnb-dialog.scss b/packages/dnb-eufemia/src/components/dialog/style/dnb-dialog.scss
@@ -112,12 +112,10 @@
     padding-top: 1.5rem;
 
     display: flex;
+    flex-flow: row wrap;
     justify-content: center;
+    gap: 1rem;
     width: 100%;
-
-    > :not(:last-child) {
-      margin-right: 1rem;
-    }
   }
 
   &--information &__actions {