From 457af7bc02e0538023f5566f61b4c264d59cbe9d Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Thu, 7 Nov 2024 16:24:45 +0300
Subject: [PATCH 1/2] Update uikit page

---
 apps/showcase/assets/data/news.json |  7 ++++---
 apps/showcase/layouts/AppNews.vue   |  2 +-
 apps/showcase/pages/uikit/index.vue | 26 +++++++++++++++++---------
 3 files changed, 22 insertions(+), 13 deletions(-)

diff --git a/apps/showcase/assets/data/news.json b/apps/showcase/assets/data/news.json
index 031329ca2..74c784670 100644
--- a/apps/showcase/assets/data/news.json
+++ b/apps/showcase/assets/data/news.json
@@ -1,6 +1,7 @@
 {
-    "id": 70,
-    "content": "v4.2.0 is out with the Forms library",
+    "id": 71,
+    "content": "Figma UI Kit v3 is out! 🚀",
     "linkText": "Learn More",
-    "linkHref": "https://primevue.org/forms"
+    "linkHref": "https://primevue.org/uikit",
+    "target": "_self"
 }
diff --git a/apps/showcase/layouts/AppNews.vue b/apps/showcase/layouts/AppNews.vue
index 9ae19d3c2..2be0f1301 100644
--- a/apps/showcase/layouts/AppNews.vue
+++ b/apps/showcase/layouts/AppNews.vue
@@ -4,7 +4,7 @@
             <i></i>
             <div class="layout-news-content">
                 <span class="layout-news-text" :style="$appState.announcement.textStyle">{{ $appState.announcement.content }}</span>
-                <a class="layout-news-link" :href="$appState.announcement.linkHref" target="_blank" rel="noopener noreferrer">{{ $appState.announcement.linkText }}</a>
+                <a class="layout-news-link" :href="$appState.announcement.linkHref" :target="$appState.announcement.target" rel="noopener noreferrer">{{ $appState.announcement.linkText }}</a>
             </div>
             <a class="layout-news-close" :style="$appState.announcement.textStyle" @click="onClose">
                 <span class="pi pi-times"></span>
diff --git a/apps/showcase/pages/uikit/index.vue b/apps/showcase/pages/uikit/index.vue
index 1cc60f758..f98ae3d3a 100644
--- a/apps/showcase/pages/uikit/index.vue
+++ b/apps/showcase/pages/uikit/index.vue
@@ -18,7 +18,7 @@
                     <div class="w-full md:w-6/12">
                         <div class="text-primary font-bold mb-2">UP-TO-DATE</div>
                         <div class="text-5xl font-bold mb-4">Best Features of Figma</div>
-                        <p class="mb-4 text-lg">PrimeOne for Figma uses the latest powerful features like components, variants, auto layout, styles and interactive components. It'll always follow the best practices.</p>
+                        <p class="mb-4 text-lg">PrimeOne for Figma uses the latest powerful features like components, variants, auto layout, styles, variables and interactive components. It'll always follow the best practices.</p>
 
                         <ul class="flex flex-wrap m-0 p-0 text-lg">
                             <li class="flex items-center w-6/12 p-4">
@@ -31,7 +31,7 @@
                             </li>
                             <li class="flex items-center w-6/12 p-4">
                                 <i class="pi pi-check-circle text-green-600 mr-2"></i>
-                                <span class="font-bold">Styles</span>
+                                <span class="font-bold">Variables and Styles</span>
                             </li>
                             <li class="flex items-center w-6/12 p-4">
                                 <i class="pi pi-check-circle text-green-600 mr-2"></i>
@@ -84,16 +84,16 @@
                     <div class="w-full md:w-6/12">
                         <div class="text-primary font-bold mb-2">DARK MODE</div>
                         <div class="text-5xl font-bold mb-4">Two Themes</div>
-                        <p class="mb-4 text-lg">PrimeOne is designed based on Lara Blue Light and Lara Blue Dark themes. Easily change the themes of your designs using Figma's Swap Library feature.</p>
+                        <p class="mb-4 text-lg">PrimeOne is designed based on Aura Light and Aura Dark themes. Easily change the themes of your designs using Figma's Swap Library feature or Tokens Studio Sets.</p>
 
                         <ul class="flex flex-wrap m-0 p-0 text-lg">
                             <li class="flex items-center w-6/12 p-4">
                                 <i class="pi pi-check-circle text-green-600 mr-2"></i>
