11 files changed, 156 insertions, 49 deletions

diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss
index 78434b99b62..3945a789c82 100644
--- a/app/assets/stylesheets/framework/header.scss
+++ b/app/assets/stylesheets/framework/header.scss
@@ -148,11 +148,16 @@ header {
     }
 
     .header-logo {
-      display: inline-block;
-      margin: 0 8px 0 3px;
-      position: relative;
+      position: absolute;
+      left: 50%;
       top: 7px;
       transition-duration: .3s;
+      z-index: 999;
+
+      #logo {
+        position: relative;
+        left: -50%;
+      }
 
       svg,
       img {
@@ -162,6 +167,15 @@ header {
       &:hover {
         cursor: pointer;
       }
+
+      @media (max-width: $screen-xs-max) {
+        right: 20px;
+        left: auto;
+
+        #logo {
+          left: auto;
+        }
+      }
     }
 
     .title {
@@ -169,7 +183,7 @@ header {
       padding-right: 20px;
       margin: 0;
       font-size: 18px;
-      max-width: 450px;
+      max-width: 385px;
       display: inline-block;
       line-height: $header-height;
       font-weight: normal;
@@ -179,6 +193,10 @@ header {
       vertical-align: top;
       white-space: nowrap;
 
+      @media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
+        max-width: 300px;
+      }
+
       @media (max-width: $screen-xs-max) {
         max-width: 190px;
       }
diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss
index 2bfdb9f9601..55ed4b7b06c 100644
--- a/app/assets/stylesheets/framework/lists.scss
+++ b/app/assets/stylesheets/framework/lists.scss
@@ -96,16 +96,6 @@ ul.unstyled-list > li {
   border-bottom: none;
 }
 
-ul.task-list {
-  li.task-list-item {
-    list-style-type: none;
-  }
-
-  ul:not(.task-list) {
-    padding-left: 1.3em;
-  }
-}
-
 // Generic content list
 ul.content-list {
   @include basic-list;
diff --git a/app/assets/stylesheets/framework/mixins.scss b/app/assets/stylesheets/framework/mixins.scss
index 1acd06122a3..df78bbdea51 100644
--- a/app/assets/stylesheets/framework/mixins.scss
+++ b/app/assets/stylesheets/framework/mixins.scss
@@ -76,6 +76,13 @@
   #{$property}: $value;
 }
 
+/* http://phrappe.com/css/conditional-css-for-webkit-based-browsers/ */
+@mixin on-webkit-only {
+  @media screen and (-webkit-min-device-pixel-ratio:0) {
+    @content;
+  }
+}
+
 @mixin keyframes($animation-name) {
   @-webkit-keyframes #{$animation-name} {
     @content;
diff --git a/app/assets/stylesheets/framework/nav.scss b/app/assets/stylesheets/framework/nav.scss
index 7d4a814a36c..674d3bb45aa 100644
--- a/app/assets/stylesheets/framework/nav.scss
+++ b/app/assets/stylesheets/framework/nav.scss
@@ -1,7 +1,7 @@
 @mixin fade($gradient-direction, $gradient-color) {
   visibility: hidden;
   opacity: 0;
-  z-index: 1;
+  z-index: 2;
   position: absolute;
   bottom: 12px;
   width: 43px;
@@ -18,7 +18,7 @@
 
   .fa {
     position: relative;
-    top: 6px;
+    top: 5px;
     font-size: 18px;
   }
 }
@@ -79,6 +79,7 @@
   }
 
   &.sub-nav {
+    text-align: center;
     background-color: $gray-normal;
 
     .container-fluid {
@@ -286,6 +287,7 @@
   background: $gray-light;
   border-bottom: 1px solid $border-color;
   transition: padding $sidebar-transition-duration;
+  text-align: center;
 
   .container-fluid {
     position: relative;
@@ -351,7 +353,7 @@
     right: -5px;
 
     .fa {
-      right: -28px;
+      right: -7px;
     }
   }
 
@@ -381,7 +383,7 @@
       left: 0;
 
       .fa {
-        left: -4px;
+        left: 10px;
       }
     }
   }
diff --git a/app/assets/stylesheets/framework/sidebar.scss b/app/assets/stylesheets/framework/sidebar.scss
index d09b1c9d7f5..040a7ce0c16 100644
--- a/app/assets/stylesheets/framework/sidebar.scss
+++ b/app/assets/stylesheets/framework/sidebar.scss
@@ -29,14 +29,16 @@
   }
 }
 
