feat: add link icon next to headings

src/css/base/_reset.scss

@@ -46,6 +46,7 @@ a:hover {
 .headerlink {
   margin-left: 5px;
   visibility: hidden;
+  color: var(--text-muted);
 }
 
 .toc-backref:hover {

src/css/components/_content.scss

@@ -3,8 +3,6 @@
   background-color: var(--bg-color);
 }
 
-
-
 .content {
   overflow-wrap: break-word;
   width: 100%;

src/css/components/_tooltips.scss

@@ -25,4 +25,8 @@
   cursor: help;
   text-decoration: underline;
   text-decoration-style: dotted;
+}
+
+.content .copybtn {
+  cursor: pointer;
 }

src/js/content.js

@@ -0,0 +1,13 @@
+export class ContentHandler {
+
+    constructor() {
+    }
+
+    init() {
+        const headerLinks = document.querySelectorAll('.headerlink');
+
+        headerLinks.forEach(link => {
+            link.innerHTML = '<i class="icon-link"></i>';
+        });
+    }
+}

src/js/index.js

@@ -7,6 +7,7 @@ require("../css/main.scss");
 require("foundation-sites/dist/js/foundation");
 
 import { CollapseHandler} from "./collapse";
+import { ContentHandler} from "./content";
 import { ImagesHandler } from "./images";
 import { LinksHandler } from "./links";
 import { PromoBannerHandler } from "./promo-banner";
@@ -18,6 +19,7 @@ import {DarkTheme} from "./dark-theme";
 $(document).ready(function () {
   new ImagesHandler().init();
   $(document).foundation();
+  new ContentHandler().init();
   new TablesHandler().init();
   new DarkTheme().init();
   new LinksHandler().init();