Modernizing TailwindCSS: Adding Three Missing CSS Features

[@baxtables]

Hi boss, I admire your work and your calmness ..is there a video of you explaining how tailwind css works internally? If not, I kindly request you to make one, whenever possible. Thank you

[@frontendfyi]

Thanks for your kind words! There’s no video by me explaining that topic unfortunately. I’ll think about it whether I can make such a video 🙏

[@gro967]

Where can I find the finished code for this? It's kind of hard to follow with all the changes, I just want to look at the classes real quick and see if there are some tricks to learn.

[@reeteshvirous1359]

all of a sudden 🥳 we started to learning css as we should.

[@LawJolla]

I'm a Tailwind wonk since before the RefactoringUI days. This is the first tutorial that made me think "ok, stop, we have actually found too much tailwind"

[@frontendfyi]

I’m not sure if I completely get what you mean. You’re saying this pseudo language that tailwind is might be going slightly too far now?

[@LawJolla]

I know the point was to show the plugin API. Loved it! But it's the first time I thought styling was unreadable in Tailwind as opposed to CSS. I think it's the amount of stateful styling. But I'll probably sign up for your pro this week. Thanks for your hard work!

[@frontendfyi]

@LawJolla thanks so much, appreciate it! And yeah sometimes tailwind definitely becomes unreadable because of the amount of classes you need. Although I also dislike to then switch back to vanilla css because all of sudden my styles are then split over 2 locations. Again thanks for your kind words!

[@LawJolla]

@@frontendfyi I completely get that concern and have faced it countless times too. Maybe my comment is better said “this is the first time I thought I would have split styles in this case”

[@mihao-runs]

well explained. ty👏

[@frontendfyi]

Glad you enjoyed it! Thanks for commenting!

[@vasyaqwe2087]

this is really cool. thank you!

[@Caldaron]

thanks for the lesson, not sure if I actually replace my js solution for it, but it's great to know. channel subscribed ;-)

[@frontendfyi]

I get what you’re saying! Still this approach is somehow growing on me. Once the classes are in tailwind and you know how this works, it’s super easy to setup. So let’s see what I think in a few months from now. Thanks for subscribing, appreciate it!

[@adilsarfraz02]

🙌

[@frontendfyi]

🙌

[@webdeveloper4742]

i'll pay anyone if they can install tailwind on my macbook. i can't for the life of me install it or can you do an install vid?

[@frontendfyi]

Happy to help you in a mentorship intro call. We can solve that in that session! www.frontend.fyi/mentorships

[@alexpanteli3651]

Looks like an overkill. Is it not easier to just create a custom CSS for such a use case?

[@frontendfyi]

It’s a delicate balance indeed. In last weeks video I made the same thing with vanilla css. You can definitely use this approach in tailwind too. But even though it’s quite few classnames, we’re also adding quite some logic now, which used to require adding JS too. So thinking of that it might not be too bad right?