From 568b099c173973dc9a745aec8c6f8da3fe9d79f1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julius=20H=C3=A4rtl?= <jus@bitgrid.net>
Date: Tue, 13 Oct 2020 09:57:22 +0200
Subject: [PATCH] Give modal a bit more padding
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Julius Härtl <jus@bitgrid.net>
---
 src/App.vue                         | 15 ++++++++-------
 src/components/card/CardSidebar.vue |  8 +++++---
 2 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 271f045d4..3c358c80f 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -143,13 +143,6 @@ export default {
 			}
 		}
 	}
-</style>
-
-<style lang="scss">
-
-	.multiselect {
-		width: 100%;
-	}
 
 	.modal__card {
 		min-width: 320px;
@@ -159,3 +152,11 @@ export default {
 		height: 80vh;
 	}
 </style>
+
+<style lang="scss">
+
+	.multiselect {
+		width: 100%;
+	}
+
+</style>
diff --git a/src/components/card/CardSidebar.vue b/src/components/card/CardSidebar.vue
index 26ba98574..bec93b6e6 100644
--- a/src/components/card/CardSidebar.vue
+++ b/src/components/card/CardSidebar.vue
@@ -571,14 +571,16 @@ export default {
 	// FIXME: Obivously we should at some point not randomly reuse the sidebar component
 	// since this is not oficially supported
 	.modal__card .app-sidebar {
+		$modal-padding: 14px;
 		border: 0;
-		min-width: 100%;
+		min-width: calc(100% - #{$modal-padding*2});
 		position: relative;
 		top: 0;
 		left: 0;
 		right: 0;
-		max-width: 100%;
-		max-height: 100%;
+		max-width: calc(100% - #{$modal-padding*2});
+		padding: 14px;
+		max-height: calc(100% - #{$modal-padding*2});
 		&::v-deep {
 			.app-sidebar-header {
 				position: sticky;