From ad6461b26a3e65c8c9374e5fce166f9f04f8902d Mon Sep 17 00:00:00 2001
From: Atakan <tepe_atakan@outlook.com>
Date: Mon, 16 Sep 2024 17:40:05 +0300
Subject: [PATCH] Megamenu Template Section Visual Issue [fixed #6410]

---
 apps/showcase/doc/megamenu/TemplateDoc.vue | 20 ++++++++------------
 1 file changed, 8 insertions(+), 12 deletions(-)

diff --git a/apps/showcase/doc/megamenu/TemplateDoc.vue b/apps/showcase/doc/megamenu/TemplateDoc.vue
index 004329cc9..349dab72e 100644
--- a/apps/showcase/doc/megamenu/TemplateDoc.vue
+++ b/apps/showcase/doc/megamenu/TemplateDoc.vue
@@ -19,9 +19,8 @@
                 </svg>
             </template>
             <template #item="{ item }">
-                <a v-if="item.root" v-ripple class="flex items-center cursor-pointer px-4 py-2 overflow-hidden relative font-semibold text-lg uppercase" style="border-radius: 2rem">
-                    <span :class="item.icon" />
-                    <span class="ml-2">{{ item.label }}</span>
+                <a v-if="item.root" class="flex items-center cursor-pointer px-4 py-2 overflow-hidden relative font-semibold text-lg uppercase" style="border-radius: 2rem">
+                    <span>{{ item.label }}</span>
                 </a>
                 <a v-else-if="!item.image" class="flex items-center p-4 cursor-pointer mb-2 gap-3">
                     <span class="inline-flex items-center justify-center rounded-full bg-primary text-primary-contrast w-12 h-12">
@@ -108,9 +107,8 @@ export default {
         </svg>
     </template>
     <template #item="{ item }">
-        <a v-if="item.root" v-ripple class="flex items-center cursor-pointer px-4 py-2 overflow-hidden relative font-semibold text-lg uppercase" style="border-radius: 2rem">
-            <span :class="item.icon" />
-            <span class="ml-2">{{ item.label }}</span>
+        <a v-if="item.root" class="flex items-center cursor-pointer px-4 py-2 overflow-hidden relative font-semibold text-lg uppercase" style="border-radius: 2rem">
+            <span>{{ item.label }}</span>
         </a>
         <a v-else-if="!item.image" class="flex items-center p-4 cursor-pointer mb-2 gap-3">
             <span class="inline-flex items-center justify-center rounded-full bg-primary text-primary-contrast w-12 h-12">
@@ -149,9 +147,8 @@ export default {
                 </svg>
             </template>
             <template #item="{ item }">
-                <a v-if="item.root" v-ripple class="flex items-center cursor-pointer px-4 py-2 overflow-hidden relative font-semibold text-lg uppercase" style="border-radius: 2rem">
-                    <span :class="item.icon" />
-                    <span class="ml-2">{{ item.label }}</span>
+                <a v-if="item.root" class="flex items-center cursor-pointer px-4 py-2 overflow-hidden relative font-semibold text-lg uppercase" style="border-radius: 2rem">
+                    <span>{{ item.label }}</span>
                 </a>
                 <a v-else-if="!item.image" class="flex items-center p-4 cursor-pointer mb-2 gap-3">
                     <span class="inline-flex items-center justify-center rounded-full bg-primary text-primary-contrast w-12 h-12">
@@ -249,9 +246,8 @@ export default {
                 </svg>
             </template>
             <template #item="{ item }">
-                <a v-if="item.root" v-ripple class="flex items-center cursor-pointer px-4 py-2 overflow-hidden relative font-semibold text-lg uppercase" style="border-radius: 2rem">
-                    <span :class="item.icon" />
-                    <span class="ml-2">{{ item.label }}</span>
+                <a v-if="item.root" class="flex items-center cursor-pointer px-4 py-2 overflow-hidden relative font-semibold text-lg uppercase" style="border-radius: 2rem">
+                    <span>{{ item.label }}</span>
                 </a>
                 <a v-else-if="!item.image" class="flex items-center p-4 cursor-pointer mb-2 gap-3">
                     <span class="inline-flex items-center justify-center rounded-full bg-primary text-primary-contrast w-12 h-12">