fix(theme): text color of page header right side (#3008)

This commit is contained in:
被雨水过滤的空气-Rain 2023-11-10 08:02:30 +08:00 committed by GitHub
parent c3c648d28c
commit 3f5704421d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 5 deletions

View File

@ -6,16 +6,18 @@ import { useTranslation } from 'react-i18next';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { useACLRoleContext } from '../acl/ACLProvider'; import { useACLRoleContext } from '../acl/ACLProvider';
import { ActionContextProvider, useCompile } from '../schema-component'; import { ActionContextProvider, useCompile } from '../schema-component';
import { useToken } from '../style';
import { SettingsCenterContext, getPluginsTabs } from './index'; import { SettingsCenterContext, getPluginsTabs } from './index';
export const PluginManagerLink = () => { export const PluginManagerLink = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate(); const navigate = useNavigate();
const { token } = useToken();
return ( return (
<Tooltip title={t('Plugin manager')}> <Tooltip title={t('Plugin manager')}>
<Button <Button
data-testid={'plugin-manager-button'} data-testid={'plugin-manager-button'}
icon={<ApiOutlined />} icon={<ApiOutlined style={{ color: token.colorTextHeaderMenu }} />}
title={t('Plugin manager')} title={t('Plugin manager')}
onClick={() => { onClick={() => {
navigate('/admin/pm/list'); navigate('/admin/pm/list');
@ -42,6 +44,7 @@ export const SettingsCenterDropdown = () => {
const compile = useCompile(); const compile = useCompile();
const navigate = useNavigate(); const navigate = useNavigate();
const itemData = useContext(SettingsCenterContext); const itemData = useContext(SettingsCenterContext);
const { token } = useToken();
const pluginsTabs = getPluginsTabs(itemData, snippets); const pluginsTabs = getPluginsTabs(itemData, snippets);
const bookmarkTabs = getBookmarkTabs(pluginsTabs); const bookmarkTabs = getBookmarkTabs(pluginsTabs);
const menu = useMemo<MenuProps>(() => { const menu = useMemo<MenuProps>(() => {
@ -70,7 +73,7 @@ export const SettingsCenterDropdown = () => {
<Dropdown placement="bottom" menu={menu}> <Dropdown placement="bottom" menu={menu}>
<Button <Button
data-testid="settings-center-button" data-testid="settings-center-button"
icon={<SettingOutlined />} icon={<SettingOutlined style={{ color: token.colorTextHeaderMenu }} />}
// title={t('All plugin settings')} // title={t('All plugin settings')}
/> />
</Dropdown> </Dropdown>

View File

@ -4,10 +4,12 @@ import React from 'react';
import { useHotkeys } from 'react-hotkeys-hook'; import { useHotkeys } from 'react-hotkeys-hook';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useDesignable } from '..'; import { useDesignable } from '..';
import { useToken } from '../../style';
export const DesignableSwitch = () => { export const DesignableSwitch = () => {
const { designable, setDesignable } = useDesignable(); const { designable, setDesignable } = useDesignable();
const { t } = useTranslation(); const { t } = useTranslation();
const { token } = useToken();
const style = {}; const style = {};
if (designable) { if (designable) {
style['backgroundColor'] = 'var(--colorSettings)'; style['backgroundColor'] = 'var(--colorSettings)';
@ -21,7 +23,7 @@ export const DesignableSwitch = () => {
<Button <Button
data-testid={'ui-editor-button'} data-testid={'ui-editor-button'}
// selected={designable} // selected={designable}
icon={<HighlightOutlined />} icon={<HighlightOutlined style={{ color: token.colorTextHeaderMenu }} />}
title={t('UI Editor')} title={t('UI Editor')}
// subtitle={'Ctrl+Shift+U'} // subtitle={'Ctrl+Shift+U'}
style={style} style={style}

View File

@ -4,7 +4,7 @@ import { App, Dropdown, Menu, MenuProps } from 'antd';
import React, { createContext, useCallback, useMemo as useEffect, useState } from 'react'; import React, { createContext, useCallback, useMemo as useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { useACLRoleContext, useAPIClient, useCurrentUserContext } from '..'; import { useACLRoleContext, useAPIClient, useCurrentUserContext, useToken } from '..';
import { useCurrentAppInfo } from '../appInfo/CurrentAppInfoProvider'; import { useCurrentAppInfo } from '../appInfo/CurrentAppInfoProvider';
import { useChangePassword } from './ChangePassword'; import { useChangePassword } from './ChangePassword';
import { useCurrentUserSettingsMenu } from './CurrentUserSettingsMenuProvider'; import { useCurrentUserSettingsMenu } from './CurrentUserSettingsMenuProvider';
@ -168,6 +168,7 @@ export const DropdownVisibleContext = createContext(null);
export const CurrentUser = () => { export const CurrentUser = () => {
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const { data } = useCurrentUserContext(); const { data } = useCurrentUserContext();
const { token } = useToken();
return ( return (
<div style={{ display: 'inline-flex', verticalAlign: 'top' }}> <div style={{ display: 'inline-flex', verticalAlign: 'top' }}>
@ -191,7 +192,7 @@ export const CurrentUser = () => {
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
`} `}
style={{ cursor: 'pointer', border: 0, padding: '16px', color: 'rgba(255, 255, 255, 0.65)' }} style={{ cursor: 'pointer', border: 0, padding: '16px', color: token.colorTextHeaderMenu }}
> >
{data?.data?.nickname || data?.data?.username || data?.data?.email} {data?.data?.nickname || data?.data?.username || data?.data?.email}
</span> </span>