HouYunFei
e319481976
- 统一调整 admin.ts 文件中的接口定义缩进格式 - 优化 animated-theme-toggler.tsx 组件的代码结构和缩进 - 规范 app-config-modal.tsx 中 JSX 元素的嵌套格式 - 整理 app-providers.tsx 中的组件层级缩进 - 标准化 app-theme.ts 中的对象属性缩进格式
79 lines
2.6 KiB
TypeScript
79 lines
2.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",
|
|
selectActiveBg: "#f5f5f5",
|
|
selectSelectedBg: "#f0f0f0",
|
|
selectText: "#171717",
|
|
tableSelectedBg: "rgba(17, 17, 17, 0.05)",
|
|
tableSelectedHoverBg: "rgba(17, 17, 17, 0.08)",
|
|
},
|
|
dark: {
|
|
primary: "#fafafa",
|
|
primaryHover: "#ffffff",
|
|
primaryText: "#171717",
|
|
menuBg: "#262626",
|
|
menuText: "#fafafa",
|
|
selectActiveBg: "#262626",
|
|
selectSelectedBg: "#333333",
|
|
selectText: "#fafafa",
|
|
tableSelectedBg: "rgba(255, 255, 255, 0.08)",
|
|
tableSelectedHoverBg: "rgba(255, 255, 255, 0.12)",
|
|
},
|
|
};
|
|
|
|
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: { key: dark ? "infinite-canvas-dark" : "infinite-canvas-light" },
|
|
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,
|
|
},
|
|
Select: {
|
|
optionActiveBg: color.selectActiveBg,
|
|
optionSelectedBg: color.selectSelectedBg,
|
|
optionSelectedColor: color.selectText,
|
|
},
|
|
Table: {
|
|
rowSelectedBg: color.tableSelectedBg,
|
|
rowSelectedHoverBg: color.tableSelectedHoverBg,
|
|
},
|
|
},
|
|
};
|
|
}
|