From 06231cc4904b927fa519478aea06fcefd0a30599 Mon Sep 17 00:00:00 2001
From: bronkuu <bronk.jakub@proton.me>
Date: Mon, 15 Jun 2026 17:44:10 +0200
Subject: [PATCH] serch box

---
 server/templates/orders.templ | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/server/templates/orders.templ b/server/templates/orders.templ
index f03a4aa..37dfcf4 100644
--- a/server/templates/orders.templ
+++ b/server/templates/orders.templ
@@ -77,11 +77,26 @@ templ OrdersMain(orders []models.Order) {
 				<span class="material-symbols-outlined">list_alt</span>
 				Aktywne zamówienia
 			</h2>
+			<div style="position:relative;width:11.25rem">
+				<span class="material-symbols-outlined" style="position:absolute;left:0.5rem;top:50%;transform:translateY(-50%);font-size:1rem;color:var(--on-surface-variant);pointer-events:none">search</span>
+				<input type="text" style="height:1.75rem;padding-left:1.75rem;padding-right:0.5rem;font-size:0.75rem;border:1px solid var(--outline-variant);border-radius:var(--border-radius-sm);background:var(--surface-container-lowest);color:var(--on-surface);outline:none;width:100%" placeholder="Szukaj..." oninput="filterOrders(this)"/>
+			</div>
 		</header>
 		<div class="table-container" id="results-table">
 			@OrdersTable(orders)
 		</div>
 	</section>
+	<script>
+		function filterOrders(input) {
+			var q = input.value.toLowerCase();
+			var rows = document.querySelectorAll('#results-table tbody tr');
+			for (var i = 0; i < rows.length; i++) {
+				var id = rows[i].children[0].textContent.toLowerCase();
+				var customer = rows[i].children[1].textContent.toLowerCase();
+				rows[i].style.display = id.includes(q) || customer.includes(q) ? '' : 'none';
+			}
+		}
+	</script>
 }
 
 templ OrdersTable(orders []models.Order) {