Add fragment IDs to site FAQs

docs/index.css

@@ -265,6 +265,11 @@ body {
 .faq {
     box-sizing: content-box;
     overflow-x: auto;
+    
+}
+
+.faq:target {
+    border-color: var(--blue-50) !important;
 }
 
 .faq__summary {
@@ -275,6 +280,7 @@ body {
     -webkit-user-select: none;
     user-select: none;
 }
+
 .faq__content {
     max-width: 70rem;
     padding: 2rem;

docs/index.js

@@ -1,5 +1,19 @@
 "use strict";
 
+// Set FAQ fragment IDs
+for (const faq of document.querySelectorAll(".faq")) {
+    const summary = faq.querySelector(".faq__summary");
+    const formattedSummary = summary.textContent.trim().replace(/ /g, "_");
+
+    faq.id = formattedSummary;
+
+    if (window.location.hash) {
+        faq.open = decodeURIComponent(
+                window.location.hash.slice(1)) === formattedSummary;
+    }
+}
+
+
 function updateThemeClass (mediaQuery) {
     if (mediaQuery.matches) {
         document.documentElement.classList.remove("theme-dark");