Revert "fix(theme): fix color of header menu (#3354)"

This reverts commit 70633840da.
This commit is contained in:
Zeke Zhang 2024-01-10 11:33:23 +08:00
parent 70633840da
commit 3a06893463
6 changed files with 10 additions and 64 deletions

View File

@ -31,7 +31,7 @@ export const PinnedPluginList = () => {
width: 46px;
border-radius: 0;
background: none;
color: rgba(255, 255, 255, 0.65);
color: rgba(255, 255, 255, 0.65) !important;
&:hover {
background: rgba(255, 255, 255, 0.1);
}

View File

@ -1,7 +1,6 @@
import { css } from '@emotion/css';
import { useSessionStorageState } from 'ahooks';
import { App, Layout } from 'antd';
import { createGlobalStyle } from 'antd-style';
import React, { createContext, useContext, useEffect, useMemo, useRef, useState } from 'react';
import { Link, Outlet, useMatch, useNavigate, useParams } from 'react-router-dom';
import {
@ -194,44 +193,6 @@ const MenuEditor = (props) => {
);
};
/**
*
*/
const GlobalStyleForAdminLayout = createGlobalStyle`
.ant-menu.ant-menu-submenu.ant-menu-submenu-popup {
.ant-menu.ant-menu-sub.ant-menu-vertical {
background-color: ${(p) => {
// @ts-ignore
return p.theme.colorBgHeader + ' !important';
}};
color: ${(p) => {
// @ts-ignore
return p.theme.colorTextHeaderMenu + ' !important';
}};
.ant-menu-item:hover {
color: ${(p) => {
// @ts-ignore
return p.theme.colorTextHeaderMenuHover + ' !important';
}};
background-color: ${(p) => {
// @ts-ignore
return p.theme.colorBgHeaderMenuHover + ' !important';
}};
}
.ant-menu-item.ant-menu-item-selected {
color: ${(p) => {
// @ts-ignore
return p.theme.colorTextHeaderMenuActive + ' !important';
}};
background-color: ${(p) => {
// @ts-ignore
return p.theme.colorBgHeaderMenuActive + ' !important';
}};
}
}
}
`;
export const InternalAdminLayout = (props: any) => {
const sideMenuRef = useRef<HTMLDivElement>();
const result = useSystemSettings();
@ -242,18 +203,17 @@ export const InternalAdminLayout = (props: any) => {
return (
<Layout>
<GlobalStyleForAdminLayout />
<Layout.Header
className={css`
.ant-menu.ant-menu-dark .ant-menu-item-selected,
.ant-menu-submenu-popup.ant-menu-dark .ant-menu-item-selected,
.ant-menu-submenu-horizontal.ant-menu-submenu-selected {
background-color: ${token.colorBgHeaderMenuActive} !important;
color: ${token.colorTextHeaderMenuActive} !important;
background-color: ${token.colorBgHeaderMenuActive};
color: ${token.colorTextHeaderMenuActive};
}
.ant-menu-dark.ant-menu-horizontal > .ant-menu-item:hover {
background-color: ${token.colorBgHeaderMenuHover} !important;
color: ${token.colorTextHeaderMenuHover} !important;
background-color: ${token.colorBgHeaderMenuHover};
color: ${token.colorTextHeaderMenuHover};
}
position: fixed;
@ -263,15 +223,14 @@ export const InternalAdminLayout = (props: any) => {
line-height: var(--nb-header-height);
padding: 0;
z-index: 100;
background-color: ${token.colorBgHeader} !important;
background-color: ${token.colorBgHeader};
.ant-menu {
background-color: transparent;
}
.ant-menu-item,
.ant-menu-submenu-horizontal {
color: ${token.colorTextHeaderMenu} !important;
.ant-menu-item {
color: ${token.colorTextHeaderMenu};
}
`}
>

View File

@ -18,9 +18,9 @@ import { createDesignable, DndContext, SortableItem, useDesignable, useDesigner
import { Icon, useAPIClient, useSchemaInitializerRender } from '../../../';
import { useCollectMenuItems, useMenuItem } from '../../../hooks/useMenuItem';
import { useProps } from '../../hooks/useProps';
import { useMenuTranslation } from './locale';
import { MenuDesigner } from './Menu.Designer';
import { findKeysByUid, findMenuItem } from './util';
import { useMenuTranslation } from './locale';
const subMenuDesignerCss = css`
position: relative;

View File

@ -11,7 +11,6 @@
"@formily/react": "2.x",
"@formily/shared": "2.x",
"antd": "5.x",
"antd-style": "3.x",
"async-mutex": "^0.3.2",
"mysql2": "^2.3.3",
"pg": "^8.7.3",

View File

@ -1,10 +0,0 @@
import { createStyles } from 'antd-style';
export const useStyles = createStyles(({ token }) => {
return {
button: {
// @ts-ignore
color: token.colorTextHeaderMenu + ' !important',
},
};
});

View File

@ -3,11 +3,9 @@ import { Button, Dropdown } from 'antd';
import React from 'react';
import { Link } from 'react-router-dom';
import { AppNameInput } from './AppNameInput';
import { useStyles } from './MultiAppManagerProvider.style';
import { usePluginUtils } from './utils';
const MultiAppManager = () => {
const { styles } = useStyles();
const { data, run } = useRequest<{
data: any[];
}>(
@ -48,7 +46,7 @@ const MultiAppManager = () => {
}}
menu={{ items }}
>
<Button className={styles.button} title={'Apps'} icon={<Icon type={'AppstoreOutlined'} />} />
<Button title={'Apps'} icon={<Icon type={'AppstoreOutlined'} />} />
</Dropdown>
);
};