From 8336423981e48df804bc0b7109e5d288862e3447 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Mon, 13 Jan 2025 12:28:00 +0300
Subject: [PATCH] Image for dashboard

---
 .../layout/designer/dashboard/DesignDashboard.vue     | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/apps/showcase/components/layout/designer/dashboard/DesignDashboard.vue b/apps/showcase/components/layout/designer/dashboard/DesignDashboard.vue
index 12abe22ad..919cb4b47 100644
--- a/apps/showcase/components/layout/designer/dashboard/DesignDashboard.vue
+++ b/apps/showcase/components/layout/designer/dashboard/DesignDashboard.vue
@@ -1,4 +1,10 @@
 <template>
+    <div style="border-radius: 50px" class="overflow-hidden mb-8">
+        <NuxtLink to="/designer" class="block">
+            <img alt="PrimeVue Designer" :src="coverImage" class="w-full opacity-0 animate-fadein animate-delay-200 animate-fill-forwards" />
+        </NuxtLink>
+    </div>
+
     <div class="text-lg font-semibold mb-2">License Key</div>
     <span class="block text-muted-color leading-6 mb-4"
         >A license can be purchased from PrimeStore, if you do not have a license key, you are still able to experience the Designer with limited features. <NuxtLink to="/designer" class="doc-link">Learn more</NuxtLink> about the Theme
@@ -262,6 +268,11 @@ export default {
         },
         themeUsageRatio() {
             return this.$appState.designer.themeLimit ? 100 * (this.$appState.designer.themes.length / this.$appState.designer.themeLimit) : 0;
+        },
+        coverImage() {
+            const image = this.$appState.darkTheme ? 'editor-intro-dark.png' : 'editor-intro.png';
+
+            return 'https://primefaces.org/cdn/designer/' + image;
         }
     }
 };