← back to Wallco Ai

feat(/designs): clear-X button when search query non-empty; preserves other active filters in the reset link; mutually exclusive with /-kbd hint to avoid stacking icons

7a4ab666ac4073fdbd40f925744750094cb8489a · 2026-05-14 10:11:12 -0700 · SteveStudio2

Files touched

• M server.js

Diff

commit 7a4ab666ac4073fdbd40f925744750094cb8489a
Author: SteveStudio2 <stevestudio2@SteveStacStudio.lan>
Date:   Thu May 14 10:11:12 2026 -0700

    feat(/designs): clear-X button when search query non-empty; preserves other active filters in the reset link; mutually exclusive with /-kbd hint to avoid stacking icons
---
 server.js | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/server.js b/server.js
index aa4313c..41132d3 100644
--- a/server.js
+++ b/server.js
@@ -3467,7 +3467,21 @@ ${cat === 'mural-scenic' ? `
       <div class="toolbar-row">
         <div class="search-wrap" style="position:relative;flex:1;min-width:200px">
           <input type="search" name="q" value="${q}" placeholder="Search designs…" class="search-input" id="catalog-search-input" autocomplete="off" aria-autocomplete="list" aria-controls="catalog-search-suggest" aria-expanded="false" role="combobox" style="width:100%;padding-right:36px">
-          <kbd id="catalog-search-kbd" aria-hidden="true" title="Press / to focus search" style="position:absolute;right:8px;top:50%;transform:translateY(-50%);padding:2px 7px;font:600 11px/1 ui-monospace,Menlo,monospace;color:var(--ink-faint,#999);background:var(--card-bg,#faf8f3);border:1px solid var(--line,#e0d9cd);border-radius:4px;pointer-events:none;transition:opacity .12s ease">/</kbd>
+          ${q
+            ? `<a href="/designs${(function(){
+                const parts = [
+                  sort && sort !== 'newest' ? 'sort=' + encodeURIComponent(sort) : '',
+                  cat    ? 'cat='   + encodeURIComponent(cat)    : '',
+                  motifQ ? 'motif=' + encodeURIComponent(motifQ) : '',
+                  hueQ   ? 'hue='   + encodeURIComponent(hueQ)   : ''
+                ].filter(Boolean);
+                return parts.length ? '?' + parts.join('&') : '';
+              })()}"
+                id="catalog-search-clear" aria-label="Clear search query"
+                title="Clear search"
+                style="position:absolute;right:8px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--ink-faint,#999);color:var(--bg,#fff);text-decoration:none;font:600 13px/1 var(--sans)">✕</a>`
+            : `<kbd id="catalog-search-kbd" aria-hidden="true" title="Press / to focus search" style="position:absolute;right:8px;top:50%;transform:translateY(-50%);padding:2px 7px;font:600 11px/1 ui-monospace,Menlo,monospace;color:var(--ink-faint,#999);background:var(--card-bg,#faf8f3);border:1px solid var(--line,#e0d9cd);border-radius:4px;pointer-events:none;transition:opacity .12s ease">/</kbd>`
+          }
           <div id="catalog-search-suggest" role="listbox" aria-label="Search suggestions" style="display:none;position:absolute;left:0;right:0;top:100%;margin-top:4px;background:var(--bg,#fff);border:1px solid var(--line,#ddd);border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:50;max-height:60vh;overflow-y:auto"></div>
         </div>
         <style>

← eee4f56 feat(/designs): browser tab title reflects active filter — '  ·  back to Wallco Ai  ·  feat(/designs): floating scroll-to-top button (↑) appears af 5733155 →