diff --git a/app/assets/javascripts/ci/pipeline_details/graph/components/job_item.vue b/app/assets/javascripts/ci/pipeline_details/graph/components/job_item.vue index 885f2a055389496d815d2cc637af841e8f9ee084..87c577770670834f48353252750b50d10174e699 100644 --- a/app/assets/javascripts/ci/pipeline_details/graph/components/job_item.vue +++ b/app/assets/javascripts/ci/pipeline_details/graph/components/job_item.vue @@ -339,7 +339,7 @@ export default { :title="tooltipText" :class="jobClasses" :href="detailsPath" - class="menu-item gl-text-gray-900 active:gl-no-underline focus:gl-no-underline hover:gl-no-underline hover:gl-bg-strong focus:gl-bg-strong gl-w-full gl-rounded" + class="menu-item gl-text-gray-900 active:gl-no-underline focus:gl-no-underline hover:gl-no-underline hover:gl-bg-strong focus:gl-bg-strong gl-w-full gl-rounded-base" data-testid="ci-job-item-content" @click="jobItemClick" @mouseout="hideTooltips" diff --git a/app/assets/javascripts/ci/pipeline_details/graph/components/stage_column_component.vue b/app/assets/javascripts/ci/pipeline_details/graph/components/stage_column_component.vue index 2605332774a7b3fdda3068807db0aad8d0072569..4b30268bf27f6e80afa1d55161461d723f0f2631 100644 --- a/app/assets/javascripts/ci/pipeline_details/graph/components/stage_column_component.vue +++ b/app/assets/javascripts/ci/pipeline_details/graph/components/stage_column_component.vue @@ -79,7 +79,7 @@ export default { jobClasses: [ 'gl-p-3', 'gl-border-0', - 'gl-rounded', + 'gl-rounded-base', 'hover:gl-bg-strong', 'focus:gl-bg-strong', 'gl-hover-text-gray-900', @@ -180,7 +180,7 @@ export default { <template #stages> <div data-testid="stage-column-title" - class="stage-column-title gl-display-flex gl-justify-content-space-between gl-relative gl-font-bold gl-pipeline-job-width gl-text-truncate gl-leading-36 gl-pl-4 -gl-mb-2" + class="stage-column-title gl-flex gl-justify-between gl-relative gl-font-bold gl-pipeline-job-width gl-text-truncate gl-leading-36 gl-pl-4 -gl-mb-2" > <span :title="name" class="gl-text-truncate gl-pr-3 gl-w-17/20"> {{ name }} diff --git a/app/assets/javascripts/ci/pipeline_mini_graph/legacy_pipeline_mini_graph/legacy_job_item.vue b/app/assets/javascripts/ci/pipeline_mini_graph/legacy_pipeline_mini_graph/legacy_job_item.vue index 5b80504cd0b382ec5ea01a744e4496c0a5bef08f..e6f09ff88b8a479edd021702a5ee39e4ef9a5278 100644 --- a/app/assets/javascripts/ci/pipeline_mini_graph/legacy_pipeline_mini_graph/legacy_job_item.vue +++ b/app/assets/javascripts/ci/pipeline_mini_graph/legacy_pipeline_mini_graph/legacy_job_item.vue @@ -180,9 +180,7 @@ export default { :data-testid="testid" > <template #list-item> - <div - class="gl-display-flex gl-align-items-center gl-justify-content-space-between -gl-mt-2 -gl-mb-2 -gl-ml-2" - > + <div class="gl-flex gl-items-center gl-justify-between -gl-my-1 -gl-ml-2"> <job-name-component v-gl-tooltip.viewport.left :title="tooltipText" @@ -198,7 +196,6 @@ export default { :action-icon="status.action.icon" :should-trigger-click="shouldTriggerActionClick" :with-confirmation-modal="withConfirmationModal" - class="-gl-mt-2 -gl-mr-2" @showActionConfirmationModal="showActionConfirmationModal" /> <gl-modal diff --git a/app/assets/stylesheets/page_bundles/_pipeline_mixins.scss b/app/assets/stylesheets/page_bundles/_pipeline_mixins.scss index b5ca59fc2d602bcbcc31a7dff9ff36415dceb8e1..c72ae1226fda94de1823ca11a7c4919564786127 100644 --- a/app/assets/stylesheets/page_bundles/_pipeline_mixins.scss +++ b/app/assets/stylesheets/page_bundles/_pipeline_mixins.scss @@ -25,8 +25,8 @@ .ci-action-icon-container { position: absolute; - right: 11px; - top: 7px; + top: 4px; + right: 4px; &.ci-action-icon-wrapper { height: $ci-action-dropdown-button-size; diff --git a/spec/frontend/ci/pipeline_details/graph/components/graph_component_spec.js b/spec/frontend/ci/pipeline_details/graph/components/graph_component_spec.js index a64b9e0ded47dfaf29c219ff70ae8b688903b626..a6d979319190eb5daec538076c41a5895cfcbac7 100644 --- a/spec/frontend/ci/pipeline_details/graph/components/graph_component_spec.js +++ b/spec/frontend/ci/pipeline_details/graph/components/graph_component_spec.js @@ -219,7 +219,7 @@ describe('graph component', () => { const jobClasses = [ 'gl-p-3', 'gl-border-0', - 'gl-rounded', + 'gl-rounded-base', 'hover:gl-bg-strong', 'focus:gl-bg-strong', 'gl-hover-text-gray-900',