From 867301ac9fcfe6cbff3d15fa49794b79d84ae25a Mon Sep 17 00:00:00 2001
From: hz <hz932@qq.com>
Date: Sun, 26 May 2019 19:15:14 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E5=86=B3=E6=A0=B7=E5=BC=8F=E8=A6=86?=
 =?UTF-8?q?=E7=9B=96=E9=97=AE=E9=A2=98=EF=BC=9B=E8=A7=A3=E5=86=B3@keyframe?=
 =?UTF-8?q?=E5=86=85=E9=A2=9C=E8=89=B2=E6=9B=BF=E6=8D=A2=E6=97=A0=E6=95=88?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 config/plugin.config.js                       | 30 ++++++++++++++-----
 package.json                                  |  2 +-
 .../SettingDrawer/themeColorClient.js         |  7 ++++-
 3 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/config/plugin.config.js b/config/plugin.config.js
index b8056c92..77a23dd5 100644
--- a/config/plugin.config.js
+++ b/config/plugin.config.js
@@ -44,15 +44,22 @@ export default config => {
     config.plugin('webpack-theme-color-replacer').use(ThemeColorReplacer, [
       {
         fileName: 'css/theme-colors.css',
-        matchColors: generate('#1890ff'), // 主色系列
+        matchColors: getAntdSerials('#1890ff'), // 主色系列
         // 改变样式选择器，解决样式覆盖问题
         changeSelector(selector) {
-          switch (selector) {
-            case '.ant-calendar-today .ant-calendar-date':
-              return ':not(.ant-calendar-selected-day)' + selector;
-            default:
-              return selector;
-          }
+          var fix = {
+            '.ant-calendar-today .ant-calendar-date':
+              ':not(.ant-calendar-selected-date)' + selector,
+            '.ant-btn:focus,.ant-btn:hover': selector
+              .split(',')
+              .map(s => s + ':not(.ant-btn-primary)')
+              .join(','),
+            '.ant-btn.active,.ant-btn:active': selector
+              .split(',')
+              .map(s => s + ':not(.ant-btn-primary)')
+              .join(','),
+          };
+          return fix[selector] || selector;
         },
       },
     ]);
@@ -97,3 +104,12 @@ export default config => {
       },
     });
 };
+
+function getAntdSerials(color) {
+  const colorPalettes = generate(color);
+  // 淡化（即less的tint）
+  const lightens = new Array(9).fill().map((t, i) => {
+    return ThemeColorReplacer.varyColor.lighten(color, i / 10);
+  });
+  return colorPalettes.concat(lightens);
+}
diff --git a/package.json b/package.json
index 5684d8d7..c50ec8b6 100644
--- a/package.json
+++ b/package.json
@@ -127,7 +127,7 @@
     "tslint-config-prettier": "^1.17.0",
     "tslint-react": "^3.6.0",
     "umi-plugin-ga": "^1.1.3",
-    "webpack-theme-color-replacer": "^1.1.4"
+    "webpack-theme-color-replacer": "^1.1.5"
   },
   "optionalDependencies": {
     "puppeteer": "^1.12.1"
diff --git a/src/components/SettingDrawer/themeColorClient.js b/src/components/SettingDrawer/themeColorClient.js
index 9eeee6d7..a0e476de 100644
--- a/src/components/SettingDrawer/themeColorClient.js
+++ b/src/components/SettingDrawer/themeColorClient.js
@@ -5,7 +5,12 @@ import client from 'webpack-theme-color-replacer/client';
 export default {
   primaryColor: '#1890ff',
   getAntdSerials(color) {
-    return generate(color);
+    // 淡化（即less的tint）
+    const lightens = new Array(9).fill().map((t, i) => {
+      return client.varyColor.lighten(color, i / 10);
+    });
+    const colorPalettes = generate(color);
+    return lightens.concat(colorPalettes);
   },
   changeColor(newColor) {
     const lastColor = this.lastColor || this.primaryColor;
-- 
GitLab