1 files changed, 22 insertions, 24 deletions
diff --git a/app/assets/javascripts/ci/runner/components/runner_header.vue b/app/assets/javascripts/ci/runner/components/runner_header.vue
index f46e894bf2e..55a33ef2074 100644
--- a/app/assets/javascripts/ci/runner/components/runner_header.vue
+++ b/app/assets/javascripts/ci/runner/components/runner_header.vue
@@ -32,31 +32,29 @@ export default {
 };
 </script>
 <template>
-  <div
-    class="gl-display-flex gl-justify-content-space-between gl-align-items-flex-start gl-gap-3 gl-flex-wrap gl-py-5"
-  >
-    <div>
+  <div class="gl-py-5">
+    <div class="gl-display-flex gl-justify-content-space-between">
       <h1 class="gl-font-size-h-display gl-my-0">{{ name }}</h1>
-      <div class="gl-display-flex gl-align-items-flex-start gl-gap-3 gl-flex-wrap gl-mt-3">
-        <runner-status-badge :contacted-at="runner.contactedAt" :status="runner.status" />
-        <runner-type-badge :type="runner.runnerType" />
-        <span v-if="runner.createdAt">
-          <gl-sprintf :message="__('%{locked} created %{timeago}')">
-            <template #locked>
-              <gl-icon
-                v-if="runner.locked"
-                v-gl-tooltip="$options.I18N_LOCKED_RUNNER_DESCRIPTION"
-                name="lock"
-                :aria-label="$options.I18N_LOCKED_RUNNER_DESCRIPTION"
-              />
-            </template>
-            <template #timeago>
-              <time-ago :time="runner.createdAt" />
-            </template>
-          </gl-sprintf>
-        </span>
-      </div>
+      <slot name="actions"></slot>
+    </div>
+    <div class="gl-display-flex gl-align-items-flex-start gl-gap-3 gl-flex-wrap gl-mt-3">
+      <runner-status-badge :contacted-at="runner.contactedAt" :status="runner.status" />
+      <runner-type-badge :type="runner.runnerType" />
+      <span v-if="runner.createdAt">
+        <gl-sprintf :message="__('%{locked} created %{timeago}')">
+          <template #locked>
+            <gl-icon
+              v-if="runner.locked"
+              v-gl-tooltip="$options.I18N_LOCKED_RUNNER_DESCRIPTION"
+              name="lock"
+              :aria-label="$options.I18N_LOCKED_RUNNER_DESCRIPTION"
+            />
+          </template>
+          <template #timeago>
+            <time-ago :time="runner.createdAt" />
+          </template>
+        </gl-sprintf>
+      </span>
     </div>
-    <div class="gl-display-flex gl-gap-3 gl-flex-wrap"><slot name="actions"></slot></div>
   </div>
 </template>