From c678a761d0be98b8c81d2372a2d930d2a5400fd5 Mon Sep 17 00:00:00 2001
From: BlackSigkill <blacksigkill@gmail.com>
Date: Thu, 5 Feb 2026 17:05:36 +0100
Subject: [PATCH] fix playlist search bar want to register new credential in
 browser

---
 index.html | 27 +++++++++++++++++++++++----
 styles.css | 13 ++++++++++++-
 2 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/index.html b/index.html
index 7ec8866..cd9c907 100644
--- a/index.html
+++ b/index.html
@@ -1650,17 +1650,36 @@
                             </div>
                         </div>
                     </header>
-                    <div class="track-list-search-container">
+                    <form class="track-list-search-container" onsubmit="return false">
+                        <svg
+                            xmlns="http://www.w3.org/2000/svg"
+                            width="20"
+                            height="20"
+                            viewBox="0 0 24 24"
+                            fill="none"
+                            stroke="currentColor"
+                            stroke-width="2"
+                            stroke-linecap="round"
+                            stroke-linejoin="round"
+                            class="search-icon"
+                        >
+                            <circle cx="11" cy="11" r="8"></circle>
+                            <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
+                        </svg>
                         <input
-                            type="text"
+                            type="search"
                             id="track-list-search-input"
                             placeholder="Search tracks..."
                             class="track-list-search-input"
+                            autocomplete="off"
+                            autocorrect="off"
+                            autocapitalize="off"
+                            spellcheck="false"
                         />
-                        <button class="search-clear-btn btn-icon" title="Clear search" style="display: none">
+                        <button type="button" class="search-clear-btn btn-icon" title="Clear search" style="display: none">
                             &times;
                         </button>
-                    </div>
+                    </form>
                     <div id="playlist-detail-tracklist" class="track-list"></div>
 
                     <section
diff --git a/styles.css b/styles.css
index a8b764f..ab9a38a 100644
--- a/styles.css
+++ b/styles.css
@@ -5531,11 +5531,22 @@ textarea:focus {
 .track-list-search-container {
     margin: 1rem 0;
     position: relative;
+    display: flex;
+    align-items: center;
+}
+
+.track-list-search-container svg.search-icon {
+    position: absolute;
+    left: 0.75rem;
+    top: 50%;
+    transform: translateY(-50%);
+    color: var(--muted-foreground);
+    pointer-events: none;
 }
 
 .track-list-search-input {
     width: 100%;
-    padding: 0.75rem 2.5rem 0.75rem 1rem;
+    padding: 0.75rem 2.5rem 0.75rem 2.5rem;
     background-color: var(--input);
     border: 1px solid var(--border);
     border-radius: var(--radius);