diff --git a/src/main/twirl/gitbucket/core/index.scala.html b/src/main/twirl/gitbucket/core/index.scala.html
index 035dde6..5d499dc 100644
--- a/src/main/twirl/gitbucket/core/index.scala.html
+++ b/src/main/twirl/gitbucket/core/index.scala.html
@@ -22,7 +22,7 @@
           </div>
         }
         @if(loginAccount.isEmpty){
-          @signinform(settings)
+          <div id="dashboard-signin-form">@signinform(settings)</div>
         } else {
           <div class="panel panel-default">
             <div class="panel-heading strong">
diff --git a/src/main/twirl/gitbucket/core/menu.scala.html b/src/main/twirl/gitbucket/core/menu.scala.html
index 465f1ff..f392792 100644
--- a/src/main/twirl/gitbucket/core/menu.scala.html
+++ b/src/main/twirl/gitbucket/core/menu.scala.html
@@ -10,12 +10,11 @@
 @import gitbucket.core.service.RepositoryService._
 
 @sidemenu(path: String, name: String, icon: String, label: String, count: Int = 0) = {
-  <li @if(active == name){class="active"} @if(!expand){data-toggle="tooltip" data-placement="left" data-original-title="@label"}>
+  <li @if(active == name){class="active"}>
     <a href="@url(repository)@path">
-      <i class="menu-icon @if(active == name){menu-icon-active} octicon octicon-@{icon} "></i>
-      @if(expand){ @label}
-      @if(expand && count > 0){
-        <div class="pull-right"><span class="badge">@count</span></div>
+      <i class="menu-icon @if(active == name){menu-icon-active} octicon octicon-@{icon} "></i> @label
+      @if(count > 0){
+        <span class="badge">@count</span>
       }
     </a>
   </li>
@@ -24,58 +23,55 @@
 <div class="container">
   @helper.html.information(info)
   @helper.html.error(error)
-  <div class="row">
-    <div class="head">
-      @if(repository.commitCount > 0){
-        <div class="input-group pull-right">
-          <span class="fork">
-            <span class="input-group-btn">
-            @if(loginAccount.isEmpty){
-              <a title="You must be signed in to fork a repository" href="@path/signin?redirect=@urlEncode(s"${path}/${repository.owner}/${repository.name}")" class="btn btn-default">Fork</a>
+  <div class="head">
+    @if(repository.commitCount > 0){
+      <div class="input-group pull-right">
+        <span class="fork">
+          <span class="input-group-btn">
+          @if(loginAccount.isEmpty){
+            <a title="You must be signed in to fork a repository" href="@path/signin?redirect=@urlEncode(s"${path}/${repository.owner}/${repository.name}")" class="btn btn-default">Fork</a>
+          } else {
+            @if(isNoGroup) {
+              <a id="fork-link" href="javascript:void(0);" class="btn btn-default">Fork</a>
             } else {
-              @if(isNoGroup) {
-                <a id="fork-link" href="javascript:void(0);" class="btn btn-default">Fork</a>
-              } else {
-                <a href="@path/@repository.owner/@repository.name/fork" class="btn btn-default" rel="facebox">Fork</a>
-              }
+              <a href="@path/@repository.owner/@repository.name/fork" class="btn btn-default" rel="facebox">Fork</a>
             }
-            </span>
-            <span class="count"><a href="@url(repository)/network/members">@repository.forkedCount</a></span>
+          }
           </span>
-        </div>
-        @if(loginAccount.isDefined && isNoGroup){
-          <form id="fork-form" method="post" action="@path/@repository.owner/@repository.name/fork" style="display: none;">
-            <input type="hidden" name="account" value="@loginAccount.get.userName"/>
-          </form>
-        }
+          <span class="count"><a href="@url(repository)/network/members">@repository.forkedCount</a></span>
+        </span>
+      </div>
+      @if(loginAccount.isDefined && isNoGroup){
+        <form id="fork-form" method="post" action="@path/@repository.owner/@repository.name/fork" style="display: none;">
+          <input type="hidden" name="account" value="@loginAccount.get.userName"/>
+        </form>
       }
-      @helper.html.repositoryicon(repository, true)
-      <a href="@url(repository.owner)">@repository.owner</a> / <a href="@url(repository)" class="strong">@repository.name</a>
+    }
+    @helper.html.repositoryicon(repository, true)
+    <a href="@url(repository.owner)">@repository.owner</a> / <a href="@url(repository)" class="strong">@repository.name</a>
 
-      @defining(repository.repository){ x =>
-        @if(repository.repository.originRepositoryName.isDefined){
-          <div class="forked">
-            forked from <a href="@path/@x.parentUserName/@x.parentRepositoryName">@x.parentUserName/@x.parentRepositoryName</a>
-          </div>
-        }
+    @defining(repository.repository){ x =>
+      @if(repository.repository.originRepositoryName.isDefined){
+        <div class="forked">
+          forked from <a href="@path/@x.parentUserName/@x.parentRepositoryName">@x.parentUserName/@x.parentRepositoryName</a>
+        </div>
       }
-    </div>
+    }
   </div>
+  <ul class="headmenu">
+    @sidemenu(""       , "code"   , "code" , "Code")
+    @sidemenu("/issues", "issues" , "issue-opened" , "Issues", repository.issueCount)
+    @sidemenu("/pulls" , "pulls"  , "git-pull-request" , "Pull Requests", repository.pullCount)
+    @sidemenu("/wiki"  , "wiki"   , "book"  , "Wiki")
+    @if(loginAccount.isDefined && (loginAccount.get.isAdmin || repository.managers.contains(loginAccount.get.userName))){
+      @sidemenu("/settings" , "settings" , "tools", "Settings")
+    }
+  </ul>
 </div>
 <hr style="margin-bottom: 20px;"/>
+
 <div class="container body">
-  <div style="width: @if(expand){170px} else {40px};" class="pull-right">
-    <ul class="sidemenu">
-      <li style="height: 12px"><div class="gradient pull-left" style="height: 12px"></div></li>
-      @sidemenu(""       , "code"   , "code" , "Code")
-      @sidemenu("/issues", "issues" , "issue-opened" , "Issues", repository.issueCount)
-      @sidemenu("/pulls" , "pulls"  , "git-pull-request" , "Pull Requests", repository.pullCount)
-      @sidemenu("/wiki"  , "wiki"   , "book"  , "Wiki")
-      @if(loginAccount.isDefined && (loginAccount.get.isAdmin || repository.managers.contains(loginAccount.get.userName))){
-        @sidemenu("/settings" , "settings" , "tools", "Settings")
-      }
-      <li style="height: 12px"><div class="gradient pull-left" style="height: 12px"></div></li>
-    </ul>
+@*
     @if(expand){
       <div class="small">
         <strong id="repository-url-proto">HTTP</strong> <span class="mute">clone URL</span>
@@ -97,15 +93,13 @@
         <div style="margin-top: 10px;">
           <a href="@{url(repository)}/archive/@{encodeRefName(id)}.zip" class="btn btn-sm btn-default btn-block"><i class="octicon octicon-cloud-download"></i>Download ZIP</a>
         </div>
-        @*
         <div style="margin-top: 10px;">
           <a href="@{url(repository)}/archive/@{encodeRefName(id)}.tar.gz" class="btn btn-sm btn-default btn-block "><i class="octicon octicon-cloud-download"></i>Download TAR.GZ</a>
         </div>
-        *@
       }
     }
-  </div>
-  <div class="pull-left" style="width: @if(expand){770px} else {895px};">
+*@
+@*  <div class="pull-left" style="width: 895px;">*@
     @if(expand){
       @repository.repository.description.map { description =>
         <p class="description">@detectAndRenderLinks(description)</p>
@@ -141,7 +135,7 @@
     }
     @body
   </div>
-</div>
+@*</div>*@
 <script>
 $(function(){
 
@@ -150,7 +144,7 @@
     if(e.target.tagName == "I"){
       target = e.target.parentElement;
     }
-    $(target).prev    ('div.gradient'        ).css('border-left', '1px solid silver');
+    $(target).prev('div.gradient').css('border-left', '1px solid silver');
   });
 
   $('ul.sidemenu a').mouseout(function(e){
@@ -158,7 +152,7 @@
     if(e.target.tagName == "I"){
       target = e.target.parentElement;
     }
-    $(target).prev    ('div.gradient'        ).css('border-left', '1px solid #eee');
+    $(target).prev('div.gradient').css('border-left', '1px solid #eee');
   });
 
   $('a[rel*=facebox]').facebox({
diff --git a/src/main/webapp/assets/common/css/gitbucket.css b/src/main/webapp/assets/common/css/gitbucket.css
index 5d65b07..acf7e8e 100644
--- a/src/main/webapp/assets/common/css/gitbucket.css
+++ b/src/main/webapp/assets/common/css/gitbucket.css
@@ -533,61 +533,48 @@
 }
 
 /****************************************************************************/
-/* Side Menu */
+/* Head Menu */
 /****************************************************************************/
-ul.sidemenu {
+ul.headmenu {
+  margin-top: 20px;
   margin-left: 0px;
   padding-left: 0px;
+  margin-bottom: -5px;
 }
 
-ul.sidemenu a {
-  display: block;
-  padding: 8px 10px;
-}
-
-ul.sidemenu a:hover {
+ul.headmenu a:hover {
   text-decoration: none;
+  color: black;
 }
 
-ul.sidemenu li.active {
-  border-top: 1px solid #eee;
-  border-bottom: 1px solid #eee;
-  border-right: 3px solid #bb4444;
-  border-left: 1px solid white;
+ul.headmenu li {
+  display: inline-block;
+  list-style-type: none;
+  font-size: 13px;
 }
 
-ul.sidemenu li.active a {
+ul.headmenu li a {
+  color: #666;
+  padding: 8px 10px;
+  display: block;
+}
+
+ul.headmenu li.active a {
+  color: black;
+}
+
+ul.headmenu li.active {
+  border-top: 3px solid #bb4444;
+  border-left: 1px solid #eee;
+  border-right: 1px solid #eee;
+  border-bottom: none;
+  background-color: white;
+}
+
+ul.headmenu li.active a {
   background-color: #fff;
 }
 
-ul.sidemenu {
-  background-image: -webkit-linear-gradient(left, #f6f6f6 0%, #fff 8px);
-  background-image: linear-gradient(to right, #f6f6f6 0%, #fff 8px);
-  box-shadow: inset 1px 0 0 #eee;
-}
-
-ul.sidemenu div.margin {
-  width: 5px;
-  height: 30px;
-  margin-right: 4px;
-  border-left: 1px solid white;
-}
-
-ul.sidemenu li {
-  border-left: 1px solid #eee;
-  margin-left:0px;
-  border-right: 2px solid white;
-  list-style-type: none;
-  font-size: 90%;
-}
-
-ul.sidemenu span.badge {
-
-}
-
-ul.sidemenu a:hover i.menu-icon, ul.sidemenu i.menu-icon-active {
-  color: #333;
-}
 /****************************************************************************/
 /* Create Repository */
 /****************************************************************************/
@@ -2220,89 +2207,75 @@
 /* Mobile */
 /****************************************************************************/
 @media (max-width: 767px) {
-    body>form#search {
-      margin: 0 -20px 20px -20px;
-    }
+  /* Hide header search box */
+  input[name=query] {
+    display: none;
+  }
+  #dashboard-signin-form {
+    display: none;
+  }
+  .container {
+    width: auto !important;
+  }
+  .body>div.pull-left {
+    width: auto !important;
+  }
 
-    body>div.dashboard-nav {
-      margin: 0 -20px 20px -20px;
-      padding: 0 10px;
-    }
+  /* Adjust issue search box size and position */
+  #search-filter-box {
+    width: 98% !important;
+    position: absolute;
+    left: 4px;
+    margin-top: 42px;
+  }
 
-    .container {
-      width: auto !important;
-    }
+  form#search-filter-form {
+    float: none !important;
+    margin-bottom: 80px !important;
+  }
 
-    /* Adjust issue search box size and position */
-    #search-filter-box {
-      width: 90% !important;
-      position: absolute;
-      left: 14px;
-      right: 20px;
-      margin-top: 42px;
-    }
+  .table-issues a.button-link {
+    width: 42px;
+    height: 16px;
+    overflow: hidden;
+    display: inline-block;
+  }
 
-    form#search-filter-form {
-      float: none !important;
-      margin-bottom: 80px !important;
-    }
+  .nav-tabs a.btn[href$="/_edit"] {
+    width: 24px;
+    white-space: nowrap;
+    overflow: hidden;
+    padding: 4px 6px;
+    margin: 3px 4px 0 0;
+  }
 
-    .table-issues a.button-link {
-      width: 42px;
-      height: 16px;
-      overflow: hidden;
-      display: inline-block;
-    }
-
-    .nav-tabs a.btn[href$="/_edit"] {
-      width: 24px;
-      white-space: nowrap;
-      overflow: hidden;
-      padding: 4px 6px;
-      margin: 3px 4px 0 0;
-    }
-
-    body>div.container.body {
-      margin: 0 -12px 40px -12px;
-    }
-
-    .container.body>div[style="width: 170px;"]{
-      width: 32px !important;
-      margin-right: -5px;
-      overflow: hidden;
-      white-space: nowrap;
-    }
-
-    .container.body>div[style="margin-right: 180px;"]{
-      margin-right: 32px !important;
-    }
-
-    .container.body>div[style="width: 170px;"] .sidemenu i, .container.body>div[style="width: 170px;"] .sidemenu img {
-      padding-right: 5px;
-    }
-
-    /* Hide repository url box */
-    .container.body>div[style="width: 170px;"] .small,.container.body>div[style="width: 170px;"] .input-group {
-      display: none;
-    }
-
-    .container.body>div[style="width: 170px;"] div[style="margin-top: 10px;"] a.btn{
-      width: 26px !important;
-      padding: 2px;
-    }
-
-    .container.body>div[style="width: 170px;"] div[style="margin-top: 10px;"] a.btn i {
-      margin: 5px 10px 5px 6px;
-    }
-
-    /* Hide fork button */
-    div.col-md-1>div.input-group.pull-right {
-      display: none;
-    }
-
-    body>.container>#fork-form{
-      display: inline;
-    }
+  body>div.container.body {
+    margin: 0 -12px 40px -12px;
+  }
+  /* Adjust sidemenu */
+  .container.body>div[style="width: 170px;"]{
+    width: 32px !important;
+    margin-right: -5px;
+    overflow: hidden;
+    white-space: nowrap;
+  }
+  /* Hide badge of sidemenu */
+  .container.body>div[style="width: 170px;"] span.badge {
+    display: none;
+  }
+  /* Hide download button */
+  .container.body>div[style="width: 170px;"] a.btn-sm {
+    display: none;
+  }
+  /* Hide repository url box */
+  .container.body>div[style="width: 170px;"] .small,
+  .container.body>div[style="width: 170px;"] .input-group {
+    display: none;
+  }
+  /* Hide fork button */
+  div.input-group>span.fork {
+    display: none;
+  }
 }
 
 /****************************************************************************/