From 51ea99725944069be6dae168bd0561594963a08f Mon Sep 17 00:00:00 2001
From: Ramon Wenger <ramon.wenger@iterativ.ch>
Date: Wed, 3 Apr 2024 16:14:15 +0200
Subject: [PATCH] Fix gap between buttons in forms and modals

Resolves MS-886 #complete
---
 client/src/components/Modal.vue                               | 2 ++
 client/src/components/ReadOnlyBanner.vue                      | 3 ++-
 client/src/components/content-block-form/ContentBlockForm.vue | 2 ++
 client/src/components/modules/SnapshotHeader.vue              | 2 ++
 client/src/components/portfolio/ProjectEntryForm.vue          | 1 +
 5 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/client/src/components/Modal.vue b/client/src/components/Modal.vue
index 755b3f13..b9de3834 100644
--- a/client/src/components/Modal.vue
+++ b/client/src/components/Modal.vue
@@ -135,6 +135,8 @@ export default {
     -ms-grid-row: 3;
     border-top: 1px solid $color-silver-light;
     padding: 16px $modal-lateral-padding;
+    display: flex;
+    gap: $small-spacing;
   }
 
   $parent: &;
diff --git a/client/src/components/ReadOnlyBanner.vue b/client/src/components/ReadOnlyBanner.vue
index 7cf97063..7d0645aa 100644
--- a/client/src/components/ReadOnlyBanner.vue
+++ b/client/src/components/ReadOnlyBanner.vue
@@ -92,11 +92,12 @@ const licenseActivationLink = {
   }
 
   &__buttons {
+    display: flex;
+    gap: $small-spacing;
   }
 
   &__link {
     @include default-link;
-    margin-right: $small-spacing;
   }
 }
 </style>
diff --git a/client/src/components/content-block-form/ContentBlockForm.vue b/client/src/components/content-block-form/ContentBlockForm.vue
index 0b872c73..8b014eda 100644
--- a/client/src/components/content-block-form/ContentBlockForm.vue
+++ b/client/src/components/content-block-form/ContentBlockForm.vue
@@ -405,6 +405,8 @@ provide('features', props.features);
 
   &__buttons {
     width: 800px;
+    display: flex;
+    gap: $small-spacing;
   }
 }
 </style>
diff --git a/client/src/components/modules/SnapshotHeader.vue b/client/src/components/modules/SnapshotHeader.vue
index 43e221cc..20c1faa0 100644
--- a/client/src/components/modules/SnapshotHeader.vue
+++ b/client/src/components/modules/SnapshotHeader.vue
@@ -181,6 +181,8 @@ export default {
   }
 
   &__buttons {
+    display: flex;
+    gap: $small-spacing;
   }
 }
 </style>
diff --git a/client/src/components/portfolio/ProjectEntryForm.vue b/client/src/components/portfolio/ProjectEntryForm.vue
index 212acb65..fea4cf96 100644
--- a/client/src/components/portfolio/ProjectEntryForm.vue
+++ b/client/src/components/portfolio/ProjectEntryForm.vue
@@ -124,6 +124,7 @@ export default {
     display: grid;
     grid-template-columns: 1fr 1fr;
     padding: $medium-spacing;
+    gap: $small-spacing;
   }
 
   &__button {