Update package dependencies, enhance Vite configuration with path aliases, and modify skill proficiency levels in Skill component for better accuracy.

Author: Darkcode-it

components.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "https://shadcn-vue.com/schema.json",
+  "style": "new-york",
+  "typescript": false,
+  "tailwind": {
+    "config": "",
+    "css": "src/index.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "composables": "@/composables"
+  },
+  "registries": {}
+}

jsconfig.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"],
+      "@/components/*": ["./src/Components/*"]
+    }
+  },
+  "include": ["src"]
+}
+

package-lock.json

@@ -18,6 +18,8 @@
     "@heroicons/react": "^2.2.0",
     "@tailwindcss/vite": "^4.0.15",
     "aos": "^2.3.4",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
     "framer-motion": "^12.15.0",
     "i18next": "^22.4.12",
     "i18next-http-backend": "^2.2.0",
@@ -29,6 +31,7 @@
     "react-dom": "^19.0.0",
     "react-i18next": "^12.2.0",
     "react-icons": "^5.5.0",
+    "tailwind-merge": "^3.4.0",
     "tailwindcss": "^4.0.15"
   },
   "devDependencies": {
@@ -41,6 +44,7 @@
     "eslint-plugin-react-refresh": "^0.4.19",
     "gh-pages": "^6.3.0",
     "globals": "^15.15.0",
+    "tw-animate-css": "^1.4.0",
     "vite": "^6.2.0",
     "vite-plugin-pwa": "^1.0.0"
   }

package.json

@@ -15,8 +15,8 @@
       "proficiency": 95
     },
     {
-      "id": "responsive-design",
-      "name": "Responsive Design",
+      "id": "responsive",
+      "name": "Responsive",
       "image": "./images/css3.png",
       "customClass": "",
       "proficiency": 95
@@ -26,7 +26,7 @@
       "name": "Bootstrap",
       "image": "./images/bootstrap.png",
       "customClass": "",
-      "proficiency": 85
+      "proficiency": 80
     },
     {
       "id": "tailwind",
@@ -41,21 +41,21 @@
       "image": "./images/js.png",
       "imageClass": "w-[53px]",
       "customClass": "",
-      "proficiency": 95
+      "proficiency": 50
     },
     {
       "id": "typescript",
       "name": "TypeScript",
       "image": "./images/typescript.png",
       "customClass": "",
-      "proficiency": 88
+      "proficiency": 50
     },
     {
       "id": "python",
       "name": "Python",
       "image": "./images/python.png",
       "customClass": "",
-      "proficiency": 80
+      "proficiency": 50
     },
     {
       "id": "radix-ui",
@@ -77,49 +77,49 @@
       "name": "React.Js",
       "image": "./images/react.png",
       "customClass": "",
-      "proficiency": 92
+      "proficiency": 90
     },
     {
       "id": "nextjs",
       "name": "Next.Js",
       "image": "./images/Next.js.webp",
       "customClass": "",
-      "proficiency": 85
+      "proficiency": 90
     },
     {
       "id": "vite",
       "name": "Vite",
       "image": "https://vitejs.dev/logo.svg",
       "customClass": "",
-      "proficiency": 85
+      "proficiency": 90
     },
     {
       "id": "npm",
       "name": "npm",
       "image": "./images/npm.png",
       "customClass": "",
-      "proficiency": 88
+      "proficiency": 90
     },
     {
       "id": "pwa-websocket",
       "name": "PWA / WebSocket",
       "image": "./images/WebPanel.png",
       "customClass": "",
-      "proficiency": 85
+      "proficiency": 95
     },
     {
       "id": "git",
       "name": "Git & GitHub",
       "image": "./images/git.png",
       "customClass": "",
-      "proficiency": 88
+      "proficiency": 80
     },
     {
       "id": "figma",
       "name": "Figma",
       "image": "./images/figma.png",
       "customClass": "",
-      "proficiency": 75
+      "proficiency": 70
     }
   ]
 }

src/Components/Skill/Skill.json

@@ -99,7 +99,7 @@ function Skills() {
                                             ></div>
                                         </div>
 
-                                        <div className="flex justify-center items-center gap-1 mt-1.5">
+                                        {/* <div className="flex justify-center items-center gap-1 mt-1.5">
                                             {[...Array(5)].map((_, starIndex) => (
                                                 <div
                                                     key={starIndex}
@@ -112,7 +112,7 @@ function Skills() {
                                                     }}
                                                 />
                                             ))}
-                                        </div>
+                                        </div> */}
                                     </div>
                                 </div>
 

src/Components/Skill/Skill.jsx

@@ -10,6 +10,7 @@ import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 import tailwindcss from '@tailwindcss/vite'
 import { VitePWA } from 'vite-plugin-pwa'
+import path from 'path'
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -76,6 +77,12 @@ export default defineConfig({
     })
   ],
   base: process.env.VERCEL ? '/' : '/whoami/',
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+      '@/components': path.resolve(__dirname, './src/Components'),
+    }
+  },
   build: {
     outDir: 'dist',
     assetsDir: 'assets',