关于CSS的NextUI问题

unftdfkk  于 12个月前  发布在  其他
关注(0)|答案(1)|浏览(122)

我刚开始在我现有的项目上安装NextUI,它使用样式化组件来样式化所有组件。在按照指南安装NextUI后,我能够显示Tabs和Table。我遇到了一些css问题:
1.颜色原色没有反映在选项卡的颜色上,它仍然显示蓝色,因为我已经配置了一些绿色颜色。

<Tabs
            aria-label="Menu"
            size="lg"
            color="primary"
            selectedKey={selectedTab}
            onSelectionChange={setSelectedTab}
          >
            <Tab key="orders" title="Recent Orders">

字符串
我的tailwind.config.js:

const { nextui } = require("@nextui-org/react");

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}",
    "./node_modules/@nextui-org/theme/dist/components/(tabs|table).js",
  ],
  theme: {
    extend: {},
  },
  darkMode: "class",
  plugins: [
    nextui({
      themes: {
        light: {
          colors: {
            background: "#FFFFFF", // or DEFAULT
            foreground: "#11181C", // or 50 to 900 DEFAULT
            primary: {
              //... 50 to 900
              foreground: "#FFFFFF",
              DEFAULT: "#05CE78", // Some green color, definitely not blue
            },
          },
        },
      },
    }),
  ],
};


奇怪的是,我可以将前景色更改为我指定的任何颜色,但不是默认颜色。更改默认颜色没有效果,它继续显示蓝色标签。
1.用户组件avatarProps不知何故有0不透明度没有我改变任何东西:我可以看到图像正确,一旦我删除不透明度从<img class="..">


的数据
我完全不知道是谁为tailwindcss添加了类值。
请帮助..我只是直接从代码示例硬编码的东西。我在这里错过了什么?
我试着重新安装tailwind,在tailwind指南中做所有步骤,我只使用简单的元素,我也试过按钮,同样的事情,我指定的原色没有显示(只显示蓝色原色)

vq8itlhq

vq8itlhq1#

问题:

关于CSS的NextUI问题

可能原因:

顺风配置不正确

解决方案:

更新tailwind.config.js中的content密钥为:

content: [
    './app/**/*.{js,ts,jsx,tsx,mdx}', // Note the addition of the `app` directory.
    './pages/**/*.{js,ts,jsx,tsx,mdx}',
    './components/**/*.{js,ts,jsx,tsx,mdx}',
    "./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}"

 
    // Or if using `src` directory:
    './src/**/*.{js,ts,jsx,tsx,mdx}',
  ],

字符串

相关问题