From 91c321375e1dba36e59e90589d7a950846d7fe90 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Tue, 28 May 2019 11:37:42 +0100
Subject: [PATCH] Truncates job names in pipeline graph

---
 .../pipelines/components/graph/job_group_dropdown.vue        | 4 +++-
 changelogs/unreleased/62408-dropdown-truncate.yml            | 5 +++++
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 changelogs/unreleased/62408-dropdown-truncate.yml

diff --git a/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue b/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
index 482898b80c4..ebd7a17040a 100644
--- a/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
+++ b/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
@@ -69,7 +69,9 @@ export default {
     >
       <ci-icon :status="group.status" />
 
-      <span class="ci-status-text"> {{ group.name }} </span>
+      <span class="ci-status-text text-truncate mw-70p gl-pl-1 d-inline-block align-bottom">
+        {{ group.name }}
+      </span>
 
       <span class="dropdown-counter-badge"> {{ group.size }} </span>
     </button>
diff --git a/changelogs/unreleased/62408-dropdown-truncate.yml b/changelogs/unreleased/62408-dropdown-truncate.yml
new file mode 100644
index 00000000000..7204016efdf
--- /dev/null
+++ b/changelogs/unreleased/62408-dropdown-truncate.yml
@@ -0,0 +1,5 @@
+---
+title: Fix job name in graph dropdown overflowing
+merge_request: 28824
+author:
+type: fixed