From cbbcc09fc2385cf7b3b8c783cb5adf23117b71a8 Mon Sep 17 00:00:00 2001
From: AIIrondev <iron.ai.dev@gmail.com>
Date: Wed, 22 Apr 2026 19:37:39 +0200
Subject: [PATCH] Refactor navbar and search form styles for improved layout:
 adjust flex properties and widths for better responsiveness

---
 Web/templates/base.html | 46 ++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 45 insertions(+), 1 deletion(-)

diff --git a/Web/templates/base.html b/Web/templates/base.html
index b4a2d0d..6845598 100755
--- a/Web/templates/base.html
+++ b/Web/templates/base.html
@@ -306,6 +306,7 @@
             align-items: center;
             margin-right: 10px;
             width: min(420px, 42vw);
+            min-width: 0;
         }
 
         .function-search-form {
@@ -313,10 +314,13 @@
             display: flex;
             gap: 6px;
             align-items: center;
+            min-width: 0;
         }
 
         .function-search-input {
-            width: 100%;
+            flex: 1 1 auto;
+            width: auto;
+            min-width: 0;
             min-height: 38px;
             border-radius: 10px;
             border: 1px solid rgba(255, 255, 255, 0.3);
@@ -337,6 +341,7 @@
         }
 
         .function-search-btn {
+            flex: 0 0 auto;
             min-height: 38px;
             border-radius: 10px;
             border: 1px solid rgba(255, 255, 255, 0.45);
@@ -539,9 +544,48 @@
                 margin-top: 4px;
             }
 
+            .navbar-collapse {
+                width: 100%;
+            }
+
+            .navbar-collapse > .d-flex {
+                width: 100%;
+                flex-direction: column;
+                align-items: stretch;
+                gap: 8px;
+            }
+
             .function-search-wrap {
                 width: 100%;
+                max-width: 100%;
                 margin: 8px 0 10px;
+                flex: 1 1 100%;
+            }
+
+            .function-search-form {
+                width: 100%;
+                max-width: 100%;
+                flex-wrap: nowrap;
+            }
+
+            .function-search-input {
+                width: auto;
+                min-width: 0;
+                flex: 1 1 auto;
+            }
+
+            .function-search-btn {
+                flex: 0 0 auto;
+                white-space: nowrap;
+            }
+
+            .navbar-text {
+                margin-right: 0 !important;
+                width: 100%;
+            }
+
+            .user-menu-wrap {
+                align-self: flex-start;
             }
 
             .navbar-nav .nav-item {