diff --git a/index.html b/index.html index 9c7fd9e..33a4c03 100644 --- a/index.html +++ b/index.html @@ -39,9 +39,9 @@ - - - + + + diff --git a/package.json b/package.json index 6800bbf..df0b250 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,8 @@ "preview": "vite preview" }, "dependencies": { - "vue": "^3.5.0" + "vue": "^3.5.0", + "vue-router": "^4.4.0" }, "devDependencies": { "@tailwindcss/vite": "^4.0.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c8e0efe..6830768 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,6 +11,9 @@ importers: vue: specifier: ^3.5.0 version: 3.5.35 + vue-router: + specifier: ^4.4.0 + version: 4.6.4(vue@3.5.35) devDependencies: '@tailwindcss/vite': specifier: ^4.0.0 @@ -470,6 +473,9 @@ packages: '@vue/compiler-ssr@3.5.35': resolution: {integrity: sha512-rGhAeXgdM7/ffTJGXT69rCCdTmjDewnFuUZfBQQHTdcEBeWdT5HCGY60y2ytLJr9/Dsu7IntUi5z/w0h6Rjnzw==} + '@vue/devtools-api@6.6.4': + resolution: {integrity: sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==} + '@vue/reactivity@3.5.35': resolution: {integrity: sha512-tVc+SsHConvh/Lz64qq1pP3rYArBmK42xonovEcxY74SQtvctZodG/zhq54P5dr38cVuw25d27cPNRdlMidpGQ==} @@ -684,6 +690,11 @@ packages: yaml: optional: true + vue-router@4.6.4: + resolution: {integrity: sha512-Hz9q5sa33Yhduglwz6g9skT8OBPii+4bFn88w6J+J4MfEo4KRRpmiNG/hHHkdbRFlLBOqxN8y8gf2Fb0MTUgVg==} + peerDependencies: + vue: ^3.5.0 + vue@3.5.35: resolution: {integrity: sha512-cx89fnr+0kVGHiNFG6y6s0bdjypJRFNZn6x3WPstNdQR1bi1mbB7h4v5IBGTsPJU3nK1+0Iqj3Zf+hZWMieR4Q==} peerDependencies: @@ -984,6 +995,8 @@ snapshots: '@vue/compiler-dom': 3.5.35 '@vue/shared': 3.5.35 + '@vue/devtools-api@6.6.4': {} + '@vue/reactivity@3.5.35': dependencies: '@vue/shared': 3.5.35 @@ -1181,6 +1194,11 @@ snapshots: jiti: 2.7.0 lightningcss: 1.32.0 + vue-router@4.6.4(vue@3.5.35): + dependencies: + '@vue/devtools-api': 6.6.4 + vue: 3.5.35 + vue@3.5.35: dependencies: '@vue/compiler-dom': 3.5.35 diff --git a/src/App.vue b/src/App.vue index c476584..7c2aa3f 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,55 +1,3 @@ - - diff --git a/src/layouts/DashboardLayout.vue b/src/layouts/DashboardLayout.vue new file mode 100644 index 0000000..7fead48 --- /dev/null +++ b/src/layouts/DashboardLayout.vue @@ -0,0 +1,130 @@ + + + diff --git a/src/main.js b/src/main.js index 2425c0f..4806c14 100644 --- a/src/main.js +++ b/src/main.js @@ -1,5 +1,6 @@ import { createApp } from 'vue' import './style.css' import App from './App.vue' +import router from './router/index.js' -createApp(App).mount('#app') +createApp(App).use(router).mount('#app') diff --git a/src/router/index.js b/src/router/index.js new file mode 100644 index 0000000..013129f --- /dev/null +++ b/src/router/index.js @@ -0,0 +1,14 @@ +import { createRouter, createWebHistory } from 'vue-router' +import HomeView from '../views/HomeView.vue' + +export default createRouter({ + history: createWebHistory(), + routes: [ + { path: '/', component: HomeView, meta: { title: 'Dashboard' } }, + { path: '/tables', component: () => import('../views/TableListView.vue'), meta: { title: 'Table List' } }, + { path: '/typography', component: () => import('../views/TypographyView.vue'), meta: { title: 'Typography' } }, + { path: '/icons', component: () => import('../views/IconsView.vue'), meta: { title: 'Icons' } }, + { path: '/maps', component: () => import('../views/MapsView.vue'), meta: { title: 'Maps' } }, + { path: '/notifications',component: () => import('../views/NotificationsView.vue'), meta: { title: 'Notifications' } }, + ], +}) diff --git a/src/style.css b/src/style.css index 5f61f2e..3ef6cec 100644 --- a/src/style.css +++ b/src/style.css @@ -42,6 +42,15 @@ @import "tailwindcss"; +/* ============================================================ + SAFELIST + Utilities built from dynamic class strings (template literals) + are invisible to content scanning. @source inline() forces + Tailwind to generate them regardless. + ============================================================ */ + +@source inline("bg-gradient-primary bg-gradient-secondary bg-gradient-success bg-gradient-warning bg-gradient-danger bg-gradient-info bg-gradient-dark bg-gradient-light shadow-primary shadow-secondary shadow-success shadow-warning shadow-danger shadow-info shadow-dark"); + /* ============================================================ DESIGN TOKENS All values exposed as CSS custom properties AND Tailwind diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue new file mode 100644 index 0000000..27100cd --- /dev/null +++ b/src/views/HomeView.vue @@ -0,0 +1,111 @@ + + + diff --git a/src/views/IconsView.vue b/src/views/IconsView.vue new file mode 100644 index 0000000..d4b2649 --- /dev/null +++ b/src/views/IconsView.vue @@ -0,0 +1,65 @@ + + + diff --git a/src/views/MapsView.vue b/src/views/MapsView.vue new file mode 100644 index 0000000..14c1e26 --- /dev/null +++ b/src/views/MapsView.vue @@ -0,0 +1,87 @@ + + + diff --git a/src/views/NotificationsView.vue b/src/views/NotificationsView.vue new file mode 100644 index 0000000..22e879e --- /dev/null +++ b/src/views/NotificationsView.vue @@ -0,0 +1,110 @@ + + + + + diff --git a/src/views/TableListView.vue b/src/views/TableListView.vue new file mode 100644 index 0000000..a3a12e1 --- /dev/null +++ b/src/views/TableListView.vue @@ -0,0 +1,92 @@ + + + diff --git a/src/views/TypographyView.vue b/src/views/TypographyView.vue new file mode 100644 index 0000000..3857d02 --- /dev/null +++ b/src/views/TypographyView.vue @@ -0,0 +1,109 @@ + + +