Fix CI icon vertical centering

Reduce line height of wrapping span so it reduces to height
of the inner gl-icon

Could/should perhaps set line-height 1, but we don't have
a util class for it

app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue

@@ -60,7 +60,7 @@ export default {
     >
       <div class="gl-display-flex gl-align-items-center gl-justify-content-space-between">
         <span class="gl-display-flex gl-align-items-center gl-min-w-0">
-          <ci-icon :status="group.status" :size="24" />
+          <ci-icon :status="group.status" :size="24" class="gl-line-height-0" />
           <span class="gl-text-truncate mw-70p gl-pl-3">
             {{ group.name }}
           </span>

app/assets/javascripts/pipelines/components/graph/job_name_component.vue

@@ -30,7 +30,7 @@ export default {
 </script>
 <template>
   <span class="ci-job-name-component mw-100 gl-display-flex gl-align-items-center">
-    <ci-icon :size="iconSize" :status="status" />
+    <ci-icon :size="iconSize" :status="status" class="gl-line-height-0" />
     <span class="gl-text-truncate mw-70p gl-pl-3 gl-display-inline-block">
       {{ name }}
     </span>

changelogs/unreleased/psi-pipeline-icon-align.yml

+---
+title: Vertically centre CI icons on pipeline page
+merge_request: 53427
+author:
+type: fixed