Skip to content

Commit b30a316

Browse files
committed
perf: update default less
1 parent b6c75bc commit b30a316

File tree

2 files changed

+51
-28
lines changed

2 files changed

+51
-28
lines changed

components/style/color/colorPalette.less

Lines changed: 22 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@
99
.colorPaletteMixin() {
1010
@functions: ~`(function() {
1111
var hueStep = 2;
12-
var saturationStep = 16;
13-
var saturationStep2 = 5;
14-
var brightnessStep1 = 5;
15-
var brightnessStep2 = 15;
12+
var saturationStep = 0.16;
13+
var saturationStep2 = 0.05;
14+
var brightnessStep1 = 0.05;
15+
var brightnessStep2 = 0.15;
1616
var lightColorCount = 5;
1717
var darkColorCount = 4;
1818

@@ -33,28 +33,34 @@
3333
var getSaturation = function(hsv, i, isLight) {
3434
var saturation;
3535
if (isLight) {
36-
saturation = Math.round(hsv.s * 100) - saturationStep * i;
36+
saturation = hsv.s - saturationStep * i;
3737
} else if (i === darkColorCount) {
38-
saturation = Math.round(hsv.s * 100) + saturationStep;
38+
saturation = hsv.s + saturationStep;
3939
} else {
40-
saturation = Math.round(hsv.s * 100) + saturationStep2 * i;
40+
saturation = hsv.s + saturationStep2 * i;
4141
}
42-
if (saturation > 100) {
43-
saturation = 100;
42+
if (saturation > 1) {
43+
saturation = 1;
4444
}
45-
if (isLight && i === lightColorCount && saturation > 10) {
46-
saturation = 10;
45+
if (isLight && i === lightColorCount && saturation > 0.1) {
46+
saturation = 0.1;
4747
}
48-
if (saturation < 6) {
49-
saturation = 6;
48+
if (saturation < 0.06) {
49+
saturation = 0.06;
5050
}
51-
return Math.round(saturation);
51+
return Number(saturation.toFixed(2));
5252
};
5353
var getValue = function(hsv, i, isLight) {
54+
var value;
5455
if (isLight) {
55-
return Math.round(hsv.v * 100) + brightnessStep1 * i;
56+
value = hsv.v + brightnessStep1 * i;
57+
}else{
58+
value = hsv.v - brightnessStep2 * i
5659
}
57-
return Math.round(hsv.v * 100) - brightnessStep2 * i;
60+
if (value > 1) {
61+
value = 1;
62+
}
63+
return Number(value.toFixed(2))
5864
};
5965

6066
this.colorPalette = function(color, index) {

components/style/themes/default.less

Lines changed: 29 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
22
@import '../color/colors';
3+
34
@theme: default;
5+
46
// The prefix to use on all css classes from ant.
57
@ant-prefix: ant;
68

@@ -9,11 +11,11 @@
911

1012
// -------- Colors -----------
1113
@primary-color: @blue-6;
12-
@info-color: @blue-6;
14+
@info-color: @primary-color;
1315
@success-color: @green-6;
1416
@processing-color: @blue-6;
15-
@error-color: @red-6;
16-
@highlight-color: @red-6;
17+
@error-color: @red-5;
18+
@highlight-color: @red-5;
1719
@warning-color: @gold-6;
1820
@normal-color: #d9d9d9;
1921
@white: #fff;
@@ -43,17 +45,17 @@
4345
@component-background: #fff;
4446
// Popover background color
4547
@popover-background: @component-background;
46-
@font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB',
47-
'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji',
48-
'Segoe UI Emoji', 'Segoe UI Symbol';
48+
@popover-customize-border-color: @border-color-split;
49+
@font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
50+
'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
51+
'Noto Color Emoji';
4952
@code-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
5053
@text-color: fade(@black, 85%);
5154
@text-color-secondary: fade(@black, 45%);
5255
@text-color-inverse: @white;
5356
@icon-color: inherit;
5457
@icon-color-hover: fade(@black, 75%);
55-
@heading-color: fade(#000, 85%);
56-
@heading-color-dark: fade(@white, 100%);
58+
@heading-color: fade(@black, 85%);
5759
@text-color-dark: fade(@white, 85%);
5860
@text-color-secondary-dark: fade(@white, 65%);
5961
@text-selection-bg: @primary-color;
@@ -62,10 +64,12 @@
6264
@font-size-base: 14px;
6365
@font-size-lg: @font-size-base + 2px;
6466
@font-size-sm: 12px;
65-
@heading-1-size: ceil((@font-size-base * 2.71));
66-
@heading-2-size: ceil((@font-size-base * 2.14));
67-
@heading-3-size: ceil((@font-size-base * 1.71));
68-
@heading-4-size: ceil((@font-size-base * 1.42));
67+
@heading-1-size: ceil(@font-size-base * 2.71);
68+
@heading-2-size: ceil(@font-size-base * 2.14);
69+
@heading-3-size: ceil(@font-size-base * 1.71);
70+
@heading-4-size: ceil(@font-size-base * 1.42);
71+
@heading-5-size: ceil(@font-size-base * 1.14);
72+
// https://github.com/ant-design/ant-design/issues/20210
6973
@line-height-base: 1.5715;
7074
@border-radius-base: 2px;
7175
@border-radius-sm: @border-radius-base;
@@ -75,11 +79,24 @@
7579
@padding-md: 16px; // small containers and buttons
7680
@padding-sm: 12px; // Form controls and items
7781
@padding-xs: 8px; // small items
82+
@padding-xss: 4px; // more small
7883

7984
// vertical padding for all form controls
8085
@control-padding-horizontal: @padding-sm;
8186
@control-padding-horizontal-sm: @padding-xs;
8287

88+
// vertical margins
89+
@margin-lg: 24px; // containers
90+
@margin-md: 16px; // small containers and buttons
91+
@margin-sm: 12px; // Form controls and items
92+
@margin-xs: 8px; // small items
93+
@margin-xss: 4px; // more small
94+
95+
// height rules
96+
@height-base: 32px;
97+
@height-lg: 40px;
98+
@height-sm: 24px;
99+
83100
// The background colors for active and hover states for things like
84101
// list items or table cells.
85102
@item-active-bg: @primary-1;

0 commit comments

Comments
 (0)