commentout unuse code, add css , fix design

src/client/js/components/PageHistory/RevisionDiff.jsx

@@ -1,8 +1,10 @@
+/* eslint-disable react/no-danger */
 import React from 'react';
 import PropTypes from 'prop-types';
 
 import { createPatch } from 'diff';
 import { html } from 'diff2html';
+import UserDate from '../User/UserDate';
 
 export default class RevisionDiff extends React.Component {
 
@@ -39,7 +41,23 @@ export default class RevisionDiff extends React.Component {
 
     const diffView = { __html: diffViewHTML };
     // eslint-disable-next-line react/no-danger
-    return <div className="revision-history-diff" dangerouslySetInnerHTML={diffView} />;
+    return (
+      <>
+        <div className="comparison-header">
+          <span>ソース <UserDate dateTime={previousRevision.createdAt} />
+            <a href={`?revision=${previousRevision._id}`} className="ml-2">
+              <i className="icon-login"></i>
+            </a>
+          </span>
+          <span>ターゲット <UserDate dateTime={currentRevision.createdAt} />
+            <a href={`?revision=${currentRevision._id}`} className="ml-2">
+              <i className="icon-login"></i>
+            </a>
+          </span>
+        </div>
+        <div className="revision-history-diff" dangerouslySetInnerHTML={diffView} />
+      </>
+    );
   }
 
 }

src/client/js/components/RevisionComparer/RevisionComparer.jsx

@@ -56,9 +56,9 @@ const RevisionComparer = (props) => {
     <div className="revision-compare">
       <div className="d-flex">
         <h3 className="align-self-center mb-0">{ t('page_history.comparing_revisions') }</h3>
-        <div className="align-self-center ml-3">
+        {/* <div className="align-self-center ml-3">
           <div className="custom-control custom-switch">
-            {/* <input
+            <input
               type="checkbox"
               className="custom-control-input"
               id="comparingWithLatest"
@@ -67,9 +67,9 @@ const RevisionComparer = (props) => {
             />
             <label className="custom-control-label" htmlFor="comparingWithLatest">
               { t('page_history.comparing_with_latest') }
-            </label> */}
+            </label>
           </div>
-        </div>
+        </div> */}
         <Dropdown
           className="grw-copy-dropdown align-self-center ml-auto"
           isOpen={dropdownOpen}

src/client/styles/scss/_page-history.scss

@@ -63,11 +63,20 @@
     }
   }
 
+  .comparison-header {
+    height: 35px;
+    padding: 5px 10px;
+    background-color: white;
+    border: 1px solid #d8d8d8;
+  }
   .revision-compare {
     .revision-compare-outer {
       min-height: 100px;
       max-height: 250px;
       overflow: auto;
     }
+    .d2h-file-header {
+      display: none;
+    }
   }
 }