fix overflowing tooltips in pipelines dropdown47516-pipe-scroll

2 files changed, 16 insertions, 22 deletions

diff --git a/app/assets/javascripts/pipelines/components/graph/job_component.vue b/app/assets/javascripts/pipelines/components/graph/job_component.vue
index 886e62ab1a7..309fe7c6a98 100644
--- a/app/assets/javascripts/pipelines/components/graph/job_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/job_component.vue
@@ -96,7 +96,7 @@ export default {
       :class="cssClassJobName"
       data-container="body"
       data-html="true"
-      data-boundary="viewport"
+      data-boundary="scrollParent"
       class="js-pipeline-graph-job-link"
     >
 
diff --git a/app/assets/javascripts/pipelines/components/stage.vue b/app/assets/javascripts/pipelines/components/stage.vue
index b9231c002fd..d1b1f586dff 100644
--- a/app/assets/javascripts/pipelines/components/stage.vue
+++ b/app/assets/javascripts/pipelines/components/stage.vue
@@ -186,32 +186,26 @@ export default {
       </i>
     </button>
 
-    <ul
+    <div
       class="dropdown-menu mini-pipeline-graph-dropdown-menu js-builds-dropdown-container"
       aria-labelledby="stageDropdown"
     >
-
-      <li
+      <loading-icon v-if="isLoading"/>
+      <ul
+        v-else
         class="js-builds-dropdown-list scrollable-menu"
       >
-
-        <loading-icon v-if="isLoading"/>
-
-        <ul
-          v-else
+        <li
+          v-for="job in dropdownContent"
+          :key="job.id"
         >
-          <li
-            v-for="job in dropdownContent"
-            :key="job.id"
-          >
-            <job-component
-              :job="job"
-              css-class-job-name="mini-pipeline-graph-dropdown-item"
-              @pipelineActionRequestComplete="pipelineActionRequestComplete"
-            />
-          </li>
-        </ul>
-      </li>
-    </ul>
+          <job-component
+            :job="job"
+            css-class-job-name="mini-pipeline-graph-dropdown-item"
+            @pipelineActionRequestComplete="pipelineActionRequestComplete"
+          />
+        </li>
+      </ul>
+    </div>
   </div>
 </template>