[object Object]

← back to Designer Wallcoverings

hfilter: Color swatch label from title attr; close all grid gap + product padding

d3308dca44618944092d792c8644d76a072ed326 · 2026-06-22 18:41:31 -0700 · Steve Abrams

Files touched

Diff

commit d3308dca44618944092d792c8644d76a072ed326
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Mon Jun 22 18:41:31 2026 -0700

    hfilter: Color swatch label from title attr; close all grid gap + product padding
---
 shopify/theme-5.0-duplicate/assets/dw-hfilter.js               | 5 ++++-
 shopify/theme-5.0-duplicate/snippets/dw-boost-overrides.liquid | 5 ++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/shopify/theme-5.0-duplicate/assets/dw-hfilter.js b/shopify/theme-5.0-duplicate/assets/dw-hfilter.js
index 9b44487f..fce59559 100644
--- a/shopify/theme-5.0-duplicate/assets/dw-hfilter.js
+++ b/shopify/theme-5.0-duplicate/assets/dw-hfilter.js
@@ -73,7 +73,10 @@
     if (amt && amt.textContent) {
       txt = txt.replace(amt.textContent, '');
     }
-    return txt.replace(/\s*\(\d[\d,]*\)\s*$/, '').replace(/\s+/g, ' ').trim();
+    txt = txt.replace(/\s*\(\d[\d,]*\)\s*$/, '').replace(/\s+/g, ' ').trim();
+    /* Swatch options (Color) carry their name in title / aria-label, not text. */
+    if (!txt) { txt = (btnEl.getAttribute('title') || btnEl.getAttribute('aria-label') || '').trim(); }
+    return txt;
   }
 
   /* Read a swatch background-color from a native option, if any. */
diff --git a/shopify/theme-5.0-duplicate/snippets/dw-boost-overrides.liquid b/shopify/theme-5.0-duplicate/snippets/dw-boost-overrides.liquid
index 04ba89e6..22d6da3b 100644
--- a/shopify/theme-5.0-duplicate/snippets/dw-boost-overrides.liquid
+++ b/shopify/theme-5.0-duplicate/snippets/dw-boost-overrides.liquid
@@ -30,7 +30,10 @@ body.dw-filters-collapsed .boost-sd__product-list[class*="grid--"]{grid-template
 .boost-sd__product-item,.boost-sd__product-item *{min-width:0 !important;max-width:100% !important;box-sizing:border-box !important}
 .boost-sd__product-item{width:auto !important;overflow:hidden !important}
 .boost-sd__product-item img{max-width:100% !important;height:auto !important;width:100% !important}
-.boost-sd__product-list{overflow:hidden !important;display:grid !important}
+.boost-sd__product-list{overflow:hidden !important;display:grid !important;gap:0 !important;grid-gap:0 !important;column-gap:0 !important;row-gap:0 !important}
+/* DW close all space between products */
+.boost-sd__product-item{padding:0 !important;margin:0 !important}
+.boost-sd__product-item-image,.boost-sd__product-item-inner,.boost-sd__product-item > *{margin:0 !important}
 
 /* Filter toggle button */
 .dw-filter-toggle{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;margin:4px 0 4px 8px;font-family:-apple-system,BlinkMacSystemFont,sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;user-select:none;background:#fff;border:1.5px solid #000;border-radius:999px;cursor:pointer;vertical-align:middle}

← d418373a hfilter: derive groups from titles (.boost-sd__filter-option  ·  back to Designer Wallcoverings  ·  hfilter: always start MutationObserver so late-rendered Boos cdf6f8d5 →