lobe-ui icon indicating copy to clipboard operation
lobe-ui copied to clipboard

[Bug] lobeui 自定义主题色无效

Open resetsix opened this issue 8 months ago • 1 comments

💻 系统环境 | Operating System

macOS

🌐 浏览器 | Browser

Chrome

🐛 问题描述 | Bug Description

通过 ThemeProvidercolorPrimary 自定义主题色之后 Primary Button 仍是黑色。

import { Button, ThemeProvider } from '@lobehub/ui';

export default () => {
  return (
    <ThemeProvider theme={{ token: { colorPrimary: '#1677ff' } }}>
        <Button type="primary">Primary Button</Button>
        <Button>Default Button</Button>
        <Button type="dashed">Dashed Button</Button>
        <Button type="text">Text Button</Button>
        <Button type="link">Link Button</Button>
      </ThemeProvider>
  );
};
Image

🚦 期望结果 | Expected Behavior

期望能通过colorPrimary自定义主题色,而不是默认的黑色。

Image

📷 复现步骤 | Recurrence Steps

import { Button, ThemeProvider } from '@lobehub/ui';

export default () => {
  return (
    <ThemeProvider theme={{ token: { colorPrimary: '#1677ff' } }}>
        <Button type="primary">Primary Button</Button>
        <Button>Default Button</Button>
        <Button type="dashed">Dashed Button</Button>
        <Button type="text">Text Button</Button>
        <Button type="link">Link Button</Button>
      </ThemeProvider>
  );
};

📝 补充信息 | Additional Information

<ThemeProvider customTheme={{ primaryColor: 'blue' }}> 可以正常自定义主题色(缺点是只能自定义为内置颜色)

Image Image

resetsix avatar Apr 29 '25 06:04 resetsix

👀 @resetsix Thank you for raising an issue. We will investigate into the matter and get back to you as soon as possible. Please make sure you have given us as much context as possible.
非常感谢您提交 issue。我们会尽快调查此事,并尽快回复您。 请确保您已经提供了尽可能多的背景信息。

lobehubbot avatar Apr 29 '25 06:04 lobehubbot

<ThemeProvider customTheme={{ primaryColor: 'blue' }}> 可以正常自定义主题色(缺点是只能自定义为内置颜色)

看了一下 lobe-ui 的代码,貌似设计就是如此的, 在 这里 可以看到所有的颜色都是调好了的

Wxh16144 avatar May 06 '25 14:05 Wxh16144

貌似设计就是如此的

虽然 lobeui 继承自 antd 的 token 机制,但是 theme={{ token: { colorPrimary: '#1677ff' } }} 的修改方式不生效,并且仅能通过customTheme={{ primaryColor: 'blue' }}修改为 lobe 场景下的预设主题,灵活性就大大降低了。

resetsix avatar May 07 '25 03:05 resetsix

✅ @resetsix
This issue is closed, If you have any questions, you can comment and reply.
此问题已经关闭。如果您有任何问题,可以留言并回复。

lobehubbot avatar Jun 09 '25 04:06 lobehubbot