Add JS to linkify in-page H1-H6 (#9751)

layouts/docs/baseof.html

@@ -48,5 +48,22 @@
     </div>
 		{{ partialCached "footer.html" . }}
 		{{ partialCached "footer-scripts.html" . }}
+    <script>
+      // This script turns in-page headers into clickable and shareable
+      (function addHeadingLinks(){
+        var article = document.getElementById('docsContent');
+        var headings = article.querySelectorAll('h1, h2, h3, h4, h5, h6');
+        headings.forEach(function(heading){
+          if(heading.id){
+            var a = document.createElement('a');
+            a.text = heading.innerHTML;
+            a.href = '#'+heading.id;
+            a.classList.add('inpage_heading');
+            heading.innerHTML = '';
+            heading.appendChild(a);
+          }
+        });
+      })();
+    </script>
 	</body>
 </html>

static/css/custom-jekyll/tags.css

@@ -54,3 +54,14 @@
     visibility: visible;
     opacity: 1;
 }
+
+/* In-page section heading permalinks */
+a.inpage_heading {
+  color: #000;
+  text-decoration: none !important;
+}
+
+a.inpage_heading:hover {
+  text-decoration: underline !important;
+  opacity: .8;
+}