[Bug]: Select and MultiSelect have different height properties about tremor HOT 9 CLOSED

Hi @mohamm-ad, thanks for letting us know, we will investigate asap! In the meantime, you can harmonize the heights via className customization: Try to insert [&>button]:h-9 for example.

from tremor.

Amazing @christopherkindl! And good call, that fix worked! Any suggested workarounds for styling the search in MultiSelect?

from tremor.

@mohamm-ad you are welcome! :) What do you want to style exactly?

from tremor.

When styling MultiSelect + MultiSelectItem, changes with Tailwind are reflected correctly across the component except for in the search area. For example, in the image above I applied text-xs to both, which works fine except for search (where text stays the default size). Apologies if I'm missing something!

from tremor.

Hey @mohamm-ad, I my tests, they seem all seem to have the same height. Can you post a screenshot of your example?

from tremor.

Ad text: Why don't use use the Theme in the tremor config? You could easily overwrite tremor-default to your liking

 fontSize: {
        "tremor-label": ["0.75rem"],
        "tremor-default": ["0.875rem", { lineHeight: "1.25rem" }],
        "tremor-title": ["1.125rem", { lineHeight: "1.75rem" }],
        "tremor-metric": ["1.875rem", { lineHeight: "2.25rem" }],
      },

from tremor.

Interesting! I'm not quite sure what's going on in mine, I haven't made any changes:

Yep, when you adjust the default text size, the search text adjusts accordingly as intended. But for this particular use case, I needed to adjust the placeholder and item size to be different from the default -- that worked fine with tailwind, but i wasn't able to change the search placeholder text.

from tremor.

Alright, the select on the left is too small. Its the Select or Multiselect? I am having a hard time replicating your issue. Could you share a minimal reproduction? @mohamm-ad

from tremor.

@mohamm-ad Can I close this issue from your side?

from tremor.