From b30a316f4b51a95ed653da19da6d2ee243f47d27 Mon Sep 17 00:00:00 2001
From: tangjinzhou <415800467@qq.com>
Date: Sun, 24 Jan 2021 13:18:51 +0800
Subject: [PATCH] perf: update default less

---
 components/style/color/colorPalette.less | 38 +++++++++++++---------
 components/style/themes/default.less     | 41 +++++++++++++++++-------
 2 files changed, 51 insertions(+), 28 deletions(-)

diff --git a/components/style/color/colorPalette.less b/components/style/color/colorPalette.less
index 818cf57de..f3e175d82 100644
--- a/components/style/color/colorPalette.less
+++ b/components/style/color/colorPalette.less
@@ -9,10 +9,10 @@
 .colorPaletteMixin() {
 @functions: ~`(function() {
   var hueStep = 2;
-  var saturationStep = 16;
-  var saturationStep2 = 5;
-  var brightnessStep1 = 5;
-  var brightnessStep2 = 15;
+  var saturationStep = 0.16;
+  var saturationStep2 = 0.05;
+  var brightnessStep1 = 0.05;
+  var brightnessStep2 = 0.15;
   var lightColorCount = 5;
   var darkColorCount = 4;
 
@@ -33,28 +33,34 @@
   var getSaturation = function(hsv, i, isLight) {
     var saturation;
     if (isLight) {
-      saturation = Math.round(hsv.s * 100) - saturationStep * i;
+      saturation = hsv.s - saturationStep * i;
     } else if (i === darkColorCount) {
-      saturation = Math.round(hsv.s * 100) + saturationStep;
+      saturation = hsv.s + saturationStep;
     } else {
-      saturation = Math.round(hsv.s * 100) + saturationStep2 * i;
+      saturation = hsv.s + saturationStep2 * i;
     }
-    if (saturation > 100) {
-      saturation = 100;
+    if (saturation > 1) {
+      saturation = 1;
     }
-    if (isLight && i === lightColorCount && saturation > 10) {
-      saturation = 10;
+    if (isLight && i === lightColorCount && saturation > 0.1) {
+      saturation = 0.1;
     }
-    if (saturation < 6) {
-      saturation = 6;
+    if (saturation < 0.06) {
+      saturation = 0.06;
     }
-    return Math.round(saturation);
+    return Number(saturation.toFixed(2));
   };
   var getValue = function(hsv, i, isLight) {
+    var value;
     if (isLight) {
-      return Math.round(hsv.v * 100) + brightnessStep1 * i;
+      value = hsv.v + brightnessStep1 * i;
+    }else{
+      value = hsv.v - brightnessStep2 * i
     }
-    return Math.round(hsv.v * 100) - brightnessStep2 * i;
+    if (value > 1) {
+      value = 1;
+    }
+    return Number(value.toFixed(2))
   };
 
   this.colorPalette = function(color, index) {
diff --git a/components/style/themes/default.less b/components/style/themes/default.less
index b975fd5bf..d19c3903b 100644
--- a/components/style/themes/default.less
+++ b/components/style/themes/default.less
@@ -1,6 +1,8 @@
 /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
 @import '../color/colors';
+
 @theme: default;
+
 // The prefix to use on all css classes from ant.
 @ant-prefix: ant;
 
@@ -9,11 +11,11 @@
 
 // -------- Colors -----------
 @primary-color: @blue-6;
-@info-color: @blue-6;
+@info-color: @primary-color;
 @success-color: @green-6;
 @processing-color: @blue-6;
-@error-color: @red-6;
-@highlight-color: @red-6;
+@error-color: @red-5;
+@highlight-color: @red-5;
 @warning-color: @gold-6;
 @normal-color: #d9d9d9;
 @white: #fff;
@@ -43,17 +45,17 @@
 @component-background: #fff;
 // Popover background color
 @popover-background: @component-background;
-@font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB',
-  'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji',
-  'Segoe UI Emoji', 'Segoe UI Symbol';
+@popover-customize-border-color: @border-color-split;
+@font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
+  'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
+  'Noto Color Emoji';
 @code-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
 @text-color: fade(@black, 85%);
 @text-color-secondary: fade(@black, 45%);
 @text-color-inverse: @white;
 @icon-color: inherit;
 @icon-color-hover: fade(@black, 75%);
-@heading-color: fade(#000, 85%);
-@heading-color-dark: fade(@white, 100%);
+@heading-color: fade(@black, 85%);
 @text-color-dark: fade(@white, 85%);
 @text-color-secondary-dark: fade(@white, 65%);
 @text-selection-bg: @primary-color;
@@ -62,10 +64,12 @@
 @font-size-base: 14px;
 @font-size-lg: @font-size-base + 2px;
 @font-size-sm: 12px;
-@heading-1-size: ceil((@font-size-base * 2.71));
-@heading-2-size: ceil((@font-size-base * 2.14));
-@heading-3-size: ceil((@font-size-base * 1.71));
-@heading-4-size: ceil((@font-size-base * 1.42));
+@heading-1-size: ceil(@font-size-base * 2.71);
+@heading-2-size: ceil(@font-size-base * 2.14);
+@heading-3-size: ceil(@font-size-base * 1.71);
+@heading-4-size: ceil(@font-size-base * 1.42);
+@heading-5-size: ceil(@font-size-base * 1.14);
+// https://github.com/ant-design/ant-design/issues/20210
 @line-height-base: 1.5715;
 @border-radius-base: 2px;
 @border-radius-sm: @border-radius-base;
@@ -75,11 +79,24 @@
 @padding-md: 16px; // small containers and buttons
 @padding-sm: 12px; // Form controls and items
 @padding-xs: 8px; // small items
+@padding-xss: 4px; // more small
 
 // vertical padding for all form controls
 @control-padding-horizontal: @padding-sm;
 @control-padding-horizontal-sm: @padding-xs;
 
+// vertical margins
+@margin-lg: 24px; // containers
+@margin-md: 16px; // small containers and buttons
+@margin-sm: 12px; // Form controls and items
+@margin-xs: 8px; // small items
+@margin-xss: 4px; // more small
+
+// height rules
+@height-base: 32px;
+@height-lg: 40px;
+@height-sm: 24px;
+
 // The background colors for active and hover states for things like
 // list items or table cells.
 @item-active-bg: @primary-1;