0

  1. 我想在 daisyui 中自定义一个主题。是否可以自定义，即深色主题（只需修复一种颜色，或添加更多颜色条目）？

  2. 此外：是否可以为您的自定义主题添加新的颜色条目？

即我尝试了以下但没有成功：

  daisyui: {
    styled: true,
    themes: [
      "light", // first one will be the default theme
      "dark",
      {
        mytheme: {
          primary: "#793ef9",
          "new-color": "#eff1ae",
          "primary-focus": "#570df8",
        },
      },
      "cupcake",
    ],
  },

new-color...但是当我在我的 css ( theme("colors.new-color"))中使用新颜色时。我收到以下错误：

(146:7) /home/armwur/code/booking-overview/src/index.css 'colors.new-color' does not exist in your theme config. 'colors' has the following valid keys: 'inherit', 'current', 'transparent', 'black', 'white', 'neutral', 'primary', 'primary-focus', 'primary-content', 'secondary', 'secondary-focus', 'secondary-content', 'accent', 'accent-focus', 'accent-content', 'neutral-focus', 'neutral-content', 'base-100', 'base-200', 'base-300', 'base-content', 'info', 'success', 'warning', 'error'

  144 |  }
  145 |   .fast-table tr:hover td {
> 146 |       background-color: theme('colors.new-color');
      |       ^
  147 |  }
  148 |   .fast-table th, .fast-table td {

我需要添加一个自定义颜色条目。这怎么可能？

4

1 回答 1

1

在 DaisyUI 中更改默认主题的颜色

  1. 在以下位置找到主题颜色：https ://github.com/saadeghi/daisyui/blob/master/src/colors/themes.js
  2. 将整个主题添加到tailwind.config.cjs，随意更改。
daisyui: {
        themes: [
          {'dark': {
            "primary": "#793ef9",
            "primary-focus": "#570df8",
            "primary-content": "#ffffff",
            "secondary": "#f000b8",
            "secondary-focus": "#bd0091",
            "secondary-content": "#ffffff",
            "accent": "#37cdbe",
            "accent-focus": "#2aa79b",
            "accent-content": "#ffffff",
            "neutral": "#2a2e37",
            "neutral-focus": "#16181d",
            "neutral-content": "#ffffff",
            "base-100": "#3d4451",
            "base-200": "#2a2e37",
            "base-300": "#16181d",
            "base-content": "#ebecf0",
            "info": "#66c6ff",
            "success": "#87d039",
            "warning": "#e2d562",
            "error": "#ff6f6f"
          }},
          'light',
        ]
    }

不过，我不知道您将如何为主题添加新颜色...

于 2022-01-16T10:39:43.290 回答