From d34c6d9d75b6849c0642b8eb3f7172c6eae59e4b Mon Sep 17 00:00:00 2001
From: rdrew <rdrew@upei.ca>
Date: Fri, 10 Oct 2025 11:28:14 -0300
Subject: [PATCH] added icon

---
 css/mobile_facets.css | 8 +++++---
 js/mobile_facets.js   | 4 +++-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/css/mobile_facets.css b/css/mobile_facets.css
index bec8836..efed2d2 100755
--- a/css/mobile_facets.css
+++ b/css/mobile_facets.css
@@ -15,16 +15,18 @@
   }
   #toggle-facets {
     background-color: var(--color--bdh-red);
-  transition: filter 0.2s ease; /* Optional: smooth transition */
-  font-size:1em;
+    transition: filter 0.2s ease;
+    font-size: 1em;
     color: white;
     border: none;
     padding: 10px 15px;
     border-radius: 4px;
     cursor: pointer;
-    /*temp*/
     display: block;
     width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     &:hover {
       filter: brightness(1.5); /* Lightens by 10% */
     }
diff --git a/js/mobile_facets.js b/js/mobile_facets.js
index f73bbc2..059ce74 100755
--- a/js/mobile_facets.js
+++ b/js/mobile_facets.js
@@ -1,5 +1,6 @@
 (function (Drupal) {  // Select the parent container
   const sidebar = document.querySelector('.region--sidebar');  // Check if the element exists
+  const buttonText = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M480 272C480 317.9 465.1 360.3 440 394.7L566.6 521.4C579.1 533.9 579.1 554.2 566.6 566.7C554.1 579.2 533.8 579.2 521.3 566.7L394.7 440C360.3 465.1 317.9 480 272 480C157.1 480 64 386.9 64 272C64 157.1 157.1 64 272 64C386.9 64 480 157.1 480 272zM272 416C351.5 416 416 351.5 416 272C416 192.5 351.5 128 272 128C192.5 128 128 192.5 128 272C128 351.5 192.5 416 272 416z"/></svg> Search the Collection'
   if (sidebar) {
     // Get all direct children
     const children = Array.from(sidebar.children);// Create the wrapper div
@@ -22,7 +23,8 @@
       // Create the button element
       const button = document.createElement('button');
       button.id = 'toggle-facets';
-      button.textContent = 'Search the Collection';
+      //button.textContent = 'Search the Collection';
+      button.innerHtml = buttonText;
 
       // Insert the button before the wrapper
       sidebar.insertBefore(button, wrapper);