mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-11 11:32:52 +08:00
Code Issues Actions 38 Packages Projects Releases Wiki Activity

fix: fix Badge Wave borderColor error (#39182)

Browse Source 
* fix: fix Badge borderColor error

* update demo

* fix

* update demo

* fix

* fix
This commit is contained in:
lijianan 2022-12-02 14:42:39 +08:00 committed by GitHub
parent bf9d4c3b6e
commit eb77c5a7e6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 13 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/badge/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -549,7 +549,7 @@ Array [
> >
<span <span
class="ant-badge-status-dot" class="ant-badge-status-dot"
style="background:#f50" style="color:#f50;background:#f50"
/> />
<span <span
class="ant-badge-status-text" class="ant-badge-status-text"
@ -567,7 +567,7 @@ Array [
> >
<span <span
class="ant-badge-status-dot" class="ant-badge-status-dot"
style="background:rgb(45, 183, 245)" style="color:rgb(45, 183, 245);background:rgb(45, 183, 245)"
/> />
<span <span
class="ant-badge-status-text" class="ant-badge-status-text"
@ -585,7 +585,7 @@ Array [
> >
<span <span
class="ant-badge-status-dot" class="ant-badge-status-dot"
style="background:hsl(102, 53%, 61%)" style="color:hsl(102, 53%, 61%);background:hsl(102, 53%, 61%)"
/> />
<span <span
class="ant-badge-status-text" class="ant-badge-status-text"
@ -602,7 +602,7 @@ Array [
> >
<span <span
class="ant-badge-status-dot" class="ant-badge-status-dot"
style="background:hwb(205 6% 9%)" style="color:hwb(205 6% 9%);background:hwb(205 6% 9%)"
/> />
<span <span
class="ant-badge-status-text" class="ant-badge-status-text"

8
components/badge/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -549,7 +549,7 @@ Array [
> >
<span <span
class="ant-badge-status-dot" class="ant-badge-status-dot"
style="background:#f50" style="color:#f50;background:#f50"
/> />
<span <span
class="ant-badge-status-text" class="ant-badge-status-text"
@ -567,7 +567,7 @@ Array [
> >
<span <span
class="ant-badge-status-dot" class="ant-badge-status-dot"
style="background:rgb(45, 183, 245)" style="color:rgb(45, 183, 245);background:rgb(45, 183, 245)"
/> />
<span <span
class="ant-badge-status-text" class="ant-badge-status-text"
@ -585,7 +585,7 @@ Array [
> >
<span <span
class="ant-badge-status-dot" class="ant-badge-status-dot"
style="background:hsl(102, 53%, 61%)" style="color:hsl(102, 53%, 61%);background:hsl(102, 53%, 61%)"
/> />
<span <span
class="ant-badge-status-text" class="ant-badge-status-text"
@ -602,7 +602,7 @@ Array [
> >
<span <span
class="ant-badge-status-dot" class="ant-badge-status-dot"
style="background:hwb(205 6% 9%)" style="color:hwb(205 6% 9%);background:hwb(205 6% 9%)"
/> />
<span <span
class="ant-badge-status-text" class="ant-badge-status-text"

1
components/badge/index.tsx
View File

@ -153,6 +153,7 @@ const Badge: CompoundedComponent = ({
const statusStyle: React.CSSProperties = {}; const statusStyle: React.CSSProperties = {};
if (color && !isPresetColor(color)) { if (color && !isPresetColor(color)) {
statusStyle.color = color;
statusStyle.background = color; statusStyle.background = color;
} }

5
components/badge/style/index.tsx
View File

@ -185,6 +185,7 @@ const genSharedBadgeStyle: GenerateStyle<BadgeToken> = (token: BadgeToken): CSSO
}, },
[`${componentCls}-status-processing`]: { [`${componentCls}-status-processing`]: {
position: 'relative', position: 'relative',
color: token.colorPrimary,
backgroundColor: token.colorPrimary, backgroundColor: token.colorPrimary,
'&::after': { '&::after': {
@ -193,7 +194,9 @@ const genSharedBadgeStyle: GenerateStyle<BadgeToken> = (token: BadgeToken): CSSO
insetInlineStart: 0, insetInlineStart: 0,
width: '100%', width: '100%',
height: '100%', height: '100%',
border: `${badgeShadowSize}px solid ${token.colorPrimary}`, borderWidth: badgeShadowSize,
borderStyle: 'solid',
borderColor: 'inherit',
borderRadius: '50%', borderRadius: '50%',
animationName: antStatusProcessing, animationName: antStatusProcessing,
animationDuration: token.badgeProcessingDuration, animationDuration: token.badgeProcessingDuration,