Arthie/xwind

Question: Composition with tailwindcssinjs/macro?

IRediTOTO opened this issue · 2 comments

IRediTOTO commented

Hi, I just found this package and trying.
I have a button like this css={styles.button} and worked perfect
But is there any to use like this? css={styles.button + tw bg-red-200}
Just want change other background for button. Create 2 props button with just small different look like silly :D
Thank you

Arthie commented

Hello!
Composition is totally possible and depends on the CSS-in-JS library.
This should work with emotion's css prop: css={[styles.button, tw`bg-red-200`]}
Learn more about composition patterns in emotion

  • ❤️1
IRediTOTO commented

sorry I just try this

 css={[styles.button, styles.bgGreen, tw`w-full`]}

And got this error:
Attempted import error: '@emotion/css' does not contain a default export (imported as '_css').

I must use this
css={css([styles.button, styles.bgGreen, tw`w-full`])}