creativetimofficial / material-tailwind

@material-tailwind is an easy-to-use components library for Tailwind CSS and Material Design.
https://material-tailwind.com/
MIT License
3.43k stars 302 forks source link

Lost all the Pseudo-classes when putting on withMT in the tailwind.config.js #660

Closed YuAnWu0000 closed 2 months ago

YuAnWu0000 commented 2 months ago

As title, Here is my tailwind.config.js

const withMT = require("@material-tailwind/react/utils/withMT");
module.exports = withMT({
  content: ["./src/**/**/*.{html,js}"],
  theme: {
    fontFamily: {
      sans: ["Noto Sans TC", "Roboto", "Helvetica", "Arial", "sans-serif"],
    },
    extend: {
      colors: {
        primary: "#2A2B2F",
        secondary: "#ffffff",
        error: "#92400e",
        warning: "#f97316",
        info: "#75767B",
        success: "#4ade80",
      },
    },
  },
  plugins: [],
});

I've tried the A/B test. After I deleted the withMT, I was able to see the Pseudo-classes like hover in dev-tool and all the effects were backed in screen.

YuAnWu0000 commented 2 months ago

material-tailwind has its own theme in tailwind.config.js (not extend), therefore some color class in tailwind official are not available. It required custom setting in your tailwind config file.