From 0f10e1f0e13349eba3cc8f48db280a12d6cdbaf7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julius=20H=C3=A4rtl?= <jus@bitgrid.net>
Date: Mon, 12 Apr 2021 08:12:58 +0200
Subject: [PATCH] Add inline search input
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/components/Controls.vue | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/components/Controls.vue b/src/components/Controls.vue
index c220c9dc8..e8fb84b9d 100644
--- a/src/components/Controls.vue
+++ b/src/components/Controls.vue
@@ -34,6 +34,12 @@
 			</p>
 		</div>
 		<div v-if="board" class="board-actions">
+			<div v-if="searchQuery || true" class="deck-search">
+				<input type="search"
+					class="icon-search"
+					:value="searchQuery"
+					@input="$store.commit('setSearchQuery', $event.target.value)">
+			</div>
 			<div v-if="canManage && !showArchived && !board.archived"
 				id="stack-add"
 				v-click-outside="hideAddStack">
@@ -237,6 +243,7 @@ export default {
 		]),
 		...mapState({
 			compactMode: state => state.compactMode,
+			searchQuery: state => state.searchQuery,
 		}),
 		detailsRoute() {
 			return {
@@ -374,6 +381,13 @@ export default {
 		}
 	}
 
+	.deck-search {
+		input[type=search] {
+			background-position: 5px;
+			padding-left: 24px;
+		}
+	}
+
 	.filter--item {
 		input + label {
 			display: block;