From 7ccadbb224ece5e88d01709b30ff2efb69141622 Mon Sep 17 00:00:00 2001
From: Pontoporeia <pontoporeia@happyngreen.fr>
Date: Fri, 8 May 2026 19:18:29 +0200
Subject: [PATCH] refactor public search bar - one big input with positioned
 magnifying glass icon - fix search input left padding to prevent placeholder
 overlapping magnifying glass - add !important to search input styles to
 override base form element rules - reduce search input vertical padding -
 bump search input vertical padding to space-2xs

---
 app/public/assets/css/common.css | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/app/public/assets/css/common.css b/app/public/assets/css/common.css
index 228fb4e..02742ac 100644
--- a/app/public/assets/css/common.css
+++ b/app/public/assets/css/common.css
@@ -49,6 +49,7 @@ header {
 
     .nav-logo {
         text-decoration: none;
+        font-size: var(--step--1);
     }
 
     .nav-left {
@@ -80,6 +81,8 @@ header {
             text-transform: uppercase;
             color: var(--accent-foreground);
             text-decoration: none;
+            padding: var(--space-3xs) var(--space-xs);
+            border-radius: var(--radius);
             text-shadow:
                 0 0 16px var(--header-shadow-strong),
                 0 0 32px var(--header-shadow-soft);
@@ -328,17 +331,18 @@ main * {
 
 .header-search-input-wrap input {
     width: 100%;
-    padding: var(--space-xs) var(--space-s) var(--space-xs) var(--space-xl);
-    border: 1px solid var(--accent-primary);
-    border-radius: var(--radius);
-    background: var(--bg-primary);
-    font-size: var(--step-0);
-    color: var(--text-primary);
-    font-family: inherit;
+    padding: var(--space-2xs) var(--space-s) !important;
+    padding-left: calc(18px + var(--space-l)) !important;
+    border: 1px solid var(--accent-primary) !important;
+    border-radius: var(--radius) !important;
+    background: var(--bg-primary) !important;
+    font-size: var(--step-0) !important;
+    color: var(--text-primary) !important;
+    font-family: inherit !important;
 }
 
 .header-search-input-wrap input::placeholder {
-    color: var(--accent-primary);
+    color: var(--accent-primary) !important;
 }
 
 /* ============================================================
@@ -381,8 +385,6 @@ main * {
 :focus-visible {
     outline: none;
     box-shadow: 0 0 0 2px var(--accent-primary);
-    border-radius: var(--radius);
-    padding: var(--space-3xs) var(--space-xs);
 }
 
 /* Respect user motion preferences */