From b2fa65734bb59186520c985f7c73fc34a0cb8b37 Mon Sep 17 00:00:00 2001
From: Thomas <tkmcc@users.noreply.github.com>
Date: Tue, 19 Nov 2024 04:07:01 -0500
Subject: [PATCH] fix(css): `--font-family-sans` renamed to `--font-sans`
 (#2680)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
---
 devtools/app/app.vue                      | 2 +-
 docs/app/app.vue                          | 2 +-
 docs/content/1.getting-started/3.theme.md | 2 +-
 docs/content/1.getting-started/5.fonts.md | 2 +-
 playground-vue/src/app.vue                | 2 +-
 playground/app/app.vue                    | 2 +-
 6 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/devtools/app/app.vue b/devtools/app/app.vue
index c154c02c..a484d220 100644
--- a/devtools/app/app.vue
+++ b/devtools/app/app.vue
@@ -168,7 +168,7 @@ const isDark = computed({
 @import '@nuxt/ui';
 
 @theme {
-  --font-family-sans: 'DM Sans', sans-serif;
+  --font-sans: 'DM Sans', sans-serif;
 
   --color-primary-50: var(--ui-color-primary-50);
   --color-primary-100: var(--ui-color-primary-100);
diff --git a/docs/app/app.vue b/docs/app/app.vue
index ad4c7f38..0885f88a 100644
--- a/docs/app/app.vue
+++ b/docs/app/app.vue
@@ -126,7 +126,7 @@ provide('navigation', updatedNavigation)
 @theme {
   --container-8xl: 90rem;
 
-  --font-family-sans: 'Public Sans', sans-serif;
+  --font-sans: 'Public Sans', sans-serif;
 
   --color-green-50: #EFFDF5;
   --color-green-100: #D9FBE8;
diff --git a/docs/content/1.getting-started/3.theme.md b/docs/content/1.getting-started/3.theme.md
index 93832a61..3afc9393 100644
--- a/docs/content/1.getting-started/3.theme.md
+++ b/docs/content/1.getting-started/3.theme.md
@@ -16,7 +16,7 @@ Tailwind CSS v4 takes a CSS-first configuration approach, you now customize your
 @import "@nuxt/ui";
 
 @theme {
-  --font-family-sans: 'Public Sans', sans-serif;
+  --font-sans: 'Public Sans', sans-serif;
 
   --breakpoint-3xl: 1920px;
 
diff --git a/docs/content/1.getting-started/5.fonts.md b/docs/content/1.getting-started/5.fonts.md
index 2933bad4..a8e6b910 100644
--- a/docs/content/1.getting-started/5.fonts.md
+++ b/docs/content/1.getting-started/5.fonts.md
@@ -17,7 +17,7 @@ Nuxt UI automatically registers the [`@nuxt/fonts`](https://github.com/nuxt/font
 @import "@nuxt/ui";
 
 @theme {
-  --font-family-sans: 'Public Sans', sans-serif;
+  --font-sans: 'Public Sans', sans-serif;
 }
 ```
 
diff --git a/playground-vue/src/app.vue b/playground-vue/src/app.vue
index 683cadc7..f05f3bea 100644
--- a/playground-vue/src/app.vue
+++ b/playground-vue/src/app.vue
@@ -116,7 +116,7 @@ defineShortcuts({
 @import "@nuxt/ui";
 
 @theme {
-  --font-family-sans: 'Public Sans', sans-serif;
+  --font-sans: 'Public Sans', sans-serif;
 
   --color-green-50: #EFFDF5;
   --color-green-100: #D9FBE8;
diff --git a/playground/app/app.vue b/playground/app/app.vue
index 2780f323..174f65f7 100644
--- a/playground/app/app.vue
+++ b/playground/app/app.vue
@@ -125,7 +125,7 @@ defineShortcuts({
 @import "@nuxt/ui";
 
 @theme {
-  --font-family-sans: 'Public Sans', sans-serif;
+  --font-sans: 'Public Sans', sans-serif;
 
   --color-green-50: #EFFDF5;
   --color-green-100: #D9FBE8;