Merge branch '246774-registry-list-spacing-between-left-and-right-is-inconsistent' into 'master'

Fix registry list item vertical spacing

See merge request gitlab-org/gitlab!41780

app/assets/javascripts/packages/shared/components/package_list_row.vue

@@ -116,6 +116,7 @@ export default {
     </template>
 
     <template #right-secondary>
+      <span>
         <gl-sprintf :message="__('Created %{timestamp}')">
           <template #timestamp>
             <span v-gl-tooltip :title="tooltipTitle(packageEntity.created_at)">
@@ -123,6 +124,7 @@ export default {
             </span>
           </template>
         </gl-sprintf>
+      </span>
     </template>
 
     <template v-if="!disableDelete" #right-action>

app/assets/javascripts/packages/shared/components/publish_method.vue

@@ -36,7 +36,7 @@ export default {
 </script>
 
 <template>
-  <div class="gl-display-flex gl-align-items-center gl-mb-2">
+  <div class="gl-display-flex gl-align-items-center">
     <template v-if="hasPipeline">
       <gl-icon name="git-merge" class="gl-mr-2" />
       <span data-testid="pipeline-ref" class="gl-mr-2">{{ packageEntity.pipeline.ref }}</span>

app/assets/javascripts/vue_shared/components/registry/list_item.vue

@@ -83,7 +83,7 @@ export default {
           </div>
           <div
             v-if="$slots['left-secondary']"
-            class="gl-text-gray-500 gl-mt-1 gl-min-h-6 gl-min-w-0 gl-flex-fill-1"
+            class="gl-display-flex gl-align-items-center gl-text-gray-500 gl-mt-1 gl-min-h-6 gl-min-w-0 gl-flex-fill-1"
           >
             <slot name="left-secondary"></slot>
           </div>
@@ -93,11 +93,14 @@ export default {
         >
           <div
             v-if="$slots['right-primary']"
-            class="gl-sm-text-body gl-sm-font-weight-bold gl-min-h-6"
+            class="gl-display-flex gl-align-items-center gl-sm-text-body gl-sm-font-weight-bold gl-min-h-6"
           >
             <slot name="right-primary"></slot>
           </div>
-          <div v-if="$slots['right-secondary']" class="gl-mt-1 gl-min-h-6">
+          <div
+            v-if="$slots['right-secondary']"
+            class="gl-display-flex gl-align-items-center gl-mt-1 gl-min-h-6"
+          >
             <slot name="right-secondary"></slot>
           </div>
         </div>

spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap

@@ -40,7 +40,7 @@ exports[`packages_list_row renders 1`] = `
         </div>
          
         <div
-          class="gl-text-gray-500 gl-mt-1 gl-min-h-6 gl-min-w-0 gl-flex-fill-1"
+          class="gl-display-flex gl-align-items-center gl-text-gray-500 gl-mt-1 gl-min-h-6 gl-min-w-0 gl-flex-fill-1"
         >
           <div
             class="gl-display-flex"
@@ -94,7 +94,7 @@ exports[`packages_list_row renders 1`] = `
         class="gl-display-flex gl-flex-direction-column gl-sm-align-items-flex-end gl-justify-content-space-between gl-text-gray-500 gl-flex-shrink-0"
       >
         <div
-          class="gl-sm-text-body gl-sm-font-weight-bold gl-min-h-6"
+          class="gl-display-flex gl-align-items-center gl-sm-text-body gl-sm-font-weight-bold gl-min-h-6"
         >
           <publish-method-stub
             packageentity="[object Object]"
@@ -102,11 +102,13 @@ exports[`packages_list_row renders 1`] = `
         </div>
          
         <div
-          class="gl-mt-1 gl-min-h-6"
+          class="gl-display-flex gl-align-items-center gl-mt-1 gl-min-h-6"
         >
+          <span>
             <gl-sprintf-stub
               message="Created %{timestamp}"
             />
+          </span>
         </div>
       </div>
     </div>

spec/frontend/packages/shared/components/__snapshots__/publish_method_spec.js.snap

@@ -2,7 +2,7 @@
 
 exports[`publish_method renders 1`] = `
 <div
-  class="gl-display-flex gl-align-items-center gl-mb-2"
+  class="gl-display-flex gl-align-items-center"
 >
   <gl-icon-stub
     class="gl-mr-2"