Hide title anchors on edit mode preview

frontend/scenes/DocumentEdit/DocumentEdit.scss

@@ -1,14 +1,5 @@
 @import '~styles/constants.scss';
 
-.preview {
-  display: flex;
-  flex: 1;
-  padding: 50px 0;
-  padding: 50px 3em;
-  max-width: 50em;
-  line-height: 1.5em;
-}
-
 .container {
   display: flex;
   position: fixed;

frontend/scenes/DocumentEdit/components/Preview/Preview.js

@@ -2,13 +2,13 @@ import React from 'react';
 
 import { DocumentHtml } from 'components/Document';
 
-import styles from '../DocumentEdit.scss';
+import styles from './Preview.scss';
 import classNames from 'classnames/bind';
 const cx = classNames.bind(styles);
 
 const Preview = (props) => {
   return (
-    <div className={ styles.preview }>
+    <div className={ cx(styles.container) }>
       <DocumentHtml html={ props.html } />
     </div>
   );
@@ -18,4 +18,4 @@ Preview.propTypes = {
   html: React.PropTypes.string.isRequired,
 };
 
-export default Preview;
+export default Preview;

frontend/scenes/DocumentEdit/components/Preview/Preview.scss

@@ -0,0 +1,14 @@
+.container {
+  display: flex;
+  flex: 1;
+  padding: 50px 0;
+  padding: 50px 3em;
+  max-width: 50em;
+  line-height: 1.5em;
+}
+
+.container :global {
+  h1:hover .anchor {
+    visibility: hidden;
+  }
+}

frontend/scenes/DocumentEdit/components/Preview/index.js

@@ -0,0 +1,2 @@
+import Preview from './Preview';
+export default Preview;