Lewis
Explore posts from serversPD🧩 Plasmo Developers
•Created by Lewis on 11/30/2023 in #🔰newbie
TailwindCSS in a CSUI makes everything VERY small.
Found the issue! There's mixed resources about implementing tailwind in the shadow root.
The issue: The HTML element is being set to 10px when usually it's 10px. It's hard to overwrite this. This is what makes your styles really small as originally, it's basing it off of the 16px (e.g
text-sm
class is 0.875rem
which means it's going to about 8px).
To fix this, I had to download a PostCSS plugin called rem-px transformer: https://github.com/TheDutchCoder/postcss-rem-to-px
This will convert all of your rem values to pixels manually. You can also set a baseSize as well.
Might not be the solution for everyone, as this presents other issues. But this is what worked for me.5 replies