Make ≈Japan-match chip a link → opens matched SKU on japan.designerwallcoverings.com

1dda47d728cf2c673c78bfd02715f28603b28d29 · 2026-08-12 18:34:09 -0700 · Steve

Files touched

M public/app.js
M public/styles.css

Diff

commit 1dda47d728cf2c673c78bfd02715f28603b28d29
Author: Steve <steve@designerwallcoverings.com>
Date:   Wed Aug 12 18:34:09 2026 -0700

    Make ≈Japan-match chip a link → opens matched SKU on japan.designerwallcoverings.com
---
 public/app.js     | 2 +-
 public/styles.css | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/public/app.js b/public/app.js
index 76f48d1..ba9f8c4 100644
--- a/public/app.js
+++ b/public/app.js
@@ -155,7 +155,7 @@ function render() {
           ${p.pattern_name ? `<span class="chip" data-filter="pattern" data-val="${esc(p.pattern_name)}"><span class="k">pattern</span> ${esc(p.pattern_name)}</span>` : ''}
           ${p.color_name ? `<span class="chip" data-filter="color" data-val="${esc(p.color_name)}"><span class="k">color</span> ${esc(p.color_name)}</span>` : ''}
           ${p.material ? `<span class="chip" data-filter="material" data-val="${esc(p.material)}"><span class="k">mat</span> ${esc(p.material)}</span>` : ''}
-          ${p.japan_sku ? `<span class="chip jp ${p.japan_conf === 'possible' ? 'poss' : 'hi'}" title="Visual image match (${esc(p.japan_conf)}) → true origin ${esc(p.japan_vendor)} ${esc(p.japan_sku)}">${p.japan_thumb ? `<img class="jt" loading="lazy" src="${esc(p.japan_thumb)}" alt="" onerror="this.style.display='none'" />` : ''}≈ ${esc(p.japan_vendor)} ${esc(p.japan_sku)}</span>` : ''}
+          ${p.japan_sku ? `<a class="chip jp ${p.japan_conf === 'possible' ? 'poss' : 'hi'}" href="https://japan.designerwallcoverings.com/?q=${encodeURIComponent(p.japan_sku)}" target="_blank" rel="noopener noreferrer" title="Open ${esc(p.japan_vendor)} ${esc(p.japan_sku)} on japan.designerwallcoverings.com (visual match — ${esc(p.japan_conf)})">${p.japan_thumb ? `<img class="jt" loading="lazy" src="${esc(p.japan_thumb)}" alt="" onerror="this.style.display='none'" />` : ''}≈ ${esc(p.japan_vendor)} ${esc(p.japan_sku)} ↗</a>` : ''}
         </div>
         <div class="meta">
           <div class="row"><span class="sku" data-copy="${esc(p.dw_sku || '')}" title="Click to copy dw_sku">${esc(p.dw_sku || '—')}</span>
diff --git a/public/styles.css b/public/styles.css
index a9cd7c8..24fdbeb 100644
--- a/public/styles.css
+++ b/public/styles.css
@@ -222,8 +222,8 @@ main { padding: 18px; }
 .chip .k { color: var(--muted); }
 /* pattern thumbnail on the chip row + Japan-origin visual-match chip */
 .chipthumb { width: 24px; height: 24px; object-fit: cover; border-radius: 5px; border: 1px solid var(--line); flex: 0 0 auto; }
-.chip.jp { display: inline-flex; align-items: center; gap: 5px; cursor: default; background: #eef6ee; border-color: #bcd8bc; color: #245c24; }
-.chip.jp:hover { background: #e2efe2; border-color: #bcd8bc; color: #245c24; }
+.chip.jp { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; text-decoration: none; background: #eef6ee; border-color: #bcd8bc; color: #245c24; }
+.chip.jp:hover { background: #dcecdc; border-color: #9cc59c; color: #184018; }
 .chip.jp.poss { background: #fff; border-style: dashed; border-color: #cbd5c9; color: var(--muted); }
 .chip.jp .jt { width: 18px; height: 18px; object-fit: cover; border-radius: 4px; border: 1px solid #0002; flex: 0 0 auto; }

← 1b33bf8 Show Japan-origin SKU + pattern/match thumbs on chips (534 i · back to Astek Import Viewer · Japan chip links to the EXACT matched image (authoritative U 85b0c70 →