search

tailwindlabs / tailwindcss

A utility-first CSS framework for rapid UI development.
https://tailwindcss.com/
MIT License
81.78k stars 4.11k forks source link

Adds additional class-name on adding decimal classes #12957

Closed sbimochan closed 6 months ago

sbimochan commented 6 months ago

On using gap-2.5 it generates two class-names: gap-2 and gap-2\.5. I think we have rooms for improvements in the compiler.

What version of Tailwind CSS are you using?

v3.3.3

What build tool (or framework if it abstracts the build tool) are you using?

webpack 5.28.0

What version of Node.js are you using?

v20.5.1

What browser are you using?

Chrome

What operating system are you using?

macOS

Reproduction URL

N/A

Describe your issue

On using gap-2.5 it generates two class-names: gap-2 and gap-2\.5. I think we have rooms for improvements in the compiler.

reinink commented 6 months ago

Hey! So yeah, ideally Tailwind wouldn't generate both of these classes, but this is actually expected behavior because of the types of templating languages we support. You can read more about this in #9354 👍

sbimochan commented 6 months ago

Cool! It's not much of a big deal. The extra classname that it generates also has potential probability of being used too. I just wanted to point out it but looks like it was a well known a year ago. I don't think we need to used that extract function. It should be good!

reinink commented 6 months ago

Yeah I appreciate that! For what it's worth we're deep into building Tailwind CSS v4 right now and the new compiler does handle this situation correctly (at least right now 😅)

AnshSinghSonkhia commented 6 months ago

Hey @reinink, where can I know more about Tailwind CSS v4 ?? SUPER EXCITED

reinink commented 6 months ago

@AnshSinghSonkhia Hey! See here: https://www.youtube.com/watch?v=CLkxRnRQtDE