[PATCH v2 2/5] gitweb: prevent project search bar from overflowing on mobile

From: Rito Rhymes via GitGitGadget <gitgitgadget@gmail.com>
Date: Feb 16, 2026, 15:53 UTC
Message-ID: <6383e1f7a9545c14d02570d5733b4b3e0513c960.1771257211.git.gitgitgadget@gmail.com>
In-Reply-To: <pull.2043.v2.git.1771257211.gitgitgadget@gmail.com>

From: Rito Rhymes <rito@ritovision.com>

On narrow screens, the project search input can exceed the available width and force page-wide horizontal scrolling.

Add a mobile media query and apply side padding to the search container, then cap the input width to its container with border-box sizing so the form stays within the viewport.

Signed-off-by: Rito Rhymes <rito@ritovision.com>
---
 gitweb/static/gitweb.css | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/gitweb/static/gitweb.css b/gitweb/static/gitweb.css
index 48d2e51015..0b63acc0e2 100644
--- a/gitweb/static/gitweb.css
+++ b/gitweb/static/gitweb.css
@@ -684,3 +684,15 @@ div.remote {
 .kwb    { color:#830000; }
 .kwc    { color:#000000; font-weight:bold; }
 .kwd    { color:#010181; }
+
+@media (max-width: 768px) {
+	div.projsearch {
+		padding: 0 8px;
+		box-sizing: border-box;
+	}
+
+	div.projsearch input[type="text"] {
+		max-width: 100%;
+		box-sizing: border-box;
+	}
+}

-- 
gitgitgadget