fix(button): [button] Adapt to dark themes

Author: Youyou-smiles

packages/theme/src/button/index.less

@@ -223,8 +223,7 @@
   &.is-disabled.is-disabled.is-disabled.is-disabled.is-disabled,
   &.is-loading.is-loading.is-loading.is-loading.is-loading,
   &[disabled][disabled][disabled][disabled][disabled] {
-    color: var(--tv-Button-text-color-disabled);
-    background-color: var(--tv-Button-bg-color-disabled);
+    color: var(--tv-Button-text-color-disabled); 
     border-color: var(--tv-Button-border-color-disabled);
     fill: var(--tv-Button-icon-color-disabled);
     cursor: not-allowed;
@@ -267,12 +266,17 @@
     justify-content: center;
     &.@{button-prefix-cls}--default {
       border-color: var(--tv-Button-border-color-only-icon-default);
-
+      svg {
+        fill: var(--tv-Button-color-only-icon-default);
+      }
       &:active,
       &:focus,
       &:hover,
       &.is-active {
         border-color: var(--tv-Button-border-color-only-icon-default-hover);
+        svg {
+          fill: var(--tv-Button-color-only-icon-default-hover);
+        }
       }
     }
 
@@ -303,12 +307,17 @@
       border-radius: var(--tv-Button-border-radius-only-icon-ontext); // 影响hover时的阴影
 
       background-color: var(--tv-Button-bg-color-only-icon-ontext);
-
+      svg {
+        fill: var(--tv-Button-bg-color-only-icon)
+      }
       &:active,
       &:focus,
       &:hover,
       &.is-active {
         background-color: var(--tv-Button-bg-color-only-icon-ontext-hover);
+        svg {
+          fill: var(--tv-Button-bg-color-only-icon-hover)
+        }
       }
       // 不同的尺寸，icon大小 为高度。 原型稿不包含
       .size-only-icon-ontext-iconsize-mixin(e(''));
@@ -331,6 +340,13 @@
         color: var(--tv-Button-icon-color);
       }
     }
+    &.@{button-prefix-cls}--text.is-disabled {
+      &:hover {
+        svg {
+          fill: var(--tv-Button-disabled-color-only-icon-hover)
+        }
+      }
+    }
   }
 
   // 纯文字： 没有主题色，只有文本蓝色和禁用2种情况。
@@ -366,6 +382,7 @@
 
     .tiny-svg {
       margin-right: var(--tv-Button-margin-right-isicon-svg);
+      fill: var(--tv-Button-color-icon-svg);
     }
   }
 

packages/theme/src/button/vars.less

@@ -309,8 +309,6 @@
 
   // 禁用时按钮文本色
   --tv-Button-text-color-disabled: var(--tv-color-text-disabled, #c2c2c2); //  目前规则下，disabled优先级最高，所以变量少
-  // 禁用时按钮背景色
-  --tv-Button-bg-color-disabled: var(--tv-color-bg-disabled, #f0f0f0);
   // 禁用时按钮边框色
   --tv-Button-border-color-disabled: var(--tv-color-bg-disabled, #f0f0f0); // 设计边框是f0f0f0，没这个值，用背景色代替。
   // 禁用时, 幽灵按钮的边框色
@@ -331,6 +329,10 @@
 
   // 仅图标且default主题时， 外边框的颜色
   --tv-Button-border-color-only-icon-default: var(--tv-color-border, #c2c2c2);
+  // 仅图标且default主题时， 图标颜色
+  --tv-Button-color-only-icon-default: var(--tv-color-icon);
+  // 仅图标且default主题时， 图标颜色
+  --tv-Button-color-only-icon-default-hover: var(--tv-color-icon-hover);
   // 仅图标且default主题时， 外边框的悬浮色
   --tv-Button-border-color-only-icon-default-hover: var(--tv-color-border-hover, #191919);
   // 仅图标且有边框时，边框的圆角大
@@ -340,12 +342,16 @@
   --tv-Button-border-radius-only-icon-ontext: var(--tv-border-radius-sm, 4px);
   // 仅图标-无边框的背景色
   --tv-Button-bg-color-only-icon-ontext: transparent;
+  // 仅图标-无边框的悬浮时的图标色
+  --tv-Button-bg-color-only-icon: var(--tv-color-icon);
   // 仅图标-无边框的悬浮时的背景色
   --tv-Button-bg-color-only-icon-ontext-hover: var(--tv-color-bg, #f5f5f5);
-
+  // 仅图标-无边框的悬浮时的图标色
+  --tv-Button-bg-color-only-icon-hover: var(--tv-color-icon-hover);
   // 有图标-图标颜色
   --tv-Button-icon-color: var(--tv-color-icon, #808080);
-
+  // 仅图标-无边框的悬浮时的禁用事的图标色
+  --tv-Button-disabled-color-only-icon-hover: var(--tv-color-icon);
   // 纯文字时，文字颜色
   --tv-Button-text-color-ontext: var(--tv-color-text-link, #1476ff); // 蓝色文字
   // 纯文字时，文字的禁用色
@@ -355,7 +361,8 @@
 
   // 混排有边框和无边框时，图标右边距
   --tv-Button-margin-right-isicon-svg: var(--tv-space-sm, 4px);
-
+  // 混排有边框和无边框时，图标颜色
+  --tv-Button-color-icon-svg: var(--tv-color-icon);
   // 混排无边框时,文字的颜色
   --tv-Button-text-color-isicon-ontext: var(--tv-color-text-control, #191919); // 黑色文字
   // 混排无边框时,文字的禁用色