hemn/mataba
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement WooCommerce AJAX product filtering

Browse Source
This commit is contained in:
XShop
2026-09-13 20:31:20 +03:30
parent f5c283af25
commit b78e332966
15 changed files with 1543 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files
shop/xshop-theme/assets/css/woo.css
+26
View File
@@ -185,5 +185,31 @@
.xshop-search__dropdown{ position:fixed; inset-block-start:auto; inset-inline:var(--xshop-space-2); inset-block-end:var(--xshop-space-2); max-block-size:55vh; }
}
/* ---- Filters ---- */
.xshop-shop__layout{ display:grid; grid-template-columns:280px 1fr; gap:var(--xshop-space-6); align-items:start; }
@media (max-width:1024px){ .xshop-shop__layout{ grid-template-columns:1fr; } .xshop-shop__sidebar{ display:none; } }
.xshop-shop__filter-toggle{ display:none; margin-block-end:var(--xshop-space-4); }
@media (max-width:1024px){ .xshop-shop__filter-toggle{ display:inline-flex; } }
.xshop-filters{ display:flex; flex-direction:column; gap:var(--xshop-space-4); }
.xshop-filters__chips{ display:flex; flex-wrap:wrap; gap:var(--xshop-space-2); min-block-size:0; }
.xshop-filters__chips:empty{ display:none; }
.xshop-chip{ display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:var(--xshop-radius-full); background:var(--xshop-surface); border:1px solid var(--xshop-border); font-size:var(--xshop-text-xs); cursor:pointer; }
.xshop-chip--clear{ background:var(--xshop-primary); color:#fff; border-color:var(--xshop-primary); }
.xshop-filter{ border:1px solid var(--xshop-border); border-radius:var(--xshop-radius-md); padding:var(--xshop-space-3); background:var(--xshop-card); }
.xshop-filter__title{ font-weight:var(--xshop-weight-bold); font-size:var(--xshop-text-sm); margin:0 0 var(--xshop-space-2); padding:0; }
.xshop-filter__options{ display:flex; flex-direction:column; gap:var(--xshop-space-2); }
.xshop-filter__option{ display:flex; align-items:center; gap:var(--xshop-space-2); font-size:var(--xshop-text-sm); cursor:pointer; }
.xshop-filter__option input{ accent-color:var(--xshop-primary); }
.xshop-filter__count{ margin-inline-start:auto; color:var(--xshop-muted); font-size:var(--xshop-text-xs); }
.xshop-filter__price{ display:flex; align-items:center; gap:var(--xshop-space-2); }
.xshop-filter__price input{ flex:1; }
.xshop-filters__actions{ display:flex; gap:var(--xshop-space-2); }
.xshop-drawer{ position:fixed; inset-block:0; inset-inline-start:0; inline-size:min(380px, 90vw); background:var(--xshop-card); border-inline-end:1px solid var(--xshop-border); z-index:var(--xshop-z-modal); overflow:auto; padding:var(--xshop-space-4); display:flex; flex-direction:column; gap:var(--xshop-space-4); }
.xshop-drawer[hidden]{ display:none !important; }
.xshop-drawer__header{ display:flex; align-items:center; justify-content:space-between; border-block-end:1px solid var(--xshop-border); padding-block-end:var(--xshop-space-3); }
.xshop-drawer__title{ font-size:var(--xshop-text-lg); margin:0; }
.xshop-drawer__overlay{ position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:calc(var(--xshop-z-modal) - 1); }
.xshop-drawer__overlay[hidden]{ display:none !important; }
/* Star rating fallback */
.star-rating{ color:#f59e0b; }