Added anchors for document headings

src/components/Document/Document.js

@@ -20,7 +20,10 @@ class Document extends React.Component {
           name={ this.props.document.user.name }
           timestamp={ this.props.document.createdAt }
         />
-        <div dangerouslySetInnerHTML={{ __html: this.props.document.html }} />
+        <div
+          className={ styles.document }
+          dangerouslySetInnerHTML={{ __html: this.props.document.html }}
+        />
       </div>
     );
   }

src/components/Document/Document.scss

@@ -2,3 +2,28 @@
   width: 100%;
   padding: 20px;
 }
+
+.document {
+  h1, h2, h3, h4, h5, h6 {
+    :global {
+      .anchor {
+        visibility: hidden;
+        background-image: url('../../assets/icons/anchor.svg');
+        background-repeat: no-repeat;
+        background-size: 100%;
+        background-position: 0 center;
+        margin-left: -26px;
+        width: 20px;
+        display: inline-block;
+      }
+    }
+
+    &:hover {
+      :global {
+        .anchor {
+          visibility: visible;
+        }
+      }
+    }
+  }
+}