Shopify · patrickracicot · Oct 20, 2023 · Sep 20, 2023 · jas7457 · Oct 12, 2023
diff --git a/assets/component-facets.css b/assets/component-facets.css
@@ -223,11 +223,34 @@
   transition: text-decoration var(--duration-short) ease;
 }
 
-.facets__summary:hover span {
+.facets__summary:hover .facets__summary-label {
   text-decoration: underline;
   text-underline-offset: 0.3rem;
 }
 
+.facets__and-helptext {
+  color: rgba(var(--color-foreground), 0.5);
+  font-size: calc(var(--font-heading-scale) * 1.2rem);
+  line-height: calc(var(--font-heading-scale) * 1.2rem);
+}
+
+@media only screen and (min-width: 750px) {
+  .facets__and-helptext {
+    font-size: calc(var(--font-heading-scale) * 1.3rem);
+    line-height: calc(var(--font-heading-scale) * 1.3rem);
+  }
+}
+
+.facets__disclosure .facets__and-helptext,
+.facets__disclosure-vertical .facets__and-helptext {
+  display: none;
+}
+
+.facets__disclosure[open] .facets__and-helptext,
+.facets__disclosure-vertical[open] .facets__and-helptext {
+  display: block;
+}
+
 .disclosure-has-popup[open] > .facets__summary::before {
   z-index: 2;
 }
@@ -268,6 +291,10 @@
   z-index: 1;
 }
 
+.facets__header facet-remove {
+  align-self: center;
+}
+
 .facets__list {
   padding: 0.5rem 2rem;
 }
@@ -768,14 +795,20 @@ details.menu-opening .mobile-facets__close svg {
 .mobile-facets__close-button {
   align-items: center;
   background-color: transparent;
-  display: flex;
   font-size: 1.4rem;
   font: inherit;
   letter-spacing: inherit;
   margin-top: 1.5rem;
   padding: 1.2rem 2.6rem;
   text-decoration: none;
-  width: calc(100% - 5.2rem);
+
+  display: grid;
+  grid-template-columns: min-content 1fr;
+  text-align: start;
+}
+
+.mobile-facets__close-button > .facets__and-helptext {
+  grid-column-start: 2;
 }
 
 .no-js .mobile-facets__close-button {
@@ -830,8 +863,7 @@ details.menu-opening .mobile-facets__close svg {
   margin-left: auto;
 }
 
-.mobile-facets__summary > div,
-.facets__summary > div {
+.mobile-facets__summary > div {
   display: flex;
   align-items: center;
 }

diff --git a/assets/facets.js b/assets/facets.js
@@ -126,13 +126,17 @@ class FacetFiltersForm extends HTMLElement {
 
     if (countsToRender) {
       const closestJSFilterID = event.target.closest('.js-filter').id;
-      const currentActiveID = document.activeElement.id;
 
       if (closestJSFilterID) {
         FacetFiltersForm.renderCounts(countsToRender, event.target.closest('.js-filter'));
         FacetFiltersForm.renderMobileCounts(countsToRender, document.getElementById(closestJSFilterID));
 
-        const newElementToActivate = document.getElementById(currentActiveID);
+        const newElementSelector = document
+          .getElementById(closestJSFilterID)
+          .classList.contains('mobile-facets__details')
+          ? `#${closestJSFilterID} .mobile-facets__close-button`
+          : `#${closestJSFilterID} .facets__summary`;
+        const newElementToActivate = document.querySelector(newElementSelector);
         if (newElementToActivate) newElementToActivate.focus();
       }
     }

diff --git a/locales/bg-BG.json b/locales/bg-BG.json
@@ -206,7 +206,8 @@
       "clear_filter": "Премахване на филтъра",
       "filter_selected_accessibility": "{{ type }} ({{ count }} избрани филтъра)",
       "show_more": "Покажи повече",
-      "show_less": "Покажи по-малко"
+      "show_less": "Покажи по-малко",
+      "filter_and_operator_subtitle": "Изрявняване за всички"
     }
   },
   "templates": {

diff --git a/locales/cs.json b/locales/cs.json
@@ -214,7 +214,8 @@
       "clear_filter": "Odebrat filtr",
       "filter_selected_accessibility": "{{ type }} (počet vybraných filtrů: {{ count }})",
       "show_more": "Zobrazit více",
-      "show_less": "Zobrazit méně"
+      "show_less": "Zobrazit méně",
+      "filter_and_operator_subtitle": "Shoda se všemi kritérii"
     }
   },
   "templates": {

diff --git a/locales/da.json b/locales/da.json
@@ -206,7 +206,8 @@
       "clear_filter": "Fjern filter",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtre er valgt)",
       "show_more": "Vis mere",
-      "show_less": "Vis mindre"
+      "show_less": "Vis mindre",
+      "filter_and_operator_subtitle": "Match alle"
     }
   },
   "templates": {

diff --git a/locales/de.json b/locales/de.json
@@ -206,7 +206,8 @@
       "clear_filter": "Filter entfernen",
       "filter_selected_accessibility": "{{ type }} ({{ count }} Filter ausgewählt)",
       "show_more": "Mehr anzeigen",
-      "show_less": "Weniger anzeigen"
+      "show_less": "Weniger anzeigen",
+      "filter_and_operator_subtitle": "Allen entsprechen"
     }
   },
   "templates": {

diff --git a/locales/el.json b/locales/el.json
@@ -206,7 +206,8 @@
       "clear_filter": "Κατάργηση φίλτρου",
       "filter_selected_accessibility": "{{ type }} (επιλέχθηκαν {{ count }} φίλτρα)",
       "show_more": "Εμφάνιση περισσότερων",
-      "show_less": "Εμφάνιση λιγότερων"
+      "show_less": "Εμφάνιση λιγότερων",
+      "filter_and_operator_subtitle": "Αντιστοιχεί με όλα"
     }
   },
   "templates": {

diff --git a/locales/en.default.json b/locales/en.default.json
@@ -179,6 +179,7 @@
       "label": "Media gallery"
     },
     "facets": {
+      "filter_and_operator_subtitle": "Match all",
       "apply": "Apply",
       "clear": "Clear",
       "clear_all": "Remove all",

diff --git a/locales/es.json b/locales/es.json
@@ -210,7 +210,8 @@
       "clear_filter": "Eliminar filtro",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtros seleccionados)",
       "show_more": "Mostrar más",
