From e52c139c9fde196ac1e6ea521bbddc509611229b Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Sun, 17 Oct 2021 13:36:21 +0200
Subject: [PATCH] fix: task edit pane spacing

---
 src/styles/components/tasks.scss | 40 ++++++++++++++++++++------------
 src/views/list/views/List.vue    |  3 +--
 2 files changed, 26 insertions(+), 17 deletions(-)

diff --git a/src/styles/components/tasks.scss b/src/styles/components/tasks.scss
index 56829ec6a..99e8e3c15 100644
--- a/src/styles/components/tasks.scss
+++ b/src/styles/components/tasks.scss
@@ -15,8 +15,31 @@
 		}
 	}
 
+	&.has-task-edit-open {
+		flex-direction: column;
+
+		@media screen and (min-width: $tablet) {
+			flex-direction: row;
+
+			.tasks {
+				width: 66%;
+			}
+		}
+	}
+
 	.taskedit {
-		width: 50%;
+		width: 33%;
+		margin-right: 1rem;
+		margin-left: .5rem;
+
+		@media screen and (max-width: $tablet) {
+			width: 100%;
+			border-radius: 0;
+			margin: 0;
+			border-left: 0;
+			border-right: 0;
+			border-bottom: 0;
+		}
 	}
 }
 
@@ -25,16 +48,6 @@
 	padding: 0;
 	text-align: left;
 
-	@media screen and (min-width: $tablet) {
-		&.short {
-			max-width: 53vw;
-		}
-	}
-
-	@media screen and (max-width: $tablet) {
-		max-width: 100%;
-	}
-
 	&.noborder {
 		margin: 1rem -0.5rem;
 	}
@@ -195,7 +208,7 @@
 			border-bottom-color: $grey-300;
 		}
 	}
-	
+
 	.checklist-summary {
 		padding-left: .5rem;
 		font-size: .9rem;
@@ -235,9 +248,6 @@
 }
 
 .taskedit {
-	min-height: calc(100% - 1rem);
-	margin-top: 1rem;
-
 	.priority-select {
 		.select, select {
 			width: 100%;
diff --git a/src/views/list/views/List.vue b/src/views/list/views/List.vue
index c05d953e8..4c95d908b 100644
--- a/src/views/list/views/List.vue
+++ b/src/views/list/views/List.vue
@@ -74,9 +74,8 @@
 				</a>
 			</nothing>
 
-			<div class="tasks-container">
+			<div class="tasks-container" :class="{ 'has-task-edit-open': isTaskEdit }">
 				<div
-					:class="{ short: isTaskEdit }"
 					class="tasks mt-0"
 					v-if="tasks && tasks.length > 0"
 				>