facet hide

js/facet-hide.js

@@ -0,0 +1,13 @@
+document.addEventListener('DOMContentLoaded', function() {
+  const toggleButton = document.getElementById('toggle-facets');
+  const facets = document.querySelectorAll('.region--sidebar .block'); // Scope to sidebar
+
+  toggleButton.addEventListener('click', function() {
+    const isHidden = facets[0].style.display === 'none' || !facets[0].style.display; // Assume initial 'none' from CSS
+    const newDisplay = isHidden ? 'block' : 'none';
+
+    facets.forEach(facet => {
+      facet.style.display = newDisplay;
+    });
+  });
+});

olivesbdh.libraries.yml

@@ -56,7 +56,7 @@ global-styling:
 
   js:
     js/checkbox.js: {}
-
+    js/facet-hide.js: {}
   dependencies:
     - core/drupal
     - core/once

templates/layout/region--sidebar.html.twig

@@ -23,6 +23,7 @@
 
 {% if content %}
   <aside{{ attributes.addClass(classes) }}>
+	<button id="toggle-facets">Toggle Facets</button>
     {{ content }}
   </aside>
 {% endif %}