From 67d3899a36e9a9d4f56d79eee50265dd20d6e3e7 Mon Sep 17 00:00:00 2001
From: Sam Lavigne <splavigne@gmail.com>
Date: Tue, 29 Aug 2023 16:48:27 -0400
Subject: [PATCH] hover state for filter picker

---
 src/FilterPicker.svelte | 24 +++++++++++++++++-------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/src/FilterPicker.svelte b/src/FilterPicker.svelte
index 4a5e1ef..96b3aa3 100644
--- a/src/FilterPicker.svelte
+++ b/src/FilterPicker.svelte
@@ -27,7 +27,7 @@
   }
 
   function add(f) {
-		addNode(f, "filter");
+    addNode(f, "filter");
   }
 
   function update() {
@@ -49,7 +49,12 @@
 
 <div class="holder">
   <div class="search">
-    <input placeholder="Search Filters" on:keyup={update} bind:value={q} type="text" /><button on:click={() => {reset(); update();}}>X</button>
+    <input placeholder="Search Filters" on:keyup={update} bind:value={q} type="text" /><button
+      on:click={() => {
+        reset();
+        update();
+      }}>X</button
+    >
     <select on:change={reset} bind:value={select}>
       <option value="video">Video Filters</option>
       <option value="audio">Audio Filters</option>
@@ -78,13 +83,13 @@
     justify-content: stretch;
   }
   input {
-		width: 100%;
+    width: 100%;
     flex: 1;
   }
-	button {
-	margin-left: 1px;
-	margin-right: 10px;
-	}
+  button {
+    margin-left: 1px;
+    margin-right: 10px;
+  }
   .type {
     color: #999;
     font-size: 0.8em;
@@ -95,6 +100,11 @@
     padding: 10px 0px;
     cursor: pointer;
   }
+
+  .filter:hover {
+    background-color: var(--b2);
+  }
+
   .all-filters {
     flex: 1;
     overflow: scroll;