From 1c015eda90dabb45e5f9f0344ec6dfb9be6eba81 Mon Sep 17 00:00:00 2001
From: Tim Zallmann <tzallmann@gitlab.com>
Date: Mon, 30 Oct 2017 12:31:20 +0100
Subject: Fixed different sizes

---
 .../javascripts/pipelines/components/stage.vue     |  6 +++-
 app/assets/stylesheets/pages/pipelines.scss        | 33 ++++++++++++++++++----
 2 files changed, 33 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/pipelines/components/stage.vue b/app/assets/javascripts/pipelines/components/stage.vue
index 24a15339622..c8bccb4f20d 100644
--- a/app/assets/javascripts/pipelines/components/stage.vue
+++ b/app/assets/javascripts/pipelines/components/stage.vue
@@ -122,6 +122,10 @@ export default {
     triggerButtonClass() {
       return `ci-status-icon-${this.stage.status.group}`;
     },
+
+    borderlessIcon() {
+      return `${this.stage.status.icon}_borderless`;
+    }
   },
 };
 </script>
@@ -145,7 +149,7 @@ export default {
         aria-hidden="true"
         :aria-label="stage.title">
         <icon
-          :name="stage.status.icon"/>
+          :name="borderlessIcon"/>
       </span>
 
       <i
diff --git a/app/assets/stylesheets/pages/pipelines.scss b/app/assets/stylesheets/pages/pipelines.scss
index c24b780052d..237224cb770 100644
--- a/app/assets/stylesheets/pages/pipelines.scss
+++ b/app/assets/stylesheets/pages/pipelines.scss
@@ -474,6 +474,14 @@
         height: 18px;
       }
 
+      &.play {
+        svg {
+          width: #{$ci-action-icon-size - 8};
+          height: #{$ci-action-icon-size - 8};
+          left: 8px;
+        }
+      }
+
       &:hover svg {
         fill: $gl-text-color;
       }
@@ -738,19 +746,34 @@ button.mini-pipeline-graph-dropdown-toggle {
       &.icon-action-retry,
       &.icon-action-play {
         svg {
-          width: calc($ci-action-icon-size-6);
-          height: calc($ci-action-icon-size-6);
+          width: #{$ci-action-icon-size - 6};
+          height: #{$ci-action-icon-size - 6};
           left: 8px;
         }
       }
 
-      svg.icon-action-play,
-      svg.icon-action-stop {
+      svg.icon-action-stop,
+      svg.icon-action-cancel {
         width: 12px;
         height: 12px;
         top: 1px;
-        left: 0;
+        left: -1px;
+      }
+
+      svg.icon-action-play {
+        width: 11px;
+        height: 11px;
+        top: 1px;
+        left: 1px;
+      }
+
+      svg.icon-action-retry {
+        width: 16px;
+        height: 16px;
+        top: 0px;
+        left: -3px;
       }
+
     }
 
     // link to the build
-- 
cgit v1.2.1