Show answer by url hash fragment

Show the answer of the question if there is a hash fragment in the url. Suitable when sending url with id of question.  Until now, the answer has not been shown.

styles/_pages.scss

@@ -368,28 +368,10 @@
     padding-right: 3rem; // don't overlap chevron
     // margin-bottom: 1.5rem; // this is enough space when a banner isn't active
     margin-bottom: 3.5rem; // give space so anchor-fix doesn't block clicks
-
+    position: relative;
+    z-index: 5;
     width: 100%;
 
-    &::before {
-      display: block;
-      content: " ";
-      margin-top: -80px;
-      height: 80px;
-      visibility: hidden;
-    }
-
-    > a {
-      text-decoration: none;
-      position: relative;
-      z-index: 5;
-
-      &:hover {
-        text-decoration: underline;
-        color: $white;
-      }
-    }
-
     p a {
       text-decoration: none;
       font-weight: 600;
@@ -401,32 +383,39 @@
     }
 
     h4 {
-      position: relative;
       font-size: 1.25rem;
       line-height: 1.625rem;
       margin-top: 0;
 
+      &::before {
+        display: block;
+        content: " ";
+        margin-top: -80px;
+        height: 80px;
+        visibility: hidden;
+      }
+
+      > a {
+        text-decoration: none;
+
+        &:hover {
+          text-decoration: underline;
+          color: $black;
+        }
+      }
+
       @include media-breakpoint-down(md) {
         font-size: 1rem;
         line-height: 1.5rem;
       }
 
-      // Stop anchor-fix from blocking clicks on earlier FAQ items
-      &::before {
-        content: none;
-      }
-
-      > a {
-        position: relative;
-        z-index: 3;
+      .chevron {
+        position: absolute;
+        top: 40px;
+        right: 2rem;
       }
     }
 
-    .chevron {
-      position: absolute;
-      top: 10px; // Compensate for anchor-fix ::before size
-      right: -1rem;
-    }
   }
 }
 

template/page-faq2.html.jinja

@@ -1,4 +1,11 @@
 {% extends "pagetype-doc.html.jinja" %}
+{% block head %}
+    <script>
+        $(document).ready(function() {
+            $(window.location.hash).closest(".q-wrapper").find('.answer-wrapper').collapse('show');
+        });
+    </script>
+{% endblock %}
 
 {% block bodyclasses %}page-faq landing-builtin-bg{% endblock %}
 {% block breadcrumbs %}{% endblock %}

tool/filter_faq.py

@@ -47,13 +47,18 @@ def wrap_question(soup, qi, q, elements):
     q_toggler["aria-controls"] = "a{qi}".format(qi=qi)
     q_toggler["aria-expanded"] = "false"
     q_toggler["class"] = "expander collapsed"
+    q_toggler.insert(0, q.text)
+
+    q_id = "{qid}".format(qid=q["id"])
+    q = soup.new_tag("h4")
+    q["id"] = q_id
 
     # Strip out permalinks since that would be a link inside a link (invalid)
     [a.decompose() for a in q.find_all("a")]
 
-    append_chevron(soup, q)
-    q_toggler.insert(0, q)
-    q_wrapper.insert(0, q_toggler)
+    append_chevron(soup, q_toggler)
+    q.insert(0, q_toggler)
+    q_wrapper.insert(0, q)
     return q_wrapper
 
 def wrap_section(soup, elements):