Merge branch '41806-pipeline-jumping' into 'master'

Resolve "Pipeline stages are jumping when dropdown is open"

Closes #41806

See merge request gitlab-org/gitlab-ce!16556

app/assets/javascripts/pipelines/components/pipelines_table.vue

@@ -50,13 +50,13 @@
         Pipeline
       </div>
       <div
-        class="table-section section-25 js-pipeline-commit pipeline-commit"
+        class="table-section section-20 js-pipeline-commit pipeline-commit"
         role="rowheader"
       >
         Commit
       </div>
       <div
-        class="table-section section-15 js-pipeline-stages pipeline-stages"
+        class="table-section section-20 js-pipeline-stages pipeline-stages"
         role="rowheader"
       >
         Stages

app/assets/javascripts/pipelines/components/pipelines_table_row.vue

@@ -239,7 +239,7 @@
       :auto-devops-help-path="autoDevopsHelpPath"
     />
-    <div class="table-section section-25">
+    <div class="table-section section-20">
       <div
         class="table-mobile-header"
         role="rowheader">
@@ -258,7 +258,7 @@
       </div>
     </div>
-    <div class="table-section section-wrap section-15 stage-cell">
+    <div class="table-section section-wrap section-20 stage-cell">
       <div
         class="table-mobile-header"
         role="rowheader">

app/assets/stylesheets/pages/pipelines.scss

@@ -228,7 +228,7 @@
 .stage-cell {
   &.table-section {
     @media (min-width: $screen-md-min) {
-      min-width: 148px;
+      min-width: 160px; /* Hack alert: Without this the mini graph pipeline won't work properly*/
       margin-right: -4px;
     }
   }