+@media (min-width: $screen-sm-min) {
+  .content-wrapper {
+    padding-right: $gutter_collapsed_width;
+  }
+}
+
 .right-sidebar-collapsed {
   padding-right: 0;
 
   @media (min-width: $screen-sm-min) {
-    .content-wrapper {
-      padding-right: $gutter_collapsed_width;
-    }
-
     .merge-request-tabs-holder.affix {
       right: $gutter_collapsed_width;
     }
@@ -54,12 +56,6 @@
 .right-sidebar-expanded {
   padding-right: 0;
 
-  @media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
-    &:not(.build-sidebar):not(.wiki-sidebar) {
-      padding-right: $gutter_collapsed_width;
-    }
-  }
-
   @media (min-width: $screen-md-min) {
     .content-wrapper {
       padding-right: $gutter_width;
diff --git a/app/assets/stylesheets/framework/typography.scss b/app/assets/stylesheets/framework/typography.scss
index 54958973f15..db5e2c51fe7 100644
--- a/app/assets/stylesheets/framework/typography.scss
+++ b/app/assets/stylesheets/framework/typography.scss
@@ -134,7 +134,7 @@
   ul,
   ol {
     padding: 0;
-    margin: 3px 0 3px 28px !important;
+    margin: 3px 0 !important;
   }
 
   ul:dir(rtl),
@@ -144,6 +144,29 @@
 
   li {
     line-height: 1.6em;
+    margin-left: 25px;
+    padding-left: 3px;
+
+    /* Normalize the bullet position on webkit. */
+    @include on-webkit-only {
+      margin-left: 28px;
+      padding-left: 0;
+    }
+  }
+
+  ul.task-list {
+    li.task-list-item {
+      list-style-type: none;
+      position: relative;
+      padding-left: 28px;
+      margin-left: 0 !important;
+
+      input.task-list-item-checkbox {
+        position: absolute;
+        left: 8px;
+        top: 5px;
+      }
+    }
   }
 
   a[href*="/uploads/"],
diff --git a/app/assets/stylesheets/pages/environments.scss b/app/assets/stylesheets/pages/environments.scss
index 181dcb7721f..f789ae1ccd3 100644
--- a/app/assets/stylesheets/pages/environments.scss
+++ b/app/assets/stylesheets/pages/environments.scss
@@ -35,7 +35,6 @@
     display: table-cell;
   }
 
-  .environments-name,
   .environments-commit,
   .environments-actions {
     width: 20%;
@@ -45,6 +44,7 @@
     width: 10%;
   }
 
+  .environments-name,
   .environments-deploy,
   .environments-build {
     width: 15%;
@@ -62,6 +62,22 @@
     }
   }
 
+  .btn-group {
+
+    > a {
+      color: $gl-text-color-secondary;
+    }
+
+    svg path {
+      fill: $gl-text-color-secondary;
+    }
+
+    .dropdown {
+      outline: none;
+    }
+  }
+
+
   .commit-title {
     margin: 0;
   }
diff --git a/app/assets/stylesheets/pages/issues.scss b/app/assets/stylesheets/pages/issues.scss
index 80b0c9493d8..b595480561b 100644
--- a/app/assets/stylesheets/pages/issues.scss
+++ b/app/assets/stylesheets/pages/issues.scss
@@ -10,6 +10,11 @@
     .issue-labels {
       display: inline-block;
     }
+
+    .icon-merge-request-unmerged {
+      height: 13px;
+      margin-bottom: 3px;
+     }
   }
 }
 
