From ca55562bbc97ec2fb342aa94b997daef15a2d5a2 Mon Sep 17 00:00:00 2001
From: Michael An <1822852997@qq.com>
Date: Fri, 26 Apr 2019 15:33:11 +0800
Subject: [PATCH] fix history page

---
 frontend/src/css/file-history-old.css |  1 +
 frontend/src/file-history-old.js      | 35 +++++++++++++--------------
 2 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/frontend/src/css/file-history-old.css b/frontend/src/css/file-history-old.css
index bbf5e33745..9700b75fff 100644
--- a/frontend/src/css/file-history-old.css
+++ b/frontend/src/css/file-history-old.css
@@ -68,6 +68,7 @@
   width: 16px;
   height: 16px;
   border-radius: 2px;
+  vertical-align: middle;
 }
 
 .old-history-main .commit-list .username {
diff --git a/frontend/src/file-history-old.js b/frontend/src/file-history-old.js
index e769364dcd..91ae395e45 100644
--- a/frontend/src/file-history-old.js
+++ b/frontend/src/file-history-old.js
@@ -203,24 +203,23 @@ class FileHistory extends React.Component {
         </div>
         <div id="main" onScroll={this.onScrollHandler}>
           <div className="old-history-main">
-            <div>
+            <Fragment>
               <a href="javascript:window.history.back()" className="go-back" title="Back">
                 <span className="fas fa-chevron-left"></span>
               </a>
               <h2><span className="file-name">{fileName}</span>{' '}{gettext('History Versions')}</h2>
-            </div>
-            <div>
-              {this.state.isLoading && <Loading />}
-              {!this.state.isLoading &&
-                <table className="commit-list">
-                  <thead>
-                    <tr>
-                      <th width="40%" >{gettext('Time')}</th>
-                      <th width="30%" >{gettext('Modifier')}</th>
-                      <th width="25%" >{gettext('Size')}</th>
-                      <th width="5%" ></th>
-                    </tr>
-                  </thead>
+            </Fragment>
+            <Fragment>
+              <table className="commit-list">
+                <thead>
+                  <tr>
+                    <th width="40%" >{gettext('Time')}</th>
+                    <th width="30%" >{gettext('Modifier')}</th>
+                    <th width="25%" >{gettext('Size')}</th>
+                    <th width="5%" ></th>
+                  </tr>
+                </thead>
+                {!this.state.isLoading &&
                   <tbody>
                     {this.state.historyList.map((item, index) => {
                       return (
@@ -235,13 +234,13 @@ class FileHistory extends React.Component {
                       );
                     })}
                   </tbody>
-                </table>
-              }
-              {this.state.isReloadingData && <Loading />}
+                }
+              </table>
+              {(this.state.isReloadingData || this.state.isLoading) && <Loading />}
               {this.state.nextCommit && !this.state.isLoading && !this.state.isReloadingData &&
                 <Button className="get-more-btn" onClick={this.reloadMore}>{gettext('More')}</Button>
               }
-            </div>
+            </Fragment>
           </div>
         </div>
       </Fragment>