feat(tailwind): migrate to v4

[bjohansebas]

Description

Upgrade to tailwind-css major 4. And simplified use of postcss.

Check List

• [] I have read the Contributing Guidelines and made commit messages that follow the guideline.
• [] I have run npm run format to ensure the code follows the style guide.
• [] I have run npm run test to check if all tests are passing.
• [] I have run npx turbo build to check if the website builds without errors.
• [] I've covered new added functionality with unit tests if necessary.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
nodejs-org	✅ Ready (Inspect)	Visit Preview	Apr 3, 2025 7:10am

[AugustinMauroy]

something that may help you:

npx @tailwindcss/upgrade

and for css module: https://tailwindcss.com/docs/compatibility#css-modules

[bjohansebas]

Yep, with that I made the first commit, I thought it was going to do most of the work

[github-actions]

Note

Your Pull Request seems to be updating Translations of the Node.js Website.

Whilst we appreciate your intent; Any Translation update should be done through our Crowdin Project.
We recommend giving a read on our Translation Guidelines.

Thank you!

[ovflowd]

Hey @bjohansebas I assume this is still a WIP?

[github-actions]

Unit Test Coverage Report

Title	Lines	Statements	Branches	Functions
@node-core/ui-components		95.83% (161/168)	77.86% (102/131)	88.57% (31/35)
@nodejs/website		84.73% (494/583)	76.03% (165/217)	86.99% (107/123)

Title	Tests	Skipped	Failures	Errors	Time
@node-core/ui-components	24	0 💤	0 ❌	0 🔥	4.546s ⏱️
@nodejs/website	156	0 💤	0 ❌	0 🔥	6.21s ⏱️

[bjohansebas]

Yep, I'll continue with this later.

[ovflowd]

Yep, I'll continue with this later.

tysm for your contributions <3

[bjohansebas]

I think I'll continue after you all have done the migration to the new version of Next.js.

[AugustinMauroy]

@bjohansebas bump claudio had merge the pr. You can have fun with git conflict 😁

[bjohansebas]

I think it's ready for review

[AugustinMauroy]

Shadow on toast didn't correctly applied

[avivkeller]

Shadow on toast didn't correctly applied

But other than that, everything looks good :-)

[bjohansebas]

I feel like it's something related to Storybook because on the page I can see the shadow of the toast. Either way, I can check it again by Friday/Saturday.

[AugustinMauroy]

I feel like it's something related to Storybook because on the page I can see the shadow of the toast. Either way, I can check it again by Friday/Saturday.

fixed !

[ovflowd]

LGTM! Let's do this ✨

[bjohansebas]

thanks for the help