HouYunFei
dce6ab2282
- 将 Ant Design 主题配置提取到独立的 getAntThemeConfig 函数 - 移除 AGENTS.md 中关于状态管理和样式的冗余说明 - 删除 globals.css 中的 admin 相关样式和颜色变量 - 更新管理后台布局使用新的主题配置和样式常量 - 调整代码编辑器样式使用 Ant Design 的 CSS 变量 - 优化管理后台整体视觉风格为中性色调
60 lines
1.6 KiB
TypeScript
60 lines
1.6 KiB
TypeScript
import type { CSSProperties } from "react";
|
|
import type { ThemeConfig } from "antd";
|
|
import { theme as antdTheme } from "antd";
|
|
|
|
const neutral = {
|
|
light: {
|
|
primary: "#171717",
|
|
primaryHover: "#000000",
|
|
primaryText: "#ffffff",
|
|
menuBg: "#f5f5f5",
|
|
menuText: "#171717",
|
|
},
|
|
dark: {
|
|
primary: "#fafafa",
|
|
primaryHover: "#ffffff",
|
|
primaryText: "#171717",
|
|
menuBg: "#262626",
|
|
menuText: "#fafafa",
|
|
},
|
|
};
|
|
|
|
export const adminLayoutStyle = {
|
|
siderWidth: 232,
|
|
headerHeight: 56,
|
|
brandHeight: 64,
|
|
menu: { borderInlineEnd: 0, padding: "18px 12px", fontSize: 15 } satisfies CSSProperties,
|
|
menuItem: { height: 44, lineHeight: "44px", marginBlock: 4, borderRadius: 8 } satisfies CSSProperties,
|
|
};
|
|
|
|
export function getAntThemeConfig(dark: boolean): ThemeConfig {
|
|
const color = dark ? neutral.dark : neutral.light;
|
|
|
|
return {
|
|
algorithm: dark ? antdTheme.darkAlgorithm : antdTheme.defaultAlgorithm,
|
|
cssVar: true,
|
|
token: {
|
|
colorPrimary: color.primary,
|
|
colorInfo: color.primary,
|
|
colorLink: color.primary,
|
|
colorLinkHover: color.primaryHover,
|
|
colorLinkActive: color.primary,
|
|
colorTextLightSolid: color.primaryText,
|
|
},
|
|
components: {
|
|
Button: {
|
|
primaryShadow: "none",
|
|
},
|
|
Menu: {
|
|
itemActiveBg: color.menuBg,
|
|
itemHoverBg: color.menuBg,
|
|
itemSelectedBg: color.menuBg,
|
|
itemSelectedColor: color.menuText,
|
|
darkItemHoverBg: neutral.dark.menuBg,
|
|
darkItemSelectedBg: neutral.dark.menuBg,
|
|
darkItemSelectedColor: neutral.dark.menuText,
|
|
},
|
|
},
|
|
};
|
|
}
|