feat!: migrate to tailwindcss v4

[mikededo]

This PR includes the migration of TailwindCSS to v4. This version changes makes
TailwindCSS rely mostly on CSS files, over other configuration formats. Taking
advantage of this migrations, many things are changed in favour of a simpler
setup.
Ideally, I'd want to also simplify the output CSS, as previously it is was a
mess.

Changes/Roadmap

• Removal of postcss tw configuration, in favor of running tw with the new
  vite plugin.
• Removed the usage of prefixes. While initially I thought it was a good
  idea, I ended up having issues in the new version, as variables such as color
  variables are being duplicated with each prefix. I'd prefer re-using variables
  as it would simplify the code and the CSS size. This means that special care
  will be required when re-using classes as some already generated classes may be
  overlapped and due to the cascade approach, be ignored.
  This will, for sure, help in having a reduced CSS file output. Another approach
  that could be worth looking into, is serving CSS files separately. Having
  different links into the generated CSS files from the various packages and then
  the CSS of the app itself, taking precedence. This approach would difficult
  reducing the output CSS, and would require more investigation on how would tw
  generate the classes. Most likely using the @source directive would help.
• Removal of plugins in favor of plain CSS and tw generated layers. For
  example, the typography plugin now is simply a CSS file exported from
  @stack/tailwind-config.
• Remove the aria plugin in favour of tw-aria

[vercel]

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

Name	Status	Preview	Comments	Updated (UTC)
advent	❌ Failed (Inspect)			Feb 7, 2025 10:26am