-      "show_less": "Mostrar menos"
+      "show_less": "Mostrar menos",
+      "filter_and_operator_subtitle": "Seleccionar todos"
     }
   },
   "templates": {

diff --git a/locales/fi.json b/locales/fi.json
@@ -206,7 +206,8 @@
       "clear_filter": "Poista suodatin",
       "filter_selected_accessibility": "{{ type }} ({{ count }} suodatinta valittu)",
       "show_more": "Näytä enemmän",
-      "show_less": "Näytä vähemmän"
+      "show_less": "Näytä vähemmän",
+      "filter_and_operator_subtitle": "Sovella kaikkia"
     }
   },
   "templates": {

diff --git a/locales/fr.json b/locales/fr.json
@@ -210,7 +210,8 @@
       "clear_filter": "Supprimer le filtre",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtres sélectionnés)",
       "show_more": "Afficher plus",
-      "show_less": "Afficher moins"
+      "show_less": "Afficher moins",
+      "filter_and_operator_subtitle": "Tout associer"
     }
   },
   "templates": {

diff --git a/locales/hr-HR.json b/locales/hr-HR.json
@@ -210,7 +210,8 @@
       "clear_filter": "Ukloni filtar",
       "filter_selected_accessibility": "{{ type }} (broj odabranih filtra: {{ count }})",
       "show_more": "Prikaži više",
-      "show_less": "Prikaži manje"
+      "show_less": "Prikaži manje",
+      "filter_and_operator_subtitle": "Uskladi sve"
     }
   },
   "templates": {

diff --git a/locales/hu.json b/locales/hu.json
@@ -206,7 +206,8 @@
       "clear_filter": "Szűrő eltávolítása",
       "filter_selected_accessibility": "{{ type }} ({{ count }} szűrő kiválasztva)",
       "show_more": "Több részlet",
-      "show_less": "Kevesebb részlet"
+      "show_less": "Kevesebb részlet",
+      "filter_and_operator_subtitle": "Az összesnek megfelelő"
     }
   },
   "templates": {

diff --git a/locales/id.json b/locales/id.json
@@ -206,7 +206,8 @@
       "clear_filter": "Hapus filter",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filter dipilih)",
       "show_more": "Selengkapnya",
-      "show_less": "Sembunyikan lainnya"
+      "show_less": "Sembunyikan lainnya",
+      "filter_and_operator_subtitle": "Cocokkan semua"
     }
   },
   "templates": {

diff --git a/locales/it.json b/locales/it.json
@@ -210,7 +210,8 @@
       "clear_filter": "Rimuovi filtri",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtri selezionati)",
       "show_more": "Mostra di più",
-      "show_less": "Mostra di meno"
+      "show_less": "Mostra di meno",
+      "filter_and_operator_subtitle": "Seleziona tutte"
     }
   },
   "templates": {

diff --git a/locales/ja.json b/locales/ja.json
@@ -206,7 +206,8 @@
       "clear_filter": "絞り込みを削除する",
       "filter_selected_accessibility": "{{ type }} ({{ count }}件のフィルターを選択済み)",
       "show_more": "さらに表示する",
-      "show_less": "表示を減らす"
+      "show_less": "表示を減らす",
+      "filter_and_operator_subtitle": "すべて一致"
     }
   },
   "templates": {

diff --git a/locales/ko.json b/locales/ko.json
@@ -206,7 +206,8 @@
       "clear_filter": "필터 제거",
       "filter_selected_accessibility": "{{ type }}({{ count }}개 필터 선택됨)",
       "show_more": "자세히 표시",
-      "show_less": "간단히 표시"
+      "show_less": "간단히 표시",
+      "filter_and_operator_subtitle": "모두 일치"
     }
   },
   "templates": {

diff --git a/locales/lt-LT.json b/locales/lt-LT.json
@@ -214,7 +214,8 @@
       "clear_filter": "Pašalinti filtrą",
       "filter_selected_accessibility": "{{ type }} (pasirinkta filtrų: {{ count }})",
       "show_more": "Rodyti daugiau",
-      "show_less": "Rodyti mažiau"
+      "show_less": "Rodyti mažiau",
+      "filter_and_operator_subtitle": "Atitikti visas"
     }
   },
   "templates": {

diff --git a/locales/nb.json b/locales/nb.json
@@ -206,7 +206,8 @@
       "clear_filter": "Fjern filter",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtre valgt)",
       "show_more": "Vis mer",
-      "show_less": "Vis færre"
+      "show_less": "Vis færre",
+      "filter_and_operator_subtitle": "Match alle"
     }
   },
   "templates": {

diff --git a/locales/nl.json b/locales/nl.json
@@ -206,7 +206,8 @@
       "clear_filter": "Filter verwijderen",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filters geselecteerd)",
       "show_more": "Meer weergeven",
-      "show_less": "Minder weergeven"
+      "show_less": "Minder weergeven",
+      "filter_and_operator_subtitle": "Alles matchen"
     }
   },
   "templates": {

diff --git a/locales/pl.json b/locales/pl.json
@@ -214,7 +214,8 @@
       "clear_filter": "Usuń filtr",
       "filter_selected_accessibility": "{{ type }} (wybrano {{ count }} fitry(-ów))",
       "show_more": "Pokaż więcej",
-      "show_less": "Pokaż mniej"
+      "show_less": "Pokaż mniej",
+      "filter_and_operator_subtitle": "Dopasuj wszystko"
     }
   },
   "templates": {

diff --git a/locales/pt-BR.json b/locales/pt-BR.json
@@ -210,7 +210,8 @@
       "clear_filter": "Remover filtro",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtros selecionados)",
       "show_more": "Exibir mais",
-      "show_less": "Exibir menos"
+      "show_less": "Exibir menos",
+      "filter_and_operator_subtitle": "Corresponder todos"
     }
   },
   "templates": {

diff --git a/locales/pt-PT.json b/locales/pt-PT.json
@@ -210,7 +210,8 @@
       "clear_filter": "Remover filtro",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtros selecionados)",
       "show_more": "Mostrar mais",
-      "show_less": "Mostrar menos"
+      "show_less": "Mostrar menos",
+      "filter_and_operator_subtitle": "Corresponder todos"
     }
   },
   "templates": {

diff --git a/locales/ro-RO.json b/locales/ro-RO.json
@@ -210,7 +210,8 @@
       "clear_filter": "Elimină filtrul",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtre selectate)",
       "show_more": "Afișează mai mult",
