feat(exmples): tailwindcss example added

[jrgarciadev]

Closes #

📝 Description

Tailwindcss example added

⛳️ Current behavior (updates)

Please describe the current behavior that you are modifying

There wasn't a Tailwindcss example

🚀 New behavior

Please describe the behavior or changes this PR adds

Example added

💣 Is this a breaking change (Yes/No):

No

📝 Additional Information

Tailwind @base CSS included was removed because it causes conflicts along with NextUI

[quentin996007]

What I want to know is, if the base style is removed, then how will we be affected? Is there a more elegant way to resolve this conflict?

[jrgarciadev]

Hey @qinfensky this will affect only the tailwind preflight.css https://github.com/tailwindlabs/tailwindcss/blob/master/src/css/preflight.css , due to NextUI has a CSS baseline with its own CSS reset you shouldn't need the tailwindcss base styles, here the NextUI base styles -> https://github.com/nextui-org/nextui/blob/main/packages/react/src/css-baseline/css-baseline.tsx, as far as I research this is the more elegant way because otherwise you have to use the !important tag to override the tailwindcss base styles

[quentin996007]

Hey @qinfensky this will affect only the tailwind preflight.css https://github.com/tailwindlabs/tailwindcss/blob/master/src/css/preflight.css , due to NextUI has a CSS baseline with its own CSS reset you shouldn't need the tailwindcss base styles, here the NextUI base styles -> https://github.com/nextui-org/nextui/blob/main/packages/react/src/css-baseline/css-baseline.tsx, as far as I research this is the more elegant way because otherwise you have to use the !important tag to override the tailwindcss base styles

I understand, the explanation is very clear and easy to understand, thank you

[nghieptiki]

I think this is just a temporary solution
We needed a way to a custom where styles are inserted
https://mantine.dev/theming/emotion-cache/#change-styles-insertion-point
and
https://mui.com/material-ui/guides/interoperability/#emotion:~:text=Note%3A%20If%20you%20are%20using%20Emotion%20and%20have%20a%20custom%20cache%20in%20your%20app%2C%20it%20will%20override%20the%20one%20coming%20from%20MUI.%20In%20order%20for%20the%20injection%20order%20to%20still%20be%20correct%2C%20you%20need%20to%20add%20the%20prepend%20option.%20Here%20is%20an%20example%3A