From 1917c273be554dcd44f95ed83798f4583f6e9370 Mon Sep 17 00:00:00 2001
From: hensm <m+github@matt.tf>
Date: Wed, 25 Sep 2019 16:16:29 +0100
Subject: [PATCH] Add fragment IDs to site FAQs

---
 docs/index.css |  6 ++++++
 docs/index.js  | 14 ++++++++++++++
 2 files changed, 20 insertions(+)

diff --git a/docs/index.css b/docs/index.css
index ffd055c..24ae81d 100755
--- a/docs/index.css
+++ b/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;
diff --git a/docs/index.js b/docs/index.js
index 84d40e6..0a854ea 100644
--- a/docs/index.js
+++ b/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");