Issue
I have a project with tailwind and a (work in progress) UI library that we want to gradually migrate to.
I am importing the style on my index.css
like this
@tailwind base;
@tailwind components;
@tailwind utilities;
@import '@customPackage/ui-react/dist/style.css';
the problem is, tailwind base import some style that conflict with my customPackage styles :
.ak2yjgf
is a style generated by the customPackage css, while button, [type='button'], [type='reset'], [type='submit']
is by tailwind.
I know it's possible to add custom styling useing @layers base
for tailwind, but this do not override the base style, it just add more. I would like to know if there is a way to override or remove the base
import for buttons
only.
Solution
Disabling Tailwind preflight is the closest thing that can help
module.exports = {
corePlugins: {
preflight: false,
}
}
Then add their preflight stylesheet and edit the section that's clashing with your styles.
Answered By - Chris Claude
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.