From e3ce1f7a4158ae1b98d9706291cc8013bd8cbaf9 Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Wed, 5 Mar 2025 14:31:27 +0100
Subject: [PATCH] docs(theme): fix duplicate blocks

---
 docs/content/1.getting-started/3.theme.md | 48 ++++++++++++++++-------
 1 file changed, 33 insertions(+), 15 deletions(-)

diff --git a/docs/content/1.getting-started/3.theme.md b/docs/content/1.getting-started/3.theme.md
index fcee4498..41a70ee4 100644
--- a/docs/content/1.getting-started/3.theme.md
+++ b/docs/content/1.getting-started/3.theme.md
@@ -142,7 +142,7 @@ Nuxt UI leverages Vite config to provide customizable color aliases based on [Ta
 
 ::framework-only
 #nuxt
-::div
+:::div
 You can configure these color aliases at runtime in your `app.config.ts` file under the `ui.colors` key, allowing for dynamic theme customization without requiring an application rebuild:
 
 ```ts [app.config.ts]
@@ -156,14 +156,19 @@ export default defineAppConfig({
 })
 ```
 
-::
+:::
 
 #vue
-::module-only
-#ui
+
 :::div
 You can configure these color aliases at runtime in your `vite.config.ts` file under the `ui.colors` key:
 
+::::module-only
+
+#ui
+
+:::::div
+
 ```ts [vite.config.ts]
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
@@ -183,11 +188,12 @@ export default defineConfig({
   ]
 })
 ```
-:::
+:::::
 
 #ui-pro
-:::div
-You can configure these color aliases at runtime in your `vite.config.ts` file under the `uiPro.colors` key:
+
+:::::div
+
 ```ts [vite.config.ts]
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
@@ -207,9 +213,12 @@ export default defineConfig({
   ]
 })
 ```
-:::
 
-::
+:::::
+
+::::
+
+:::
 
 ::
 
@@ -256,11 +265,17 @@ export default defineNuxtConfig({
 :::
 
 #vue
-::module-only
-#ui
+
 :::tip
+
 You can add you own dynamic color aliases in your `vite.config.ts`, you just have to make sure to also define them in the [`theme.colors`](/getting-started/installation/vue#themecolors) option of the `ui` plugin.
 
+::::module-only
+
+#ui
+
+:::::div
+
 ```ts [vite.config.ts]
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
@@ -283,11 +298,11 @@ export default defineConfig({
 })
 ```
 
-:::
+:::::
 
 #ui-pro
-:::tip
-You can add you own dynamic color aliases in your `vite.config.ts`, you just have to make sure to also define them in the [`theme.colors`](/getting-started/installation/vue#themecolors) option of the `uiPro` plugin.
+
+:::::div
 
 ```ts [vite.config.ts]
 import { defineConfig } from 'vite'
@@ -311,9 +326,12 @@ export default defineConfig({
 })
 ```
 
+:::::
+
+::::
+
 :::
 
-::
 ::
 
 ### Tokens