From c3f5c44461eef542fdde50348e6b11629948cda5 Mon Sep 17 00:00:00 2001 From: Benjamin Canac Date: Tue, 13 Jun 2023 15:51:05 +0200 Subject: [PATCH] docs: improve theming colors safelisting section --- docs/content/1.getting-started/3.theming.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/content/1.getting-started/3.theming.md b/docs/content/1.getting-started/3.theming.md index b899c914..5165fb9f 100644 --- a/docs/content/1.getting-started/3.theming.md +++ b/docs/content/1.getting-started/3.theming.md @@ -55,7 +55,7 @@ export default defineAppConfig({ }) ``` -This will apply the orange color when using a default ``. You'll need to safelist this color manually in your `nuxt.config.ts` ui options as we won't be able to detect it automatically. You can do so through the `safelistColors` option. +This will apply the orange color when using a default ``. You'll need to safelist this color manually in your `nuxt.config.ts` ui options as we won't be able to detect it automatically. You can do so through the `safelistColors` option which defaults to `['primary']`. ```ts [nuxt.config.ts] export default defineNuxtConfig({ @@ -65,6 +65,8 @@ export default defineNuxtConfig({ }) ``` +This can also happen when you bind a dynamic color to a component: ``, ``, etc. In this case, you'll need to safelist the possible color values manually as well. + ## Dark mode All the components are styled with dark mode in mind.