覆盖按钮的颜色在雏菊UI?

Question

Daisy UI有按钮:https://daisyui.com/components/button/

但是，我想覆盖特定按钮的颜色，而不必通过创建整个主题的努力。

我可以在按钮上使用bg-green-500，但这将只是改变背景色，当我还需要改变所有相关的颜色时。

是否有好的方法来做到这一点?

Answer 1

当然，要做到这一点，你需要在tailwind.config.js文件中覆盖当前主题。

注意，您导入了主题的基:

/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./app/**/*.{ts,tsx,jsx,js}"],
daisyui: {
themes: [
{
light: {
...require("daisyui/src/colors/themes")["[data-theme=light]"],
primary: "#7cb3dd",

},
},
],
},
plugins: [require("@tailwindcss/typography"), require("daisyui")],
};

这里，我们将' light'主题的原色重写为#7cb3dd。

根据需要调整!

这里有更多的信息:https://daisyui.com/docs/themes/