diff --git a/app/assets/stylesheets/pages/pipelines.scss b/app/assets/stylesheets/pages/pipelines.scss
index 00eb5b30fd5..3fe1eef307e 100644
--- a/app/assets/stylesheets/pages/pipelines.scss
+++ b/app/assets/stylesheets/pages/pipelines.scss
@@ -222,6 +222,11 @@
       }
     }
 
+    .dropdown-menu {
+      max-height: 250px;
+      overflow-y: auto;
+    }
+
     .dropdown-toggle,
     .dropdown-menu {
       color: $gl-text-color-secondary;
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index adbdc5214a4..67110813abb 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -268,6 +268,13 @@
   }
 }
 
+.project-repo-buttons {
+  .project-action-button .dropdown-menu {
+    max-height: 250px;
+    overflow-y: auto;
+  }
+}
+
 .split-one {
   display: inline-table;
   margin-right: 12px;
@@ -645,23 +652,29 @@ pre.light-well {
   }
 }
 
-.container-fluid.project-stats-container {
-  @media (max-width: $screen-xs-max) {
-    padding: 12px 0;
-  }
-}
-
 .project-last-commit {
-  background-color: $gray-light;
-  padding: 12px $gl-padding;
-  border: 1px solid $border-color;
-
   @media (min-width: $screen-sm-min) {
     margin-top: $gl-padding;
   }
 
-  @media (min-width: $screen-sm-min) {
-    border-radius: $border-radius-base;
+  &.container-fluid {
+    padding-top: 12px;
+    padding-bottom: 12px;
+    background-color: $gray-light;
+    border: 1px solid $border-color;
+    border-right-width: 0;
+    border-left-width: 0;
+
+    @media (min-width: $screen-sm-min) {
+      border-right-width: 1px;
+      border-left-width: 1px;
+    }
+  }
+
+  &.container-limited {
+    @media (min-width: 1281px) {
+      border-radius: $border-radius-base;
+    }
   }
 
   .ci-status {
diff --git a/app/assets/stylesheets/pages/todos.scss b/app/assets/stylesheets/pages/todos.scss
index 551a66fbf3a..af9ddb9ff80 100644
--- a/app/assets/stylesheets/pages/todos.scss
+++ b/app/assets/stylesheets/pages/todos.scss
@@ -6,6 +6,8 @@
 .navbar-nav {
   li {
     .badge.todos-pending-count {
+      position: inherit;
+      top: -6px;
       margin-top: -5px;
       font-weight: normal;
       background: $todo-alert-blue;
@@ -43,6 +45,12 @@
     }
   }
 
+  .todo-avatar,
+  .todo-actions {
+    -webkit-flex: 0 0 auto;
+    flex: 0 0 auto;
+  }
+
   .todo-actions {
     display: -webkit-flex;
     display: flex;
@@ -55,8 +63,9 @@
   }
 
   .todo-item {
-    -webkit-flex: auto;
-    flex: auto;
+    -webkit-flex: 0 1 100%;
+    flex: 0 1 100%;
+    min-width: 0;
   }
 }
 
@@ -74,8 +83,29 @@
 
 .todo-item {
   .todo-title {
-    @include str-truncated(calc(100% - 174px));
-    overflow: visible;
+    display: flex;
+
+    & > .title-item {
+      -webkit-flex: 0 0 auto;
+      flex: 0 0 auto;
+      margin: 0 2px;
+
+      &:first-child {
+        margin-left: 0;
+      }
+
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+
+    .todo-label {
+      -webkit-flex: 0 1 auto;
+      flex: 0 1 auto;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
   }
 
   .status-box {
@@ -154,10 +184,12 @@
 
   .todo-item {
     .todo-title {
-      white-space: normal;
-      overflow: visible;
-      max-width: 100%;
+      flex-flow: row wrap;
       margin-bottom: 10px;
+
+      .todo-label {
+        white-space: normal;
+      }
     }
 
     .todo-body {