1 files changed, 36 insertions, 53 deletions

diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index f8e31a624ec..45ff9f7ff5f 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/app/assets/stylesheets/pages/merge_requests.scss
@@ -3,8 +3,8 @@
  *
  */
 .mr-state-widget {
-  background: $background-color;
-  color: $gl-gray;
+  background: $gray-light;
+  color: $gl-text-color;
   border: 1px solid $border-color;
   border-radius: 2px;
 
@@ -21,10 +21,18 @@
       display: inline-block;
       float: left;
 
+      .btn-success.dropdown-toggle .fa {
+        color: inherit;
+      }
+
+      .btn-success.dropdown-toggle:disabled {
+        background-color: $gl-success;
+      }
+
       .accept_merge_request {
         &.ci-pending,
         &.ci-running {
-          @include btn-orange;
+          @include btn-blue;
         }
 
         &.ci-skipped,
@@ -47,9 +55,10 @@
 
       &.right {
         float: right;
+        padding-right: 0;
 
         a {
-          color: $gl-gray;
+          color: $gl-text-color;
         }
       }
 
@@ -60,7 +69,8 @@
   }
 
   .ci_widget {
-    border-bottom: 1px solid $widget-inner-border;
+    border-bottom: 1px solid $well-inner-border;
+    color: $gl-text-color;
 
     svg {
       margin-right: 4px;
@@ -69,48 +79,12 @@
       overflow: visible;
     }
 
-    &.ci-success {
-      color: $gl-success;
-
-      a.environment,
-      a.pipeline {
-        color: inherit;
-      }
-    }
-
     &.ci-success_with_warnings {
-      color: $gl-success;
 
       i {
         color: $gl-warning;
       }
     }
-
-    &.ci-skipped {
-      background-color: #eee;
-      color: #888;
-    }
-
-    &.ci-pending {
-      color: $gl-warning;
-    }
-
-    &.ci-running {
-      color: $blue-normal;
-    }
-
-    &.ci-failed,
-    &.ci-error {
-      color: $gl-danger;
-    }
-
-    &.ci-canceled {
-      color: $gl-gray;
-    }
-
-    a.monospace {
-      color: inherit;
-    }
   }
 
   .mr-widget-body,
@@ -120,7 +94,7 @@
   }
 
   .normal {
-    color: #5c5d5e;
+    color: $gl-text-color;
   }
 
   .js-deployment-link {
@@ -130,9 +104,9 @@
   .mr-widget-body {
     h4 {
       font-weight: 600;
-      font-size: 17px;
+      font-size: 16px;
       margin: 5px 0;
-      color: $gl-gray-dark;
+      color: $gl-text-color;
 
       &.has-conflicts .fa-exclamation-triangle {
         color: $gl-warning;
@@ -150,7 +124,7 @@
 
     @media (max-width: $screen-xs-max) {
       h4 {
-        font-size: 15px;
+        font-size: 14px;
       }
 
       p {
@@ -163,6 +137,11 @@
         margin-bottom: 4px;
       }
 
+      .btn-grouped {
+        float: none;
+        margin-right: 0;
+      }
+
       .accept-action {
         width: 100%;
         text-align: center;
@@ -177,7 +156,7 @@
   }
 
   .mr-widget-footer {
-    border-top: 1px solid #eee;
+    border-top: 1px solid $gray-darker;
   }
 
   .ci-coverage {
@@ -211,7 +190,7 @@
 }
 
 .label-branch {
-  color: $gl-gray-dark;
+  color: $gl-text-color;
   font-family: $monospace_font;
   font-weight: bold;
   overflow: hidden;
@@ -331,10 +310,6 @@
       left: 0;
       top: 2px;
     }
-
-    .commit-row-info {
-      line-height: 20px;
-    }
   }
 
   .btn-clipboard {
@@ -388,7 +363,7 @@
 
     th {
       background-color: $white-light;
-      color: $gl-placeholder-color;
+      color: $gl-text-color-secondary;
     }
   }
 }
@@ -404,7 +379,7 @@
 }
 
 .mr-version-controls {
-  background: $background-color;
+  background: $gray-light;
   border-bottom: 1px solid $border-color;
   color: $gl-text-color;
 
@@ -445,11 +420,19 @@
 .merge-request-tabs-holder {
   background-color: $white-light;
 
+  .container-limited {
+    max-width: $limited-layout-width;
+  }
+
   &.affix {
     top: 100px;
     left: 0;
     z-index: 10;
     transition: right .15s;
+
+    @media (max-width: $screen-xs-max) {
+      right: 0;
+    }
   }
 
   &:not(.affix) .container-fluid {