mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-01 06:49:32 +08:00
feat: @skeleton-to-color, @transfer-item-hover-bg, fix: progress style statusColor
This commit is contained in:
parent
e15b9c5f37
commit
34332116fb
@ -10,12 +10,6 @@ interface CircleProps extends ProgressProps {
|
||||
progressStatus: string;
|
||||
}
|
||||
|
||||
const statusColorMap: Record<string, string> = {
|
||||
normal: '#108ee9',
|
||||
exception: '#ff5500',
|
||||
success: '#87d068',
|
||||
};
|
||||
|
||||
function getPercentage({ percent, successPercent }: CircleProps) {
|
||||
const ptg = validProgress(percent);
|
||||
if (!successPercent) {
|
||||
@ -26,12 +20,12 @@ function getPercentage({ percent, successPercent }: CircleProps) {
|
||||
return [successPercent, validProgress(ptg - successPtg)];
|
||||
}
|
||||
|
||||
function getStrokeColor({ progressStatus, successPercent, strokeColor }: CircleProps) {
|
||||
const color = strokeColor || statusColorMap[progressStatus];
|
||||
function getStrokeColor({ successPercent, strokeColor }: CircleProps) {
|
||||
const color = strokeColor || null;
|
||||
if (!successPercent) {
|
||||
return color;
|
||||
}
|
||||
return [statusColorMap.success, color];
|
||||
return [null, color];
|
||||
}
|
||||
|
||||
const Circle: React.SFC<CircleProps> = props => {
|
||||
|
@ -7,8 +7,6 @@
|
||||
@skeleton-paragraph-prefix-cls: ~'@{skeleton-prefix-cls}-paragraph';
|
||||
@skeleton-button-prefix-cls: ~'@{skeleton-prefix-cls}-button';
|
||||
|
||||
@skeleton-to-color: shade(@skeleton-color, 5%);
|
||||
|
||||
.@{skeleton-prefix-cls} {
|
||||
display: table;
|
||||
width: 100%;
|
||||
|
@ -353,6 +353,10 @@
|
||||
@card-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.48), 0 3px 6px 0 rgba(0, 0, 0, 0.36),
|
||||
0 5px 12px 4px rgba(0, 0, 0, 0.27);
|
||||
|
||||
// Transfer
|
||||
// ---
|
||||
@transfer-item-hover-bg: #262626;
|
||||
|
||||
// Comment
|
||||
// ---
|
||||
@comment-bg: @component-background;
|
||||
|
@ -680,12 +680,14 @@
|
||||
// Skeleton
|
||||
// ---
|
||||
@skeleton-color: #f2f2f2;
|
||||
@skeleton-to-color: shade(@skeleton-color, 5%);
|
||||
|
||||
// Transfer
|
||||
// ---
|
||||
@transfer-header-height: 40px;
|
||||
@transfer-disabled-bg: @disabled-bg;
|
||||
@transfer-list-height: 200px;
|
||||
@transfer-item-hover-bg: @item-hover-bg;
|
||||
|
||||
// Message
|
||||
// ---
|
||||
|
@ -122,7 +122,7 @@
|
||||
}
|
||||
|
||||
&-item:not(&-item-disabled):hover {
|
||||
background-color: @item-hover-bg;
|
||||
background-color: @transfer-item-hover-bg;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user