Replies: 1 comment 1 reply
-
Hey Ellie <div css={{...tw`fixed right-8 gap-3`, ...(show ? tw`md:flex` : tw`md:hidden`)}}> Spreading conditional classes into an object requires a few extra characters than the array method below. <div css={[tw`fixed right-8 gap-3`, show ? tw`md:flex` : tw`md:hidden`]}> Using an array is clean and requires slightly less code and you won't see the objects merge in your dev tools, you'll see the base classes overwritten instead. But last time I tested, the array styling method had issues in Stitches. I added the usage section in the stitches example readme as it differed from the prop and styled component guides I'd previously added (which work with all the other supported libraries). |
Beta Was this translation helpful? Give feedback.
1 reply
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
First, honest thanks for this great idea & tool, just getting into it, although i'm more of a newbie to nextjs too :)).
The question is:
Trying to rewrite an existing tailwind/nextjs template using tw tooling (tw/stitches) and came across the part to replace conditional styling. Based on examples found there i see two options:
So, which one of the above lines would be the right one to use, or any other correct way to add conditional class(es) to the existing ones ? And if both are applicable, then what is the difference ?
Pardon my a bit dummy question if it is, thanks a lot :)
Beta Was this translation helpful? Give feedback.
All reactions