updatepr-page-fix1

22 files changed, 122 insertions, 239 deletions

diff --git a/app/assets/stylesheets/framework/blocks.scss b/app/assets/stylesheets/framework/blocks.scss
index fa0e70847f3..d0f5d33bf4d 100644
--- a/app/assets/stylesheets/framework/blocks.scss
+++ b/app/assets/stylesheets/framework/blocks.scss
@@ -18,9 +18,9 @@
   line-height: 36px;
 }
 
-.content-block,
 .gray-content-block {
-  margin: -$gl-padding;
+  margin-top: 0;
+  margin-bottom: -$gl-padding;
   background-color: $background-color;
   padding: $gl-padding;
   margin-bottom: 0px;
@@ -86,10 +86,7 @@
 .cover-block {
   text-align: center;
   background: $background-color;
-  margin: -$gl-padding;
-  margin-bottom: 0;
-  padding: 44px $gl-padding;
-  border-bottom: 1px solid $border-color;
+  padding-top: 44px;
   position: relative;
 
   .avatar-holder {
@@ -136,3 +133,19 @@
 .block-connector {
   margin-top: -1px;
 }
+
+.nav-block {
+  .controls {
+    float: right;
+    margin-top: 11px;
+  }
+}
+
+.content-block {
+  padding: $gl-padding 0;
+  border-bottom: 1px solid $border-color;
+
+  &.oneline-block {
+    line-height: 42px;
+  }
+}
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index 97a94638847..c99292c3f83 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -1,12 +1,8 @@
 @mixin btn-default {
   @include border-radius(3px);
-  border-width: 1px;
-  border-style: solid;
-  font-size: 15px;
+  font-size: $gl-font-size;
   font-weight: 500;
-  line-height: 18px;
-  padding: 11px $gl-padding;
-  letter-spacing: .4px;
+  padding: $gl-vert-padding $gl-padding;
 
   &:focus,
   &:active {
@@ -17,8 +13,6 @@
 
 @mixin btn-middle {
   @include btn-default;
-  @include border-radius(3px);
-  padding: 11px 24px;
 }
 
 @mixin btn-color($light, $border-light, $normal, $border-normal, $dark, $border-dark, $color) {
@@ -74,16 +68,15 @@
   @include btn-default;
   @include btn-white;
 
+  &.btn-small,
   &.btn-sm {
-    padding: 5px 10px;
-  }
-
-  &.btn-nr {
-    padding: 7px 10px;
+    padding: 4px 10px;
+    font-size: 13px;
+    line-height: 18px;
   }
 
   &.btn-xs {
-    padding: 1px 5px;
+    padding: 2px 5px;
   }
 
   &.btn-success,
@@ -131,6 +124,12 @@
     &:last-child {
       margin-right: 0px;
     }
+    &.btn-xs {
+      margin-right: 3px;
+    }
+  }
+  &.disabled {
+    pointer-events: auto !important;
   }
 }
 
@@ -153,33 +152,42 @@
   }
 }
 
-.btn-group-next {
+.btn-clipboard {
+  border: none;
+  padding: 0 5px;
+}
+
+.input-group-btn {
   .btn {
-    padding: 9px 0px;
-    font-size: 15px;
-    color: #7f8fa4;
-    border-color: #e7e9ed;
-    width: 140px;
-
-    .badge {
-      font-weight: normal;
-      background-color: #eee;
-      color: #78a;
+    @include btn-gray;
+    @include btn-middle;
+
+    &:hover {
+      outline: none;
     }
 
-    &.active {
-      border-color: $gl-info;
-      background: $gl-info;
-      color: #fff;
+    &:focus {
+      outline: none;
+    }
+
+    &:active {
+      outline: none;
+    }
 
-      .badge {
-        color: $gl-info;
-        background-color: white;
-      }
+    &.btn-clipboard {
+      padding-left: 15px;
+      padding-right: 15px;
     }
   }
-}
 
-.btn-clipboard {
-  border: none;
+  .active {
+    @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12));
+
+    border: 1px solid #c6cacf !important;
+    background-color: #e4e7ed !important;
+  }
+
+  .btn-green {
+    @include btn-green
+  }
 }
diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index 11730000f85..05645116268 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -374,75 +374,6 @@ table {
   }
 }
 
-.center-top-menu, .left-top-menu {
-  @include nav-menu;
-  text-align: center;
-  margin-top: 5px;
-  margin-bottom: $gl-padding;
-  height: auto;
-  margin-top: -$gl-padding;
-
-  &.no-bottom {
-    margin-bottom: 0;
-  }
-
-  &.no-top {
-    margin-top: 0;
-  }
-
-  li a {
-    display: inline-block;
-    padding-top: $gl-padding;
-    padding-bottom: 11px;
-    margin-bottom: -1px;
-  }
-
-  &.bottom-border {
-    border-bottom: 1px solid $border-color;
-    height: 57px;
-  }
-
-  &.wide {
-    margin-left: -$gl-padding;
-    margin-right: -$gl-padding;
-  }
-}
-
-.left-top-menu {
-  text-align: left;
-  border-bottom: 1px solid #EEE;
-}
-
-.center-middle-menu {
-  @include nav-menu;
-  padding: 0;
-  text-align: center;
-  margin: -$gl-padding;
-  margin-top: 0;
-  margin-bottom: 0;
-  height: 58px;
-  border-bottom: 1px solid $border-color;
-
-  li {
-    &:after {
-      content: "|";
-      color: $border-gray-light;
-    }
-
-    &:last-child {
-      &:after {
-        content: none;
-      }
-    }
-
-    > a {
-      display: inline-block;
-      text-transform: uppercase;
-      font-size: 13px;
-    }
-  }
-}
-
 .dropzone .dz-preview .dz-progress {
   border-color: $border-color !important;
 }
diff --git a/app/assets/stylesheets/framework/files.scss b/app/assets/stylesheets/framework/files.scss
index cbfd4bc29b6..6ee104ee31a 100644
--- a/app/assets/stylesheets/framework/files.scss
+++ b/app/assets/stylesheets/framework/files.scss
@@ -3,11 +3,8 @@
  *
  */
 .file-holder {
-  margin-left: -$gl-padding;
-  margin-right: -$gl-padding;
   border: none;
-  border-top: 1px solid #E7E9EE;
-  border-bottom: 1px solid #E7E9EE;
+  border: 1px solid $border-color;
 
   &.readme-holder {
     border-bottom: 0;
diff --git a/app/assets/stylesheets/framework/flash.scss b/app/assets/stylesheets/framework/flash.scss
index 82eb50ad4be..1bfd0213995 100644
--- a/app/assets/stylesheets/framework/flash.scss
+++ b/app/assets/stylesheets/framework/flash.scss
@@ -8,10 +8,12 @@
   .flash-notice {
     @extend .alert;
     @extend .alert-info;
+    margin: 0;
   }
 
   .flash-alert {
     @extend .alert;
     @extend .alert-danger;
+    margin: 0;
   }
 }
diff --git a/app/assets/stylesheets/framework/forms.scss b/app/assets/stylesheets/framework/forms.scss
index d0cb91a5b64..4dab806d50e 100644
--- a/app/assets/stylesheets/framework/forms.scss
+++ b/app/assets/stylesheets/framework/forms.scss
@@ -74,8 +74,6 @@ label {
 
 .form-control {
   @include box-shadow(none);
-  height: 42px;
-  padding: 8px $gl-padding;
 }
 
 .form-control-inline {
diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss
index 4dbbb56104b..ba5e72c8c5a 100644
--- a/app/assets/stylesheets/framework/header.scss
+++ b/app/assets/stylesheets/framework/header.scss
@@ -28,6 +28,7 @@ header {
     min-height: $header-height;
     background-color: #fff;
     border: none;
+    border-bottom: 1px solid #EEE;
 
     .container-fluid {
       width: 100% !important;
diff --git a/app/assets/stylesheets/framework/layout.scss b/app/assets/stylesheets/framework/layout.scss
index a1a9990241d..e901c78d02f 100644
--- a/app/assets/stylesheets/framework/layout.scss
+++ b/app/assets/stylesheets/framework/layout.scss
@@ -5,8 +5,6 @@ html {
 }
 
 body {
-  background-color: #F3F3F3 !important;
-
   &.navless {
     background-color: white !important;
   }
diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss
index bbdb1c038c5..c6bc6fb324d 100644
--- a/app/assets/stylesheets/framework/lists.scss
+++ b/app/assets/stylesheets/framework/lists.scss
@@ -109,10 +109,8 @@ ul.content-list {
   padding: 0;
 
   > li {
-    padding: $gl-padding;
+    padding: $gl-padding 0;
     border-color: $table-border-color;
-    margin-left: -$gl-padding;
-    margin-right: -$gl-padding;
     color: $gl-gray;
 
     .avatar {
@@ -133,6 +131,7 @@ ul.content-list {
 .panel > .content-list {
   li {
     margin: 0;
+    padding: $gl-padding;
   }
 }
 
@@ -148,7 +147,7 @@ ul.controls {
   > li {
     float: left;
     margin-right: 10px;
-    
+
     &:last-child {
       margin-right: 0;
     }
diff --git a/app/assets/stylesheets/framework/markdown_area.scss b/app/assets/stylesheets/framework/markdown_area.scss
index 4a00a197d9a..c540e527bed 100644
--- a/app/assets/stylesheets/framework/markdown_area.scss
+++ b/app/assets/stylesheets/framework/markdown_area.scss
@@ -65,13 +65,6 @@
   position: relative;
 }
 
-.md-header {
-  ul {
-    float: left;
-    margin-bottom: 1px;
-  }
-}
-
 .referenced-users {
   color: #4c4e54;
   padding-top: 10px;
@@ -85,23 +78,6 @@
   box-shadow: none;
 }
 
-.new_note,
-.edit_note,
-.detail-page-description,
-.milestone-description,
-.wiki-content,
-.merge-request-form {
-  .nav-tabs {
-    margin-bottom: 0;
-    border: none;
-
-    li a,
-    li.active a {
-      border: 1px solid #DDD;
-    }
-  }
-}
-
 .markdown-area {
   @include border-radius(0);
   background: #FFF;
diff --git a/app/assets/stylesheets/framework/mixins.scss b/app/assets/stylesheets/framework/mixins.scss
index 41fd890f14f..1d5000fe388 100644
--- a/app/assets/stylesheets/framework/mixins.scss
+++ b/app/assets/stylesheets/framework/mixins.scss
@@ -118,38 +118,3 @@
   font-size: 16px;
   line-height: 24px;
 }
-
-@mixin nav-menu {
-  padding: 0;
-  margin: 0;
-  list-style: none;
-  height: 56px;
-
-  li {
-    display: inline-block;
-
-    a {
-      padding: 14px;
-      font-size: 15px;
-      line-height: 28px;
-      color: #959494;
-      border-bottom: 2px solid transparent;
-
-      &:hover, &:active, &:focus {
-        text-decoration: none;
-        outline: none;
-      }
-    }
-
-    &.active a {
-      color: #616060;
-      border-bottom: 2px solid #4688f1;
-    }
-
-    .badge {
-      font-weight: normal;
-      background-color: #eee;
-      color: #78a;
-    }
-  }
-}
diff --git a/app/assets/stylesheets/framework/mobile.scss b/app/assets/stylesheets/framework/mobile.scss
index c00709fb6bb..28c294714ad 100644
--- a/app/assets/stylesheets/framework/mobile.scss
+++ b/app/assets/stylesheets/framework/mobile.scss
@@ -9,7 +9,7 @@
     padding-right: 5px;
   }
 
-  .nav.nav-tabs > li > a {
+  .nav-links > li > a {
     padding: 10px;
     font-size: 12px;
     margin-right: 3px;
@@ -81,7 +81,7 @@
     display: none;
   }
 
-  .center-top-menu, .left-top-menu {
+  .nav-links, .nav-links {
     li a {
       font-size: 14px;
       padding: 19px 10px;
diff --git a/app/assets/stylesheets/framework/nav.scss b/app/assets/stylesheets/framework/nav.scss
new file mode 100644
index 00000000000..c537d97fb24
--- /dev/null
+++ b/app/assets/stylesheets/framework/nav.scss
@@ -0,0 +1,39 @@
+.nav-links {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+  height: auto;
+  border-bottom: 1px solid $border-color;
+
+  li {
+    display: inline-block;
+
+    a {
+      display: inline-block;
+      padding: 14px;
+      padding-top: $gl-padding;
+      padding-bottom: 11px;
+      margin-bottom: -1px;
+      font-size: 15px;
+      line-height: 28px;
+      color: #959494;
+      border-bottom: 2px solid transparent;
+
+      &:hover, &:active, &:focus {
+        text-decoration: none;
+        outline: none;
+      }
+    }
+
+    &.active a {
+      color: #000000;
+      border-bottom: 2px solid #4688f1;
+    }
+
+    .badge {
+      font-weight: normal;
+      background-color: #eee;
+      color: #78a;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/framework/selects.scss b/app/assets/stylesheets/framework/selects.scss
index af145191bc8..3ee3443e349 100644
--- a/app/assets/stylesheets/framework/selects.scss
+++ b/app/assets/stylesheets/framework/selects.scss
@@ -3,8 +3,8 @@
   .select2-choice {
     background: #FFF;
     border-color: #DDD;
-    height: 42px;
-    padding: 8px $gl-padding;
+    height: 36px;
+    padding: 6px $gl-padding;
     font-size: $gl-font-size;
     line-height: 1.42857143;
 
diff --git a/app/assets/stylesheets/framework/sidebar.scss b/app/assets/stylesheets/framework/sidebar.scss
index 83243dd2457..540d0b03163 100644
--- a/app/assets/stylesheets/framework/sidebar.scss
+++ b/app/assets/stylesheets/framework/sidebar.scss
@@ -21,11 +21,10 @@
 
 .content-wrapper {
   width: 100%;
-  padding: 20px;
 
   .container-fluid {
     background: #FFF;
-    padding: $gl-padding;
+    padding: 0 $gl-padding;
 
     &.container-blank {
       background: none;
diff --git a/app/assets/stylesheets/framework/tables.scss b/app/assets/stylesheets/framework/tables.scss
index 793ab3d9bb9..c4e9f467ce4 100644
--- a/app/assets/stylesheets/framework/tables.scss
+++ b/app/assets/stylesheets/framework/tables.scss
@@ -1,13 +1,11 @@
 .table-holder {
-  margin: -$gl-padding;
-  margin-top: 0;
-  margin-bottom: 0;
+  margin: 0;
 }
 
 table {
   &.table {
     margin-bottom: $gl-padding;
-    
+
     .dropdown-menu a {
       text-decoration: none;
     }
@@ -32,6 +30,7 @@ table {
       }
 
       th {
+        background-color: $background-color;
         font-weight: normal;
         font-size: 15px;
         border-bottom: 1px solid $border-color !important;
diff --git a/app/assets/stylesheets/framework/timeline.scss b/app/assets/stylesheets/framework/timeline.scss
index ff41e26ed8a..47b843e5e3d 100644
--- a/app/assets/stylesheets/framework/timeline.scss
+++ b/app/assets/stylesheets/framework/timeline.scss
@@ -5,10 +5,8 @@
   padding: 0;
 
   .timeline-entry {
-    padding: $gl-padding;
+    padding: $gl-padding 0;
     border-color: $table-border-color;
-    margin-left: -$gl-padding;
-    margin-right: -$gl-padding;
     color: $gl-gray;
     border-bottom: 1px solid $border-white-light;
 
diff --git a/app/assets/stylesheets/framework/tw_bootstrap.scss b/app/assets/stylesheets/framework/tw_bootstrap.scss
index 94f0ed761df..88072606bf5 100644
--- a/app/assets/stylesheets/framework/tw_bootstrap.scss
+++ b/app/assets/stylesheets/framework/tw_bootstrap.scss
@@ -99,47 +99,6 @@
   }
 }
 
-// Nav tabs
-.nav.nav-tabs {
-  margin-bottom: 15px;
-
-  li {
-    > a {
-      margin-right: 5px;
-      line-height: 20px;
-      border-color: #EEE;
-      color: #888;
-      border-bottom: 1px solid #ddd;
-      .badge {
-        background-color: #eee;
-        color: #888;
-        text-shadow: 0 1px 1px #fff;
-      }
-      i.fa {
-        line-height: 14px;
-      }
-    }
-    &.active {
-      > a {
-        border-color: #CCC;
-        border-bottom: 1px solid #fff;
-        color: #333;
-        font-weight: bold;
-      }
-    }
-  }
-}
-
-.nav-tabs > li > a,
-.nav-pills > li > a {
-  color: #666;
-}
-
-.nav-pills > .active > a > span > .badge {
-  background-color: #fff;
-  color: $gl-primary;
-}
-
 
 /**
  * fix to keep tooltips position in top navigation bar
diff --git a/app/assets/stylesheets/framework/tw_bootstrap_variables.scss b/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
index 63868a34e2a..cd0621cdbf3 100644
--- a/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
+++ b/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
@@ -46,7 +46,7 @@ $font-size-base:         $gl-font-size;
 //
 //## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
 
-$padding-base-vertical:     9px;
+$padding-base-vertical:     $gl-vert-padding;
 $padding-base-horizontal:   $gl-padding;
 $component-active-color:    #fff;
 $component-active-bg:       $brand-info;
diff --git a/app/assets/stylesheets/framework/typography.scss b/app/assets/stylesheets/framework/typography.scss
index 714369d9f15..ab4f71af039 100644
--- a/app/assets/stylesheets/framework/typography.scss
+++ b/app/assets/stylesheets/framework/typography.scss
@@ -177,7 +177,7 @@ body {
 }
 
 .page-title {
-  margin-top: 0px;
+  margin-top: $gl-padding;
   line-height: 1.3;
   font-size: 1.25em;
   font-weight: 600;
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index d0ff3248ce1..85ecdddda79 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -22,6 +22,7 @@ $header-height: 58px;
 $fixed-layout-width: 1280px;
 $gl-gray: #5a5a5a;
 $gl-padding: 16px;
+$gl-vert-padding: 6px;
 $gl-padding-top:10px;
 $gl-avatar-size: 46px;
 $secondary-text: #7f8fa4;
diff --git a/app/assets/stylesheets/framework/zen.scss b/app/assets/stylesheets/framework/zen.scss
index 002bd7e8ca5..c3f27333fad 100644
--- a/app/assets/stylesheets/framework/zen.scss
+++ b/app/assets/stylesheets/framework/zen.scss
@@ -4,7 +4,7 @@
     position: absolute;
     top: 0px;
     right: 4px;
-    line-height: 40px;
+    line-height: 56px;
   }
 
   a.js-zen-leave {