-                                <span class="font-bold">Lara Light</span>
+                                <span class="font-bold">Aura Light</span>
                             </li>
                             <li class="flex items-center w-6/12 p-4">
                                 <i class="pi pi-check-circle text-green-600 mr-2"></i>
-                                <span class="font-bold">Lara Dark</span>
+                                <span class="font-bold">Aura Dark</span>
                             </li>
                         </ul>
                     </div>
@@ -113,10 +113,14 @@
                                 <i class="pi pi-check-circle text-green-600 mr-2"></i>
                                 <span class="font-bold">Light and Dark Sets</span>
                             </li>
-                            <li class="flex items-center w-full p-4">
+                            <li class="flex items-center w-6/12 p-4">
                                 <i class="pi pi-check-circle text-green-600 mr-2"></i>
                                 <span class="font-bold">Well Documented</span>
                             </li>
+                            <li class="flex items-center w-6/12 p-4">
+                                <i class="pi pi-check-circle text-green-600 mr-2"></i>
+                                <span class="font-bold">Primitive, Semantic and Component Tokens</span>
+                            </li>
                         </ul>
                     </div>
                     <div class="w-full md:w-6/12">
@@ -125,18 +129,22 @@
                 </div>
             </div>
 
-            <div class="flex flex-col md:flex-row gap-6 md:gap-20 mb-8">
+            <div class="flex flex-col md:flex-row gap-6 md:gap-6 mb-8">
                 <a
-                    href="https://www.figma.com/file/96Tql1EywmMtVlSFTkQ2MB/Preview-%7C-PrimeOne-%7C-2.2.0?type=design&node-id=806%3A36648&mode=design&t=CPR8n1g9WLc5D2Hs-1"
+                    href="https://www.figma.com/design/G855HjuSyK8viJr0a5ZjRG/Preview-%7C%C2%A0PrimeOne-%7C-3.0.1?node-id=830-41631&t=m1MbOTTqKsBSRBLS-1"
                     class="p-8 w-full md:w-6/12 bg-white flex flex-col items-center border-2 border-transparent hover:border-primary transition-colors duration-300"
+                    target="_blank"
+                    rel="noopener noreferrer"
                     style="border-radius: 50px"
                 >
                     <span class="text-gray-900 text-4xl font-bold mb-8">Preview Light</span>
                     <img alt="Figma Light" src="https://primefaces.org/cdn/primevue/images/uikit/logo-figma-light.svg" class="w-16" />
                 </a>
                 <a
-                    href="https://www.figma.com/file/ujRD6FFCWw1bE0h4wIebxl/Preview-%7C-Dark-%7C-PrimeOne-%7C-2.2.0?type=design&node-id=806%3A36648&mode=design&t=bG7aorZhOFIqX1qz-1"
+                    href="https://www.figma.com/design/XBQzDl4vDOO0pyxEGYcICt/Preview-%7C%C2%A0Dark-%7C-PrimeOne-%7C-3.0.1?node-id=806-36648&t=7AME0kw905t3PVVY-1"
                     class="p-8 w-full md:w-6/12 bg-gray-900 flex flex-col items-center border-2 border-transparent hover:border-primary transition-colors duration-300"
+                    target="_blank"
+                    rel="noopener noreferrer"
                     style="border-radius: 50px"
                 >
                     <span class="text-white text-4xl font-bold mb-8">Preview Dark</span>

From 7d188b7d6d5637d2c4a3afc23bf0e9a81b8222d0 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Thu, 7 Nov 2024 16:25:05 +0300
Subject: [PATCH 2/2] Add badge

---
 apps/showcase/assets/menu/menu.json | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/apps/showcase/assets/menu/menu.json b/apps/showcase/assets/menu/menu.json
index 9ee8b82ba..a982277a6 100644
--- a/apps/showcase/assets/menu/menu.json
+++ b/apps/showcase/assets/menu/menu.json
@@ -530,7 +530,8 @@
         {
             "name": "Figma UI Kit",
             "icon": "pi pi-pencil",
-            "to": "/uikit"
+            "to": "/uikit",
+            "badge": "NEW"
         },
         {
             "name": "Templates",