arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-14 12:14:41 +01:00
Code Issues Packages Projects Releases Wiki Activity

chore(deps): update tailwindcss to ^4.0.8 (v3) (#3373)

Browse Source 
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
renovate[bot]
2025-02-25 12:59:52 +01:00
committed by GitHub
parent f401b68fa7
commit 85b45f6275
12 changed files with 126 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/app/assets/css/main.css
View File

@@ -1,9 +1,9 @@
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
@source "../../../content";
@theme {
@theme static {
--container-8xl: 90rem;
--font-sans: 'Public Sans', sans-serif;

6
docs/content/1.getting-started/2.installation/1.nuxt.md
View File

@@ -57,10 +57,14 @@ export default defineNuxtConfig({
#### Import Tailwind CSS and Nuxt UI in your CSS
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
```
::warning
The `theme(static)` is required since [`tailwindcss@4.0.8`](https://github.com/tailwindlabs/tailwindcss/releases/tag/v4.0.8) introduced a breaking change to only expose used CSS variables.
::
::tip
Use the `css` property in your `nuxt.config.ts` to import your CSS file.

6
docs/content/1.getting-started/2.installation/2.vue.md
View File

@@ -102,10 +102,14 @@ app.mount('#app')
#### Import Tailwind CSS and Nuxt UI in your CSS
```css [assets/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
```
::warning
The `theme(static)` is required since [`tailwindcss@4.0.8`](https://github.com/tailwindlabs/tailwindcss/releases/tag/v4.0.8) introduced a breaking change to only expose used CSS variables.
::
::tip
Import the CSS file in your `main.ts`.

32
docs/content/1.getting-started/3.theme.md
View File

@@ -17,10 +17,10 @@ Tailwind CSS v4 takes a CSS-first configuration approach, you now customize your
:::div
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
@theme {
@theme static {
--font-sans: 'Public Sans', sans-serif;
--breakpoint-3xl: 1920px;
@@ -45,10 +45,10 @@ Tailwind CSS v4 takes a CSS-first configuration approach, you now customize your
:::div
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
@theme {
@theme static {
--font-sans: 'Public Sans', sans-serif;
--breakpoint-3xl: 1920px;
@@ -87,7 +87,7 @@ This can be useful when writing Tailwind CSS classes in markdown files with [`@n
:::div
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
@source "../../content";
@@ -101,7 +101,7 @@ This can be useful when writing Tailwind CSS classes in markdown files with [`@n
:::div
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
@source "../../content";
@@ -303,7 +303,7 @@ You can change which shade is used for each color on light and dark mode:
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
:root {
@@ -321,7 +321,7 @@ You can change which shade is used for each color on light and dark mode:
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
:root {
@@ -357,7 +357,7 @@ You cannot set `primary: 'black'`{lang="ts-type"} in your [`vite.config.ts`](#co
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
:root {
@@ -375,7 +375,7 @@ You cannot set `primary: 'black'`{lang="ts-type"} in your [`vite.config.ts`](#co
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
:root {
@@ -487,7 +487,7 @@ You can customize these CSS variables to tailor the appearance of your applicati
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
:root {
@@ -507,7 +507,7 @@ You can customize these CSS variables to tailor the appearance of your applicati
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
:root {
@@ -548,7 +548,7 @@ You can customize the default radius value using the default Tailwind CSS variab
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
:root {
@@ -562,7 +562,7 @@ You can customize the default radius value using the default Tailwind CSS variab
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
:root {
@@ -593,7 +593,7 @@ You can customize the default container width using the default Tailwind CSS var
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
@theme {
@@ -611,7 +611,7 @@ You can customize the default container width using the default Tailwind CSS var
:::div{class="*:!mb-0 *:!mt-2.5"}
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
@theme {

4
docs/content/1.getting-started/5.fonts.md
View File

@@ -19,7 +19,7 @@ Nuxt UI automatically registers the [`@nuxt/fonts`](https://github.com/nuxt/font
:::div
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui";
@theme {
@@ -33,7 +33,7 @@ Nuxt UI automatically registers the [`@nuxt/fonts`](https://github.com/nuxt/font
:::div
```css [assets/css/main.css]
@import "tailwindcss";
@import "tailwindcss" theme(static);
@import "@nuxt/ui-pro";
@theme {

2
docs/package.json
View File

@@ -10,7 +10,7 @@
"@nuxt/content": "^3.2.2",
"@nuxt/image": "^1.9.0",
"@nuxt/ui": "latest",
"@nuxt/ui-pro": "https://pkg.pr.new/@nuxt/ui-pro@c6577ad",
"@nuxt/ui-pro": "https://pkg.pr.new/@nuxt/ui-pro@d651861",
"@nuxthub/core": "^0.8.17",
"@nuxtjs/plausible": "^1.2.0",
"@octokit/rest": "^21.1.1",