When I set a class "grow-14" in the element classes, the tailwind css class is not generated

[spacether]

Description

When I set a class "grow-14" in the element classes, the tailwind css class is not generated

[evnchn]

https://github.com/zauberzeug/nicegui/blob/main/DEPENDENCIES.md

NiceGUI so far uses v3 of Tailwind CSS.

First result if you search "tailwind flex grow" yields https://tailwindcss.com/docs/flex-grow, which, as of writing, links to the v4 documentation.

The website is a bit counter-intuitive in a sense that when you select v3.4.17 in the top-left, it redirects you to the homepage of Tailwind CSS v3... 😡

But, you can manually go to https://v3.tailwindcss.com/docs/flex-grow

Getting back to how to do the equivalent of grow-14, at the end of the day, Tailwind CSS classes are just CSS styles under a trenchcoat. You can freely apply .style() to the elements.

grow- would be flex-grow: ;

So, grow-14 would be flex-grow: 14;

@falkoschindler any plans to go to Tailwind CSS v4? Perhaps milestone 3.0?

[falkoschindler]

@evnchn Yes, we're usually upgrading third-party dependencies during major releases. So Tailwind version 4 will probably come with NiceGUI 3.0. We don't have a release schedule yet, but given 2.0 came in August 2024, I guess some time this summer would make sense.

[evnchn]

Should we link to the C3 Tailwind CSS page and also put some description at https://nicegui.io/documentation/section_styling_appearance ?

Since Tailwind CSS changed the https://tailwindcss.com/ link to serve V4 content instead

[falkoschindler]

Good idea. I've updated the links in d87ee22.

[falkoschindler]

I'm closing this issue because this particular problem can be solved using "grow-[14]" instead of "grow-14".

Support for classes like "grow-14" depends on an upgrade to Tailwind 4 which is in discussion. We are, however, thinking about UnoCSS with a Wind4 preset as an alternative (PR #4832).