From 0362c9e3a316a037a2f5b4d345b3371180752d82 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Thu, 26 Sep 2024 11:44:01 +0300
Subject: [PATCH] Fixed jump

---
 apps/showcase/doc/message/LifeDoc.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/apps/showcase/doc/message/LifeDoc.vue b/apps/showcase/doc/message/LifeDoc.vue
index 54a43f9df..7dfc36f2c 100644
--- a/apps/showcase/doc/message/LifeDoc.vue
+++ b/apps/showcase/doc/message/LifeDoc.vue
@@ -2,8 +2,8 @@
     <DocSectionText v-bind="$attrs">
         <p>Messages can disappear automatically by defined the <i>life</i> in milliseconds.</p>
     </DocSectionText>
-    <div class="card flex flex-col items-center justify-center gap-4">
-        <Button label="Show" @click="showMessage" :disabled="visible" />
+    <div class="card flex flex-col items-center justify-center">
+        <Button label="Show" @click="showMessage" :disabled="visible" class="mb-4" />
         <Message v-if="visible" severity="success" :life="3000">Auto Disappear Message</Message>
     </div>
     <DocSectionCode :code="code" />
@@ -16,13 +16,13 @@ export default {
             visible: false,
             code: {
                 basic: `
-<Button label="Show" @click="showMessage" :disabled="visible" />
+<Button label="Show" @click="showMessage" :disabled="visible" class="mb-4" />
 <Message v-if="visible" severity="success" :life="3000">Auto Disappear Message</Message>
 `,
                 options: `
 <template>
-    <div class="card flex flex-col items-center justify-center gap-4">
-        <Button label="Show" @click="showMessage" :disabled="visible" />
+    <div class="card flex flex-col items-center justify-center">
+        <Button label="Show" @click="showMessage" :disabled="visible" class="mb-4" />
         <Message v-if="visible" severity="success" :life="3000">Auto Disappear Message</Message>
     </div>
 </template>
@@ -48,8 +48,8 @@ export default {
 `,
                 composition: `
 <template>
-    <div class="card flex flex-col items-center justify-center gap-4">
-        <Button label="Show" @click="showMessage" :disabled="visible" />
+    <div class="card flex flex-col items-center justify-center">
+        <Button label="Show" @click="showMessage" :disabled="visible" class="mb-4" />
         <Message v-if="visible" severity="success" :life="3000">Auto Disappear Message</Message>
     </div>
 </template>