Closed peterpalkovic closed 4 months ago
Hey @peterpalkovic, unfortunately I think you'd need two sets of breakpoints at the moment, one in rem
s and the other in px
, i.e.:
// tailwind.config.ts
screens: {
sm: '30rem',
'sm-px': '480px',
md: '40rem',
'md-px': '640px',
// ...
},
fluid: {
// You'd also have to specify the default screens yourself, because the plugin
// could no longer sort your breakpoints as they have different units (same with Tailwind itself, see below)
defaultScreens: ['30rem', '60rem']
}
Then you could apply the px ones to spacing-related utilities i.e. ~sm-px/~lg-px:~px-4/8
. Admittedly that's kind of ugly and repetitive, though. It could also interfere with Tailwind's arbitrary screen variants (i.e. min-[320px]
), because I think those require all breakpoints to have the same unit. Curious to hear your thoughts.
Hey @barvian,
What is the best approach to configure your plugin to use both 'rem' and 'px' units?
Use case: rems for typography and px for spacing.
Thanks.