diff --git a/appview/pages/templates/repo/search.html b/appview/pages/templates/repo/search.html
index c039e8de..40f18e24 100644
--- a/appview/pages/templates/repo/search.html
+++ b/appview/pages/templates/repo/search.html
@@ -10,25 +10,38 @@
 <main>
   <div class="flex relative w-full mb-4">
     <div class="flex-1 flex relative">
-      <span class="absolute left-2 top-1/2 -translate-y-1/2 text-gray-400">
-        {{ i "search-code" "size-4" }}
-      </span>
       <input
+        id="repo-search-input"
         type="text"
         name="q"
         value="{{ .FilterQuery }}"
         placeholder="Find files or code"
-        hx-get=""
-        hx-trigger="{{ if .FilterQuery }}load, {{ end }}input changed delay:100ms from:input"
         hx-get="/{{ .RepoInfo.FullName }}/search"
         hx-trigger="{{ if .FilterQuery }}load, {{ end }}keydown[key=='Enter'] from:#repo-search-input, input changed delay:100ms from:#repo-search-input"
         hx-target="#repo-files"
         hx-swap="outerHTML"
         hx-replace-url="true"
         autofocus
-        class="font-mono flex-1 py-1 pl-8 pr-2 peer"
+        class="flex-1 py-1 pl-2 pr-10 mr-[-1px] rounded-r-none peer"
       >
+      <a
+        href="?"
+        class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hidden peer-[:not(:placeholder-shown)]:block"
+      >
+        {{ i "x" "w-4 h-4" }}
+      </a>
     </div>
+    <button
+      type="button"
+      hx-get="/{{ .RepoInfo.FullName }}/search"
+      hx-include="#repo-search-input"
+      hx-target="#repo-files"
+      hx-swap="outerHTML"
+      hx-replace-url="true"
+      class="p-2 text-gray-400 border rounded-r border-gray-300 dark:border-gray-600"
+    >
+      {{ i "search" "w-4 h-4" }}
+    </button>
   </div>
   {{ if not .LoggedInUser }}
     <div class="flex items-center gap-2 my-2 bg-orange-50 dark:bg-orange-900/30 border border-orange-300 dark:border-orange-700 rounded px-3 py-2 text-orange-600 dark:text-orange-300 text-sm">