feat: @skeleton-to-color, @transfer-item-hover-bg, fix: progress style statusColor

This commit is contained in:
ycjcl868 2019-12-04 20:45:12 +08:00
parent e15b9c5f37
commit 34332116fb
5 changed files with 10 additions and 12 deletions

View File

@ -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 => {

View File

@ -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%;

View File

@ -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;

View File

@ -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
// ---

View File

@ -122,7 +122,7 @@
}
&-item:not(&-item-disabled):hover {
background-color: @item-hover-bg;
background-color: @transfer-item-hover-bg;
cursor: pointer;
}