From 46892bf9c9555c503953f225ab8eb05bb95913af Mon Sep 17 00:00:00 2001
From: Selemondev <106826371+selemondev@users.noreply.github.com>
Date: Sun, 12 Nov 2023 00:07:23 -0800
Subject: [PATCH] docs: add shadcn/vue VSCode extension (#163)

* docs(app): #162 add shadcn/vue VSCode extension

This pull request is intended to add the shadcn/vue VSCode extension to the installation guide.

Closes: #162

* docs: update announcement

* docs: credit, and format the text

---------

Co-authored-by: zernonia <zernonia@gmail.com>
---
 apps/www/.vitepress/theme/config/site.ts  |  4 ++--
 apps/www/src/content/docs/installation.md | 14 +++++++++++++-
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/apps/www/.vitepress/theme/config/site.ts b/apps/www/.vitepress/theme/config/site.ts
index 7ff16cd4..060adca5 100644
--- a/apps/www/.vitepress/theme/config/site.ts
+++ b/apps/www/.vitepress/theme/config/site.ts
@@ -15,6 +15,6 @@ export const siteConfig = {
 
 export const announcementConfig = {
   icon: '✨',
-  title: 'New Toast component',
-  link: '/docs/components/toast',
+  title: 'VSCode extension',
+  link: '/docs/installation.html#vscode-extension',
 }
diff --git a/apps/www/src/content/docs/installation.md b/apps/www/src/content/docs/installation.md
index 899f8244..13afcaf3 100644
--- a/apps/www/src/content/docs/installation.md
+++ b/apps/www/src/content/docs/installation.md
@@ -92,4 +92,16 @@ To configure import aliases, you can use the following `jsconfig.json`:
       "@/*": ["./*"]
     }
   }
-}
\ No newline at end of file
+}
+```
+
+## VSCode extension
+
+Install the [shadcn-vue](https://marketplace.visualstudio.com/items?itemName=Selemondev.shadcn-vue) extension by [@selemondev](https://github.com/selemondev) in Visual Studio Code to easily add Shadcn Vue components to your project. 
+
+This extension offers a range of features:
+- Ability to initialize the Shadcn Vue CLI
+- Install components
+- Open documentation
+- Navigate to a specific component's documentation page directly from your IDE. 
+- Handy snippets for quick and straightforward component imports and markup.