fix: better styles for active option

assets/controllers/search_bar_controller.js

@@ -24,6 +24,9 @@ export default class extends Controller {
             const params = value.split('|')
             window.location.href = `/result/${params[0]}/${params[1]}`
         };
+        event.detail.options.onType = (searchQuery) => {
+            console.log(this.element);
+        }
         event.detail.options.render.loading = (data, escape) => {
             return `
             <span data-controller="loading-icon" data-loading-icon-total-value="52" data-loading-icon-count-value="20" class="loading-icon">

assets/styles/app.css

@@ -120,5 +120,5 @@ dialog[data-dialog-target="dialog"][closing] {
 
 #search .ts-dropdown .ts-dropdown-content .option.active {
     background: unset;
-    @apply hover:bg-orange-500/80 active:bg-orange-500/80 text-black rounded-md
+    @apply bg-orange-500/80 text-black font-bold rounded-md
 }