From afc13c34748fd380c0b12cb556ee7944d1aacd2b Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Fri, 4 Sep 2020 21:01:20 +0200
Subject: [PATCH] Add notice to show the limit

---
 src/styles/components/kanban.scss | 9 +++++++++
 src/views/list/views/Kanban.vue   | 8 +++++++-
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/styles/components/kanban.scss b/src/styles/components/kanban.scss
index 258c28583..f246f8b49 100644
--- a/src/styles/components/kanban.scss
+++ b/src/styles/components/kanban.scss
@@ -229,6 +229,15 @@ $crazy-height-calculation: '100vh - 4.5rem - 1.5rem - 1em - 1.5em - 8px';
     justify-content: space-between;
     padding: .5em;
 
+    .limit {
+      padding-left: .5rem;
+      font-weight: bold;
+
+      &.is-max {
+        color: $red;
+      }
+    }
+
     .dropdown-trigger {
       cursor: pointer;
     }
diff --git a/src/views/list/views/Kanban.vue b/src/views/list/views/Kanban.vue
index 2047ba122..4408dad95 100644
--- a/src/views/list/views/Kanban.vue
+++ b/src/views/list/views/Kanban.vue
@@ -9,6 +9,12 @@
 						@focusout="() => saveBucketTitle(bucket.id)"
 						:ref="`bucket${bucket.id}title`"
 						@keyup.ctrl.enter="() => saveBucketTitle(bucket.id)">{{ bucket.title }}</h2>
+				<span 
+					class="limit"
+					:class="{'is-max': bucket.tasks.length >= bucket.limit}"
+					v-if="bucket.limit > 0">
+					{{ bucket.tasks.length }}/{{ bucket.limit }}
+				</span>
 				<div
 						class="dropdown is-right options"
 						:class="{ 'is-active': bucketOptionsDropDownActive[bucket.id] }"
@@ -280,7 +286,7 @@
 		created() {
 			this.taskService = new TaskService()
 			this.loadBuckets()
-			this.$nextTick(() => document.addEventListener('click', this.closeBucketDropdowns))
+//			this.$nextTick(() => document.addEventListener('click', this.closeBucketDropdowns))
 
 			// Save the current list view to local storage
 			// We use local storage and not vuex here to make it persistent across reloads.