-      "show_less": "Afișează mai puțin"
+      "show_less": "Afișează mai puțin",
+      "filter_and_operator_subtitle": "Potrivește-le pe toate"
     }
   },
   "templates": {

diff --git a/locales/ru.json b/locales/ru.json
@@ -214,7 +214,8 @@
       "clear_filter": "Снять фильтр",
       "filter_selected_accessibility": "{{ type }} (установлены фильтры: {{ count }})",
       "show_more": "Показать больше",
-      "show_less": "Показать меньше"
+      "show_less": "Показать меньше",
+      "filter_and_operator_subtitle": "Выбрать все"
     }
   },
   "templates": {

diff --git a/locales/sk-SK.json b/locales/sk-SK.json
@@ -214,7 +214,8 @@
       "clear_filter": "Odstrániť filter",
       "filter_selected_accessibility": "{{ type }} (vybrané filtre: {{ count }})",
       "show_more": "Zobraziť viac",
-      "show_less": "Zobraziť menej"
+      "show_less": "Zobraziť menej",
+      "filter_and_operator_subtitle": "Spĺňať všetko"
     }
   },
   "templates": {

diff --git a/locales/sl-SI.json b/locales/sl-SI.json
@@ -214,7 +214,8 @@
       "clear_filter": "Odstrani filter",
       "filter_selected_accessibility": "{{ type }} (št. izbranih filtrov: {{ count }})",
       "show_more": "Prikaži več",
-      "show_less": "Prikaži manj"
+      "show_less": "Prikaži manj",
+      "filter_and_operator_subtitle": "Ustreza vsem"
     }
   },
   "templates": {

diff --git a/locales/sv.json b/locales/sv.json
@@ -206,7 +206,8 @@
       "clear_filter": "Ta bort filter",
       "filter_selected_accessibility": "{{ type }} ({{ count }}) filter valda",
       "show_more": "Visa mer",
-      "show_less": "Visa mindre"
+      "show_less": "Visa mindre",
+      "filter_and_operator_subtitle": "Matcha alla"
     }
   },
   "templates": {

diff --git a/locales/th.json b/locales/th.json
@@ -206,7 +206,8 @@
       "clear_filter": "ลบตัวกรองออก",
       "filter_selected_accessibility": "{{ type }} (เลือกตัวกรองแล้ว {{ count }} รายการ)",
       "show_more": "แสดงมากขึ้น",
-      "show_less": "แสดงน้อยลง"
+      "show_less": "แสดงน้อยลง",
+      "filter_and_operator_subtitle": "ที่ตรงกันทั้งหมด"
     }
   },
   "templates": {

diff --git a/locales/tr.json b/locales/tr.json
@@ -206,7 +206,8 @@
       "clear_filter": "Filtreyi kaldır",
       "filter_selected_accessibility": "{{ type }} ({{ count }} filtre seçildi)",
       "show_more": "Daha fazla göster",
-      "show_less": "Daha az göster"
+      "show_less": "Daha az göster",
+      "filter_and_operator_subtitle": "Tümünü eşleştir"
     }
   },
   "templates": {

diff --git a/locales/vi.json b/locales/vi.json
@@ -206,7 +206,8 @@
       "clear_filter": "Xóa bộ lọc",
       "filter_selected_accessibility": "{{ type }} (Đã chọn {{ count }} bộ lọc)",
       "show_more": "Hiển thị thêm",
-      "show_less": "Rút gọn"
+      "show_less": "Rút gọn",
+      "filter_and_operator_subtitle": "Phù hợp với tất cả"
     }
   },
   "templates": {

diff --git a/locales/zh-CN.json b/locales/zh-CN.json
@@ -206,7 +206,8 @@
       "clear_filter": "删除筛选条件",
       "filter_selected_accessibility": "{{ type }}（已选择 {{ count }} 个筛选条件）",
       "show_more": "显示更多内容",
-      "show_less": "隐藏部分内容"
+      "show_less": "隐藏部分内容",
+      "filter_and_operator_subtitle": "匹配全部"
     }
   },
   "templates": {