Fix Dropdown Arrow Direction for “Latest New 2025”

themes/grass/layouts/news/allnews.html

@@ -57,19 +57,17 @@ <h2 class="page-title">{{ .Title }}</h2>
             <div class="mb-4">
 
               <!-- YEAR TITLE WITH ICON -->
-              <a class="d-block h3 text-dark text-decoration-none"
-                 data-bs-toggle="collapse"
-                 href="#{{ $collapseID }}"
-                 aria-expanded="{{ if eq $year $currentYear }}true{{ else }}false{{ end }}">
-
-                {{ if eq $year $currentYear }}
-                  <i class="fa-solid fa-chevron-up me-2"></i>{{ $year }}
-                {{ else }}
-                  <i class="fa-solid fa-chevron-down me-2"></i>{{ $year }}
-                {{ end }}
-
-              </a>
-
+<a class="d-block h3 text-dark text-decoration-none"
+   data-bs-toggle="collapse"
+   data-bs-target="#{{ $collapseID }}"
+   aria-expanded="{{ if eq $year $currentYear }}true{{ else }}false{{ end }}"
+   aria-controls="{{ $collapseID }}">
+
+  <i id="icon-{{ $collapseID }}"
+     class="fa-solid {{ if eq $year $currentYear }}fa-chevron-up{{ else }}fa-chevron-down{{ end }} me-2">
+      </i>
+  {{ $year }}
+</a>
               <!-- POSTS -->
               <div id="{{ $collapseID }}"
                    class="collapse {{ if eq $year $currentYear }}show{{ end }}">
@@ -146,3 +144,24 @@ <h4 class="h6 mb-1">
 </section>
 
 {{ partial "footer.html" . }}
+
+<script>
+document.addEventListener("DOMContentLoaded", function () {
+  document.querySelectorAll('[data-bs-toggle="collapse"]').forEach(function (toggle) {
+    toggle.addEventListener("click", function () {
+      const targetId = toggle.getAttribute("data-bs-target");
+      const icon = document.querySelector("#icon-" + targetId.replace("#", ""));
+      if (!icon) return;
+      const target = document.querySelector(targetId);
+      target.addEventListener("shown.bs.collapse", function () {
+        icon.classList.remove("fa-chevron-down");
+        icon.classList.add("fa-chevron-up");
+      });
+      target.addEventListener("hidden.bs.collapse", function () {
+        icon.classList.remove("fa-chevron-up");
+        icon.classList.add("fa-chevron-down");
+      });
+    });
+  });
+});
+</script>

themes/grass/layouts/partials/footer.html

@@ -61,7 +61,9 @@ <h6 class="text-uppercase text-light">Contribute</h6>
       <!-- Left column: Copyright et al -->
       <div class="col-md-6 text-md-left text-center">
         <p class="mb-0 text-light small">
+
            {{ with .Site.Copyright }}
+
           &copy; {{ replace . "{year}" now.Year }} &nbsp;|&nbsp;
           <a href="/about/license/" class="text-light">License</a> &nbsp;|&nbsp;
           <a href="/about/privacy/" class="text-light">Privacy</a> &nbsp;|&nbsp;

themes/grass/layouts/partials/navigation.html

@@ -54,4 +54,7 @@
             }
         </script>
     </div>
-</nav>
+</nav>
+<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script> 
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>