From f8555c34942ec37442bb1aa2a519b8bb65b498cb Mon Sep 17 00:00:00 2001
From: Mansoor Khan <22OO1CSO56mansoorkhan@gmail.com>
Date: Sun, 10 May 2026 20:28:47 +0530
Subject: [PATCH 1/3] Added search filter for the result
---
static/script.js | 45 +++++++++++++++++++++++++++++++++++++++++++-
static/style.css | 26 +++++++++++++++++++++++++
templates/index.html | 7 ++++++-
3 files changed, 76 insertions(+), 2 deletions(-)
diff --git a/static/script.js b/static/script.js
index 1ceb1e63..8081a7f2 100644
--- a/static/script.js
+++ b/static/script.js
@@ -267,10 +267,14 @@ if (isIndexPage) {
resultsSection.style.display = "block";
resultsLoadingEl.style.display = "none";
resultsGrid.innerHTML = "";
+
+ // Store current projects for reference
+ currentProjects = projects || [];
if (!projects || projects.length === 0) {
resultsGrid.style.display = "none";
resultsEmptyEl.style.display = "block";
+ showSearchInput(false); // Hide search when no results
if (message && emptyMessageEl) emptyMessageEl.textContent = message;
resultsSection.scrollIntoView({ behavior: "smooth" });
return;
@@ -283,6 +287,10 @@ if (isIndexPage) {
resultsGrid.appendChild(buildProjectCard(project));
});
+ // Show search input and setup filter (only once)
+ showSearchInput(true);
+ if (!searchInput) setupFilter();
+
resultsSection.scrollIntoView({ behavior: "smooth" });
}
@@ -347,6 +355,41 @@ if (isIndexPage) {
return text.length > maxLength ? text.slice(0, maxLength) + "..." : text;
}
+ // ----------------------------------------------------------
+ // Filter projects based on search input
+ // ----------------------------------------------------------
+ var searchInput = null;
+ var currentProjects = [];
+
+ function setupFilter() {
+ searchInput = document.getElementById("results-search");
+ if (!searchInput) return;
+
+ searchInput.addEventListener("input", function (e) {
+ var searchTerm = e.target.value.trim().toLowerCase();
+ var cards = resultsGrid.querySelectorAll(".project-card");
+
+ cards.forEach(function (card) {
+ var title = card.querySelector(".project-card-title")?.textContent.toLowerCase() || "";
+ var desc = card.querySelector(".project-card-desc")?.textContent.toLowerCase() || "";
+
+ if (searchTerm === "" || title.includes(searchTerm) || desc.includes(searchTerm)) {
+ card.style.display = "";
+ } else {
+ card.style.display = "none";
+ }
+ });
+ });
+ }
+
+ function showSearchInput(show) {
+ var wrap = document.getElementById("results-search-wrap");
+ if (wrap) {
+ wrap.style.display = show ? "block" : "none";
+ if (show && searchInput) searchInput.value = "";
+ }
+ }
+
} // end isIndexPage
@@ -416,4 +459,4 @@ if (isDetailPage) {
if (evt.key === "Escape") closeCodePanel();
});
-} // end isDetailPage
+} // end isDetailPage
\ No newline at end of file
diff --git a/static/style.css b/static/style.css
index 188419b8..2842ef1a 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1533,3 +1533,29 @@ select:focus {
.container { padding: 0 20px; }
.section-sub { margin-bottom: 40px; }
}
+/* ---- Results Search Input --------------------------------- */
+.results-search-wrap {
+ max-width: 480px;
+ margin: 0 auto 32px auto;
+}
+
+.results-search-input {
+ width: 100%;
+ padding: 12px 18px;
+ font-family: var(--font-body);
+ font-size: 0.95rem;
+ border: 1.5px solid var(--border);
+ border-radius: var(--r-full);
+ background: var(--white);
+ transition: border-color var(--t), box-shadow var(--t);
+}
+
+.results-search-input:focus {
+ outline: none;
+ border-color: var(--indigo-500);
+ box-shadow: 0 0 0 3px rgba(79, 110, 247, 0.12);
+}
+
+.results-search-input::placeholder {
+ color: var(--gray-400);
+}
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 5338a4a3..e052b0bc 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -371,6 +371,11 @@ No Projects Found
+
+
+
+
+
@@ -441,4 +446,4 @@
-