[WIP]: tailwind v4

[bjohansebas]

Description

Updated to Tailwind 4 :), still a work in progress

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	Mar 9, 2025 1:44am

[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

Lines	Statements	Branches	Functions
	88.75% (742/836)	76.1% (242/318)	87.65% (142/162)

Unit Test Report

Tests	Skipped	Failures	Errors	Time
182	0 💤	0 ❌	0 🔥	5.406s ⏱️

[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]

Sorry, I had to squash all the commits. It was getting complicated to do a rebase without losing all the work.

[bjohansebas]

tailwindlabs/tailwindcss#16725

[ovflowd]

tailwindlabs/tailwindcss#16725

So just update to Tailwind 4.0.12?

[ovflowd]

A lot of people use CSS modules. Could tou reference where the maintainer said they did not care about it?

About maintainer position it's personal feeling. but about css module https://tailwindcss.com/docs/compatibility#performance

Per the docs, we shouldn't import everything, just the theme tokens. Which seems to mean, only the tokens need to be imported.

[bjohansebas]

Finally compiled, I'm really happy!

[github-actions]

Lighthouse Results

URL	Performance	Accessibility	Best Practices	SEO	Report
/en	🟢 99	🟢 100	🟢 100	🟢 91	🔗
/en/about	🟢 100	🟢 96	🟢 100	🟢 91	🔗
/en/about/previous-releases	🟢 100	🟢 96	🟢 100	🟢 92	🔗
/en/download	🟢 97	🟢 96	🟢 100	🟢 91	🔗
/en/blog	🟢 100	🟢 100	🟢 96	🟢 92	🔗

[bjohansebas]

Things that still don't work:

• the menu doesn't show:
  
• The OG images still don't display the correct background:
  
• Some colors are not applied correctly in dark mode:
  
• The gradients are not being generated correctly, maybe a Tailwind bug?: