90 lines
1.8 KiB
TypeScript
90 lines
1.8 KiB
TypeScript
|
/**
|
||
|
|
* 主题配置 Provider
|
||
|
|
* 使用 Ant Design 5 的 ConfigProvider 覆盖主题 Token
|
||
|
|
*/
|
||
|
|
|
||
|
|
import { ConfigProvider, type ThemeConfig } from 'antd'
|
||
|
|
import zhCN from 'antd/locale/zh_CN'
|
||
|
|
import type { ReactNode } from 'react'
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Ant Design 主题配置
|
||
|
|
* 基于 Mineral Console 视觉方向
|
||
|
|
*/
|
||
|
|
const themeConfig: ThemeConfig = {
|
||
|
|
token: {
|
||
|
|
// 主色
|
||
|
|
colorPrimary: '#0e5a6a',
|
||
|
|
colorPrimaryHover: '#0a4b59',
|
||
|
|
colorPrimaryActive: '#083d4a',
|
||
|
|
|
||
|
|
// 成功色
|
||
|
|
colorSuccess: '#217a5b',
|
||
|
|
|
||
|
|
// 警告色
|
||
|
|
colorWarning: '#b7791f',
|
||
|
|
|
||
|
|
// 错误色
|
||
|
|
colorError: '#b33a3a',
|
||
|
|
|
||
|
|
// 信息色
|
||
|
|
colorInfo: '#2d6a9f',
|
||
|
|
|
||
|
|
// 字体
|
||
|
|
fontFamily: '"IBM Plex Sans", "PingFang SC", "Microsoft YaHei", sans-serif',
|
||
|
|
fontSize: 14,
|
||
|
|
|
||
|
|
// 圆角
|
||
|
|
borderRadius: 10,
|
||
|
|
borderRadiusLG: 16,
|
||
|
|
borderRadiusSM: 6,
|
||
|
|
|
||
|
|
// 链接
|
||
|
|
colorLink: '#0e5a6a',
|
||
|
|
colorLinkHover: '#0a4b59',
|
||
|
|
colorLinkActive: '#083d4a',
|
||
|
|
},
|
||
|
|
components: {
|
||
|
|
// 表格组件定制
|
||
|
|
Table: {
|
||
|
|
headerBg: '#f8f5ef',
|
||
|
|
borderColor: '#d6d0c3',
|
||
|
|
rowHoverBg: 'rgba(14, 90, 106, 0.04)',
|
||
|
|
},
|
||
|
|
// 卡片组件定制
|
||
|
|
Card: {
|
||
|
|
borderRadiusLG: 16,
|
||
|
|
boxShadowTertiary: '0 10px 30px rgba(23, 33, 43, 0.06)',
|
||
|
|
},
|
||
|
|
// 按钮组件定制
|
||
|
|
Button: {
|
||
|
|
borderRadius: 10,
|
||
|
|
controlHeight: 36,
|
||
|
|
controlHeightLG: 44,
|
||
|
|
controlHeightSM: 28,
|
||
|
|
},
|
||
|
|
// 输入框组件定制
|
||
|
|
Input: {
|
||
|
|
borderRadius: 10,
|
||
|
|
controlHeight: 36,
|
||
|
|
},
|
||
|
|
// 选择器组件定制
|
||
|
|
Select: {
|
||
|
|
borderRadius: 10,
|
||
|
|
controlHeight: 36,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
}
|
||
|
|
|
||
|
|
interface ThemeProviderProps {
|
||
|
|
children: ReactNode
|
||
|
|
}
|
||
|
|
|
||
|
|
export function ThemeProvider({ children }: ThemeProviderProps) {
|
||
|
|
return (
|
||
|
|
<ConfigProvider theme={themeConfig} locale={zhCN}>
|
||
|
|
{children}
|
||
|
|
</ConfigProvider>
|
||
|
|
)
|
||
|
|
}
|