fluid-tailwind icon indicating copy to clipboard operation
fluid-tailwind copied to clipboard

[TW Merge] Leading gets removed by arbitrary font size

Open stijns96 opened this issue 1 year ago • 3 comments

Hi there,

first of all, this plugin is great! I do have a small issue tho...

It looks like tw merge is removing my leading class, while I don't have a leading applied with fluid. I also don't use the fontSize from fluid, as I don't want the default line-height to be set. I always wondered why tailwind adds this out of the box, since this is in most project far from ideal... But that is another topic :)

cva("font-bold leading-tight", {
    variants: {
      level: {
        1: "~text-[3.815rem]/[5.61rem]",
        2: "~text-[3.052rem]/[4.209rem]",
        3: "~text-[2.441rem]/[3.157rem]",
        4: "~text-[1.953rem]/[2.369rem]",
        5: "~text-[1.563rem]/[1.777rem]",
        6: "~text-[1.25rem]/[1.333rem]",
      },
    },
  }),

image

As you can see in the image above, there is no leading class in my element.

stijns96 avatar Dec 12 '24 12:12 stijns96

Update Thanks to #18 I found a workaround by adding ! in front of my leading class. Of course not what I really want as adding !important is really bad IMO.

Still like to see this working out of the box :)

stijns96 avatar Dec 12 '24 12:12 stijns96

Nice catch! I'll look into supporting this.

barvian avatar Dec 12 '24 19:12 barvian

Hi @barvian, i want to ask how is it looking with this fix? I also encountered this. Thanks! O.

ondrejvelisek avatar May 07 '25 17:05 ondrejvelisek