diff --git a/beango/css/beango.css b/beango/css/beango.css
index 5b6c2ba..cf5f6d8 100644
--- a/beango/css/beango.css
+++ b/beango/css/beango.css
@@ -82,6 +82,15 @@ body {
max-width: 100%;
}
+/* NEW: Style for highlighted search results */
+.bingo-cell.highlighted {
+ border-color: #3b82f6; /* Tailwind blue-500 */
+ border-width: 3px;
+ transform: scale(1.05);
+ box-shadow: 0 0 15px rgba(59, 130, 246, 0.6); /* Stronger blue glow */
+ z-index: 10; /* Ensure highlighted cells are visually on top if overlapping happens during scale */
+}
+
/* Add darken filter on hover */
.bingo-cell:hover {
filter: brightness(85%);
diff --git a/beango/index.html b/beango/index.html
index 81ee1c3..651e5fd 100644
--- a/beango/index.html
+++ b/beango/index.html
@@ -52,6 +52,12 @@
+
+
+
+
+
+
diff --git a/beango/js/beango.js b/beango/js/beango.js
index ed0e206..d8fa247 100644
--- a/beango/js/beango.js
+++ b/beango/js/beango.js
@@ -1101,6 +1101,35 @@ function loadFromLocalStorage() {
applyBoardBgStyle();
});
+ // --- Search Listener ---
+ const searchInput = document.getElementById('search-input');
+ if (searchInput) {
+ searchInput.addEventListener('input', () => {
+ const searchTerm = searchInput.value.trim().toLowerCase();
+ const cells = document.querySelectorAll('#bingo-board .bingo-cell');
+
+ // Split search term into words
+ const searchWords = searchTerm.split(/\s+/).filter(word => word.length > 0);
+
+ cells.forEach(cell => {
+ const textSpan = cell.querySelector('.bingo-cell-text');
+ let isMatch = false;
+ if (textSpan && searchWords.length > 0) {
+ const cellText = textSpan.textContent.trim().toLowerCase();
+ // Check if ALL search words are included in the cell text
+ isMatch = searchWords.every(word => cellText.includes(word));
+ }
+
+ // Add or remove highlight based on match status
+ if (isMatch) {
+ cell.classList.add('highlighted');
+ } else {
+ cell.classList.remove('highlighted');
+ }
+ });
+ });
+ }
+
// --- Other Listeners ---
window.addEventListener('resize', equalizeCellSizes);
equalizeCellSizes(); // Initial call after load