1 files changed, 21 insertions, 37 deletions

diff --git a/app/assets/stylesheets/pages/pipelines.scss b/app/assets/stylesheets/pages/pipelines.scss
index e676d48c1f4..aa6bbc8e473 100644
--- a/app/assets/stylesheets/pages/pipelines.scss
+++ b/app/assets/stylesheets/pages/pipelines.scss
@@ -341,13 +341,15 @@
   &.builds .ci-table tr {
     height: 71px;
   }
-}
 
-.build-failures {
-  th {
-    border-top: 0;
+  .ci-table {
+    thead th {
+      border-top: 0;
+    }
   }
+}
 
+.build-failures {
   .build-state {
     padding: 20px 2px;
 
@@ -496,7 +498,8 @@
       list-style: none;
     }
 
-    &:last-child {
+    // when downstream pipelines are present, the last stage isn't the last column
+    &:last-child:not(.has-downstream) {
       .build {
         // Remove right connecting horizontal line from first build in last stage
         &:first-child::after {
@@ -513,7 +516,8 @@
       }
     }
 
-    &:first-child {
+    // when upstream pipelines are present, the first stage isn't the first column
+    &:first-child:not(.has-upstream) {
       .build {
         // Remove left curved connectors from all builds in first stage
         &:not(:first-child)::before {
@@ -561,6 +565,7 @@
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
+    line-height: 2.2em;
   }
 
   .build {
@@ -697,6 +702,11 @@
       }
     }
   }
+
+  .stage-action svg {
+    left: 1px;
+    top: -2px;
+  }
 }
 
 // Triggers the dropdown in the big pipeline graph
@@ -708,15 +718,9 @@
   top: 8px;
 }
 
+.ci-build-text,
 .ci-status-text {
-  max-width: 110px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  vertical-align: bottom;
-  display: inline-block;
-  position: relative;
-  font-weight: $gl-font-weight-normal;
+  font-weight: 200;
 }
 
 @mixin mini-pipeline-graph-color(
@@ -787,10 +791,11 @@
   }
 
   &.ci-status-icon-pending,
-  &.ci-status-icon-success_with_warnings {
+  &.ci-status-icon-success-with-warnings {
     @include mini-pipeline-graph-color($white, $orange-100, $orange-200, $orange-500, $orange-600, $orange-700);
   }
 
+  &.ci-status-icon-preparing,
   &.ci-status-icon-running {
     @include mini-pipeline-graph-color($white, $blue-100, $blue-200, $blue-500, $blue-600, $blue-700);
   }
@@ -898,7 +903,7 @@ button.mini-pipeline-graph-dropdown-toggle {
 
       // Match dropdown.scss for all `a` tags
       &.non-details-job-component {
-        padding: 8px 16px;
+        padding: $gl-padding-8 $gl-btn-horz-padding;
       }
 
       .ci-job-name-component {
@@ -907,26 +912,6 @@ button.mini-pipeline-graph-dropdown-toggle {
         flex: 1;
       }
 
-      // build name
-      .ci-build-text,
-      .ci-status-text {
-        font-weight: 200;
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-        max-width: 70%;
-        margin-left: 2px;
-        display: inline-block;
-
-        &::after {
-          content: '';
-          display: block;
-        }
-
-        @include media-breakpoint-down(xs) {
-          max-width: 60%;
-        }
-      }
 
       .ci-status-icon {
         @extend .append-right-8;
@@ -994,7 +979,6 @@ button.mini-pipeline-graph-dropdown-toggle {
  * Top arrow in the dropdown in the mini pipeline graph
  */
 .mini-pipeline-graph-dropdown-menu {
-
   &::before,
   &::after {
     content: '';