Add latest changes from gitlab-org/gitlab@master

2 files changed, 17 insertions, 17 deletions

diff --git a/app/assets/javascripts/runner/components/runner_detail.vue b/app/assets/javascripts/runner/components/runner_detail.vue
index db67acef3db..584f77b7648 100644
--- a/app/assets/javascripts/runner/components/runner_detail.vue
+++ b/app/assets/javascripts/runner/components/runner_detail.vue
@@ -38,11 +38,10 @@ export default {
 </script>
 
 <template>
-  <div class="gl-display-flex gl-pb-4">
-    <dt class="gl-mr-2">{{ label }}</dt>
-    <dd class="gl-mb-0">
-      <!-- eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots -->
-      <template v-if="value || $slots.value">
+  <div class="gl-display-contents">
+    <dt class="gl-mb-5 gl-mr-6 gl-max-w-26">{{ label }}</dt>
+    <dd class="gl-mb-5">
+      <template v-if="value || $scopedSlots.value">
         <slot name="value">{{ value }}</slot>
       </template>
       <span v-else class="gl-text-gray-500">{{ emptyValue }}</span>
diff --git a/app/assets/javascripts/runner/components/runner_details.vue b/app/assets/javascripts/runner/components/runner_details.vue
index 60469d26dd5..d5222f39b81 100644
--- a/app/assets/javascripts/runner/components/runner_details.vue
+++ b/app/assets/javascripts/runner/components/runner_details.vue
@@ -51,6 +51,9 @@ export default {
       }
       return null;
     },
+    tagList() {
+      return this.runner.tagList || [];
+    },
     isGroupRunner() {
       return this.runner?.runnerType === GROUP_TYPE;
     },
@@ -66,14 +69,17 @@ export default {
   <div>
     <runner-upgrade-status-alert class="gl-my-4" :runner="runner" />
     <div class="gl-pt-4">
-      <dl class="gl-mb-0" data-testid="runner-details-list">
+      <dl
+        class="gl-mb-0 gl-display-grid runner-details-grid-template"
+        data-testid="runner-details-list"
+      >
         <runner-detail :label="s__('Runners|Description')" :value="runner.description" />
         <runner-detail
           :label="s__('Runners|Last contact')"
           :empty-value="s__('Runners|Never contacted')"
         >
-          <template #value>
-            <time-ago v-if="runner.contactedAt" :time="runner.contactedAt" />
+          <template v-if="runner.contactedAt" #value>
+            <time-ago :time="runner.contactedAt" />
           </template>
         </runner-detail>
         <runner-detail :label="s__('Runners|Version')">
@@ -87,8 +93,8 @@ export default {
         <runner-detail :label="s__('Runners|Architecture')" :value="runner.architectureName" />
         <runner-detail :label="s__('Runners|Platform')" :value="runner.platformName" />
         <runner-detail :label="s__('Runners|Configuration')">
-          <template #value>
-            <gl-intersperse v-if="configTextProtected || configTextUntagged">
+          <template v-if="configTextProtected || configTextUntagged" #value>
+            <gl-intersperse>
               <span v-if="configTextProtected">{{ configTextProtected }}</span>
               <span v-if="configTextUntagged">{{ configTextUntagged }}</span>
             </gl-intersperse>
@@ -96,13 +102,8 @@ export default {
         </runner-detail>
         <runner-detail :label="s__('Runners|Maximum job timeout')" :value="maximumTimeout" />
         <runner-detail :label="s__('Runners|Tags')">
-          <template #value>
-            <runner-tags
-              v-if="runner.tagList && runner.tagList.length"
-              class="gl-vertical-align-middle"
-              :tag-list="runner.tagList"
-              size="sm"
-            />
+          <template v-if="tagList.length" #value>
+            <runner-tags class="gl-vertical-align-middle" :tag-list="tagList" size="sm" />
           </template>
         </runner-detail>