add tokens package

app.vue

@@ -1,5 +1,5 @@
 <template>
 	<NuxtLayout>
-		<NuxtPage />
+		<NuxtPage/>
 	</NuxtLayout>
 </template>

components/HelloWorld/HelloWorld.vue

@@ -4,11 +4,11 @@ import { defineComponent } from "vue";
 export default defineComponent({
 	name: "HelloWorld",
 	props: {
-		parentMessage: String,
+		msg: String,
 	},
 });
 </script>
 
 <template>
-	<h1>{{ parentMessage }}</h1>
+	<h1>{{ msg }}</h1>
 </template>

nuxt.config.ts

@@ -1,7 +1,6 @@
 import vuetify from 'vite-plugin-vuetify'
 import Components from 'unplugin-vue-components/vite'
 
-
 export default defineNuxtConfig({
 	ssr: false,
 	modules: [
@@ -11,7 +10,7 @@ export default defineNuxtConfig({
 	plugins: [
 		'~/plugins/vuex.ts',
 		'~/plugins/axios.ts',
-		{ src: '~/plugins/vuex-persist', mode: 'client' },
+		{src: '~/plugins/vuex-persist', mode: 'client'},
 	],
 	build: {
 		transpile: ['vuetify']
@@ -20,7 +19,7 @@ export default defineNuxtConfig({
 		plugins: [
 			vuetify(),
 			// change the component dirs to match our project layout
-			Components({ dts: true, dirs: ['~/components', 'src/components'] })
+			Components({dts: true, dirs: ['~/components', 'src/components']})
 		]
 	},
 	css: [

package.json

@@ -16,6 +16,9 @@
 		"test:e2e": "cypress run",
 		"cypress:open": "cypress open"
 	},
+	"dependencies": {
+		"@cnamts/design-tokens": "2.12.0"
+	},
 	"devDependencies": {
 		"@babel/preset-env": "7.22.15",
 		"@mdi/js": "7.2.96",

pages/index.vue

@@ -1,5 +1,6 @@
 <template>
 	<div>
-	  <HelloWorldBis parentMessage="Test depuis src" />
+		<HelloWorld msg="Un titre"/>
+		<HelloWorldBis parentMessage="Test depuis src"/>
 	</div>
 </template>

plugins/vuetify.ts

@@ -1,6 +1,7 @@
 import 'vuetify/styles'
-import { createVuetify } from 'vuetify'
-import { aliases, mdi } from 'vuetify/iconsets/mdi-svg'
+import {createVuetify} from 'vuetify'
+import {aliases, mdi} from 'vuetify/iconsets/mdi-svg'
+import {colorTheme} from '@cnamts/design-tokens/src/colors'
 
 export default defineNuxtPlugin(nuxtApp => {
 	const vuetify = createVuetify({
@@ -11,7 +12,15 @@ export default defineNuxtPlugin(nuxtApp => {
 			sets: {
 				mdi
 			}
-		}
+		},
+		theme: {
+			defaultTheme: 'light',
+			themes: {
+				light: {
+					colors: colorTheme,
+				},
+			},
+		},
 	})
 
 	nuxtApp.vueApp.use(vuetify)