docs: update Tailwind V4 solution (#38)

* Update Tailwind V4 solution * Update getting-started.md
typicode · Apr 4, 2024 · 598d0e4 · 598d0e4
1 parent 31ab917
commit 598d0e4
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/docs/getting-started.md b/docs/getting-started.md
@@ -82,20 +82,20 @@ Let's create a classic `Button` component accepting two props:
 @scope (.button) {
   button:scope {
     /* Default style */
-    font-size: theme(fontSize.base);
-    border-radius: theme(borderRadius.sm);
+    font-size: var(--font-size-base);
+    border-radius: var(--radius-sm);
 
     &[data-size='lg'] {
-      font-size: theme(fontSize.lg);
+      font-size: var(--font-size-lg);
     }
 
     &[data-size='sm'] {
-      font-size: theme(fontSize.sm);
+      font-size: var(--font-size-sm);
     }
 
     &[data-danger] {
-      background-color: theme(colors.red.700);
-      color: theme(colors.white);
+      background-color: var(--colors-red-700);
+      color: var(--colors-white);
     }
   }
 }