feat(playground): add custom CSS layers and styles

AndreyYolkin · AndreyYolkin · commit 0d074c4723e3 · 2026-03-04T20:46:41.000+01:00
Add layers.css to define custom CSS layer order and app.css for custom styles.
Include both files in Nuxt config to apply them globally.
diff --git a/apps/playground/app/app.css b/apps/playground/app/app.css
@@ -0,0 +1,5 @@
+@layer custom-l {
+  .bg-primary {
+    background: red;
+  }
+}
diff --git a/apps/playground/app/layers.css b/apps/playground/app/layers.css
@@ -0,0 +1 @@
+@layer vuetify-core, custom-l, vuetify-components, vuetify-overrides,  vuetify-utilities, vuetify-final;
diff --git a/apps/playground/nuxt.config.ts b/apps/playground/nuxt.config.ts
@@ -28,6 +28,7 @@ export default defineNuxtConfig({
     // debug: true,
     vueI18n: './config/i18n.config.ts',
   },
+  css: ['~/layers.css', '~/app.css'],
   vuetify: {
     moduleOptions: {
       includeTransformAssetsUrls: {

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+@layer vuetify-core, custom-l, vuetify-components, vuetify-overrides, vuetify-utilities, vuetify-final;`