fix: more colorBgElevated (#36142)

This commit is contained in:
MadCcc 2022-06-21 11:06:06 +08:00 committed by GitHub
parent b6bfdedc5d
commit d5c23dc265
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 10 deletions

View File

@ -36,7 +36,6 @@ const genBaseStyle: GenerateStyle<DropdownToken> = token => {
sizePopupArrow,
antCls,
iconCls,
colorBgComponent,
motionDurationMid,
motionDurationSlow,
dropdownPaddingVertical,
@ -46,6 +45,7 @@ const genBaseStyle: GenerateStyle<DropdownToken> = token => {
colorTextDisabled,
fontSizeIcon,
controlPaddingHorizontal,
colorBgElevated,
} = token;
return [
@ -126,9 +126,9 @@ const genBaseStyle: GenerateStyle<DropdownToken> = token => {
width: sizePopupArrow,
height: sizePopupArrow,
// Use linear-gradient to prevent arrow from covering text
background: `linear-gradient(135deg, transparent 40%, ${colorBgComponent} 40%)`,
background: `linear-gradient(135deg, transparent 40%, ${colorBgElevated} 40%)`,
...roundedArrow(sizePopupArrow, 5, colorBgComponent),
...roundedArrow(sizePopupArrow, 5, colorBgElevated),
},
[`
@ -261,7 +261,7 @@ const genBaseStyle: GenerateStyle<DropdownToken> = token => {
[menuCls]: {
padding: `${dropdownEdgeChildVerticalPadding}px 0`,
listStyleType: 'none',
backgroundColor: colorBgComponent,
backgroundColor: colorBgElevated,
backgroundClip: 'padding-box',
borderRadius: token.controlRadius,
outline: 'none',
@ -344,7 +344,7 @@ const genBaseStyle: GenerateStyle<DropdownToken> = token => {
'&:hover': {
color: colorTextDisabled,
backgroundColor: colorBgComponent,
backgroundColor: colorBgElevated,
cursor: 'not-allowed',
},
@ -391,7 +391,7 @@ const genBaseStyle: GenerateStyle<DropdownToken> = token => {
[`${menuCls}-submenu${menuCls}-submenu-disabled ${componentCls}-menu-submenu-title`]: {
[`&, ${componentCls}-menu-submenu-arrow-icon`]: {
color: colorTextDisabled,
backgroundColor: colorBgComponent,
backgroundColor: colorBgElevated,
cursor: 'not-allowed',
},
},

View File

@ -7,10 +7,10 @@
// import '../../empty/style';
// deps-lint-skip-all
import type { GenerateStyle, FullToken } from '../../_util/theme';
import { genComponentStyleHook, mergeToken } from '../../_util/theme';
import { getStyle as getCheckboxStyle } from '../../checkbox/style';
import { genTreeStyle } from '../../tree/style';
import type { AliasToken, FullToken, GenerateStyle } from '../../_util/theme';
import { genComponentStyleHook, mergeToken } from '../../_util/theme';
interface TreeSelectToken extends FullToken<'TreeSelect'> {
treePrefixCls: string;
@ -18,7 +18,7 @@ interface TreeSelectToken extends FullToken<'TreeSelect'> {
// =============================== Base ===============================
const genBaseStyle: GenerateStyle<TreeSelectToken> = token => {
const { componentCls, treePrefixCls } = token;
const { componentCls, treePrefixCls, colorBgElevated } = token;
const treeCls = `.${treePrefixCls}`;
return [
@ -32,7 +32,10 @@ const genBaseStyle: GenerateStyle<TreeSelectToken> = token => {
},
// ====================== Tree ======================
genTreeStyle(treePrefixCls, token),
genTreeStyle(
treePrefixCls,
mergeToken<AliasToken>(token, { colorBgComponent: colorBgElevated }),
),
{
[treeCls]: {
borderRadius: 0,