import { defaultsDeep } from "lodash"; import { theme } from "antd"; import InstanceRenderMgr from "../utils/instanceRenderMgr"; const { defaultAlgorithm, darkAlgorithm } = theme; /** * Default theme * @type {{components: {Menu: {itemDividerBorderColor: string}}}} */ const defaultTheme = (isDarkMode) => ({ components: { Table: { rowHoverBg: isDarkMode ? "#2a2a2a" : "#e7f3ff", rowSelectedBg: isDarkMode ? "#333333" : "#e6f7ff", headerSortHoverBg: "transparent" }, Menu: { darkItemHoverBg: isDarkMode ? "#004a77" : "#1890ff", itemHoverBg: isDarkMode ? "#004a77" : "#1890ff", horizontalItemHoverBg: isDarkMode ? "#004a77" : "#1890ff" } }, token: { colorPrimary: InstanceRenderMgr( { imex: isDarkMode ? "#4da8ff" : "#1890ff", rome: isDarkMode ? "#5b8ce6" : "#326ade" }, isDarkMode ), colorInfo: InstanceRenderMgr( { imex: isDarkMode ? "#4da8ff" : "#1890ff", rome: isDarkMode ? "#5b8ce6" : "#326ade" }, isDarkMode ), colorError: isDarkMode ? "#ff4d4f" : "#f5222d", colorBgBase: isDarkMode ? "#1f1f1f" : "#ffffff" // Align with Ant Design dark mode } }); /** * Development theme * @type {{components: {Menu: {itemHoverBg: string, darkItemHoverBg: string, horizontalItemHoverBg: string}}, token: {colorPrimary: string}}} */ const devTheme = { components: { Menu: { darkItemHoverBg: "#a51d1d", itemHoverBg: "#a51d1d", horizontalItemHoverBg: "#a51d1d" } }, token: { colorPrimary: "#a51d1d" } }; /** * Production theme * @type {{components: {Menu: {itemHoverBg: string, darkItemHoverBg: string, horizontalItemHoverBg: string}}, token: {colorPrimary: string}}} */ const prodTheme = {}; const currentTheme = import.meta.env.DEV ? devTheme : prodTheme; const getTheme = (isDarkMode) => ({ algorithm: isDarkMode ? darkAlgorithm : defaultAlgorithm, ...defaultsDeep(currentTheme, defaultTheme) }); export default getTheme;