From ed0d23533236da851ea5e797da426b87f79475f6 Mon Sep 17 00:00:00 2001
From: Gamosoft <gamosoft@users.noreply.github.com>
Date: Fri, 5 Dec 2025 14:40:40 +0100
Subject: [PATCH] smaller button and search box

---
 frontend/index.html | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/frontend/index.html b/frontend/index.html
index 5e937d4..77e9a39 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -849,25 +849,25 @@
             </div>
             
             <!-- Search -->
-            <div class="flex-shrink-0 p-3 border-b" style="border-color: var(--border-primary);">
+            <div class="flex-shrink-0 px-2 py-2 border-b" style="border-color: var(--border-primary);">
                 <div class="relative">
                     <input 
                         type="text" 
                         x-model="searchQuery"
                         @input="searchNotes()"
-                        placeholder="Search notes..."
-                        class="w-full px-3 py-2 pl-8 pr-8 text-sm rounded-lg focus:outline-none focus:ring-2"
+                        placeholder="Search..."
+                        class="w-full px-2 py-1.5 pl-7 pr-7 text-xs rounded focus:outline-none focus:ring-1"
                         style="background-color: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-primary);"
                     >
                     <!-- Search Icon -->
-                    <svg class="absolute left-2 top-2.5 w-4 h-4" style="color: var(--text-tertiary);" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <svg class="absolute left-2 top-2 w-3.5 h-3.5" style="color: var(--text-tertiary);" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
                     </svg>
                     <!-- Clear Button -->
                     <button
                         x-show="searchQuery.length > 0"
                         @click="searchQuery = ''; searchResults = []; currentSearchHighlight = ''; clearSearchHighlights();"
-                        class="absolute right-2 top-2.5 w-4 h-4 flex items-center justify-center rounded-full hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors"
+                        class="absolute right-1.5 top-1.5 w-4 h-4 flex items-center justify-center rounded-full hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors"
                         style="color: var(--text-tertiary);"
                         title="Clear search"
                     >
@@ -880,7 +880,7 @@
                 <!-- Match Navigation (shown when there are matches in current note) -->
                 <div 
                     x-show="totalMatches > 0" 
-                    class="flex items-center justify-between mt-2 px-2 py-1 rounded text-xs"
+                    class="flex items-center justify-between mt-1.5 px-2 py-0.5 rounded text-xs"
                     style="background-color: var(--bg-secondary); color: var(--text-secondary);"
                 >
                     <span x-text="`Match ${currentMatchIndex + 1} of ${totalMatches}`"></span>
@@ -978,16 +978,16 @@
             </div>
             
             <!-- New Item Dropdown -->
-            <div class="flex-shrink-0 p-3 border-b" style="border-color: var(--border-primary);">
+            <div class="flex-shrink-0 px-2 py-1.5 border-b" style="border-color: var(--border-primary);">
                 <button 
                     @click="dropdownTargetFolder = ''; toggleNewDropdown($event)"
-                    class="w-full px-4 py-2 text-sm font-medium text-white rounded-lg focus:outline-none focus:ring-2 flex items-center justify-center gap-2"
+                    class="w-full px-3 py-1.5 text-xs font-medium text-white rounded focus:outline-none focus:ring-1 flex items-center justify-center gap-1.5"
                     style="background-color: var(--accent-primary);"
                     onmouseover="this.style.backgroundColor='var(--accent-hover)'"
                     onmouseout="this.style.backgroundColor='var(--accent-primary)'"
                 >
                     <span>+ New</span>
-                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
                     </svg>
                 </button>