add pager in commit-page, finish commit search form

2 files changed, 25 insertions, 7 deletions

diff --git a/public/css/gogs.css b/public/css/gogs.css
index 2850d15e2e..48d485fa5a 100755
--- a/public/css/gogs.css
+++ b/public/css/gogs.css
@@ -663,6 +663,10 @@ html, body {
     margin-top: -20px;
 }
 
+#commits-pager {
+    margin-top: 0;
+}
+
 #source .source-toolbar:after {
     clear: both;
 }
@@ -880,6 +884,10 @@ html, body {
     margin-left: .5em;
 }
 
+#commits-search-form {
+    margin-top: 4px;
+}
+
 .commit-box .avatar, .diff-head-box .avatar {
     width: 20px;
     height: 20px;
@@ -887,10 +895,6 @@ html, body {
     vertical-align: top;
 }
 
-.commit-box .search {
-    margin-top: 3px;
-}
-
 .commit-box td {
     background-color: #FFF;
 }
diff --git a/templates/repo/commits.tmpl b/templates/repo/commits.tmpl
index efe35936c4..842a2a6d8f 100644
--- a/templates/repo/commits.tmpl
+++ b/templates/repo/commits.tmpl
@@ -6,9 +6,14 @@
     <div id="commits">
         <div class="panel panel-default commit-box info-box">
             <div class="panel-heading info-head">
-                <div class="search pull-right form">
-                    <input class="form-control search" type="search" placeholder="search commit"/>
-                </div>
+                <form class="search pull-right col-md-3" action="" method="post" id="commits-search-form">
+                    <div class="input-group">
+                        <input class="form-control search" type="search" placeholder="search commit" name="q"/>
+                        <div class="input-group-btn">
+                            <button type="button" class="btn btn-default">Find</button>
+                        </div>
+                    </div>
+                </form>
                 <h4>{{.CommitCount}} Commits</h4>
             </div>
             <table class="panel-footer table commit-list table table-striped">
@@ -35,6 +40,15 @@
                 </tbody>
             </table>
         </div>
+        <ul class="pagination" id="commits-pager">
+            <li><a href="#">&laquo;</a></li>
+            <li><a href="#">1</a></li>
+            <li><a href="#">2</a></li>
+            <li><a href="#">3</a></li>
+            <li><a href="#">4</a></li>
+            <li><a href="#">5</a></li>
+            <li><a href="#">&raquo;</a></li>
+        </ul>
     </div>
 </div>
 {{template "base/footer" .}}