From 803d5745275bd84730bc7c428f03f26f786bf6df Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=BF=A0=E5=B1=8F=E5=B1=B1=E6=9C=80=E9=80=9F=E4=B8=8B?=
 =?UTF-8?q?=E5=B1=B1=E4=BC=A0=E8=AF=B4?= <zsmj1994@gmail.com>
Date: Thu, 14 Dec 2023 19:59:52 +0800
Subject: [PATCH] =?UTF-8?q?=E6=97=A0JIRA=20=E5=88=A0=E6=8E=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/less/base/single/button/button.less   | 112 +++++++++++++++++-
 packages/fineui/src/less/visual.less          |   2 -
 2 files changed, 109 insertions(+), 5 deletions(-)

diff --git a/packages/fineui/src/less/base/single/button/button.less b/packages/fineui/src/less/base/single/button/button.less
index 6d96e3c83..6f186ef0f 100644
--- a/packages/fineui/src/less/base/single/button/button.less
+++ b/packages/fineui/src/less/base/single/button/button.less
@@ -1,4 +1,5 @@
 @import "../../../index.less";
+
 @hoverVal: opacity .3s ease;
 @activeVal: transform .5s ease, opacity 1s ease;
 @activeStopVal: transform 0s;
@@ -6,6 +7,7 @@ body .bi-button, #body .bi-button {
   &.hack {
     .border-radius(0px);
   }
+
   .border-radius(2px);
   outline: 0;
   border: 1px solid @color-bi-border-button;
@@ -14,41 +16,51 @@ body .bi-button, #body .bi-button {
   text-align: center;
   vertical-align: middle;
   cursor: pointer;
+
   &.loading {
     cursor: not-allowed;
   }
+
   &.block {
     font-size: inherit;
     border-width: 0;
     .border-radius(0px);
   }
+
   &.clear {
     font-size: inherit;
     border-width: 0;
     background-color: transparent;
+
     &:hover, &:focus {
       .opacity(0.8);
     }
+
     &:active {
       .opacity(1);
     }
+
     &:after {
       display: none;
     }
   }
+
   &.plain {
     font-size: inherit;
     border-width: 0;
     background-color: transparent;
   }
+
   &.ghost {
     font-size: inherit;
     background-color: transparent;
   }
+
   &.button-common {
     &, & .b-font:before {
       color: @color-bi-text-common-button;
     }
+
     &.light {
       border-width: 0;
       background-color: @color-bi-background-common-light-button;
@@ -65,81 +77,101 @@ body .bi-button, #body .bi-button {
         background-color: @color-bi-background-active-common-light-button;
       }
     }
+
     &.clear, &.clear .b-font:before {
       color: @color-bi-text-common-clear-button;
     }
+
     &.plain, &.plain .b-font:before {
       background-color: transparent;
       color: @color-bi-text-common-plain-button;
     }
+
     &.plain {
       &:hover {
         background-color: @color-bi-background-hover-plain-button;
       }
+
       &:focus {
         background-color: @color-bi-background-active-plain-button;
       }
     }
+
     &.ghost {
       &, & .b-font:before {
         color: @color-bi-text-common-ghost-button;
       }
+
       &:hover, &:focus, &:hover .b-font:before, &:focus .b-font:before {
         color: @color-bi-text;
         background-color: @color-bi-background-hover-common-ghost-button;
       }
+
       &:active {
         background-color: @color-bi-background-active-common-ghost-button;
       }
     }
   }
+
   &.button-ignore {
     & {
       background-color: @color-bi-background-ignore-button;
+
       &:not(.clear, .ghost) {
         border-color: @color-bi-border-ignore-button;
       }
     }
+
     &:not(.clear, .ghost) {
       &, & .b-font:before {
         color: @color-bi-text-ignore-button;
       }
     }
+
     &.clear {
       background-color: transparent;
       border-width: 0;
     }
+
     &.ghost {
       &:hover, &:focus {
         border-color: @color-bi-border-ignore-button;
+
         &, & .b-font:before {
           color: @color-bi-text-ignore-button;
         }
       }
+
       background-color: transparent;
       border-color: @color-bi-border-dark-gray-line;
     }
+
     &.plain, &.plain .b-font:before {
       background-color: transparent;
       color: @color-bi-text-ignore-plain-button;
     }
+
     &.plain {
       &:hover {
         background-color: @color-bi-background-hover-plain-button;
       }
+
       &:focus {
         background-color: @color-bi-background-active-plain-button;
       }
     }
   }
+
   &.button-success {
     & {
       &, & .b-font:before {
         color: @color-bi-text-success-button;
       }
+
       background-color: @color-bi-background-success-button;
       border-color: @color-bi-border-success-button;
     }
+
     &.light {
       border-width: 0;
       background-color: @color-bi-background-success-light-button;
@@ -156,47 +188,59 @@ body .bi-button, #body .bi-button {
         background-color: @color-bi-background-active-success-light-button;
       }
     }
+
     &.clear {
       &, & .b-font:before {
         color: @color-bi-text-success-clear-button;
       }
+
       background-color: transparent;
       border-width: 0;
     }
+
     &.ghost {
       &, & .b-font:before {
         color: @color-bi-text-success-ghost-button;
       }
+
       background-color: transparent;
+
       &:hover, &:focus, &:hover .b-font:before, &:focus .b-font:before {
         color: @color-bi-text;
         background-color: @color-bi-background-success-button;
       }
+
       &:active {
         background-color: @color-bi-background-success-button;
       }
     }
+
     &.plain, &.plain .b-font:before {
       background-color: transparent;
       color: @color-bi-text-success-plain-button;
     }
+
     &.plain {
       &:hover {
         background-color: @color-bi-background-hover-plain-button;
       }
+
       &:focus {
         background-color: @color-bi-background-active-plain-button;
       }
     }
   }
+
   &.button-warning {
     & {
       &, & .b-font:before {
         color: @color-bi-text-warning-button;
       }
+
       background-color: @color-bi-background-warning-button;
       border-color: @color-bi-border-warning-button;
     }
+
     &.light {
       border-width: 0;
       background-color: @color-bi-background-warning-light-button;
@@ -213,47 +257,59 @@ body .bi-button, #body .bi-button {
         background-color: @color-bi-background-active-warning-light-button;
       }
     }
+
     &.clear {
       &, & .b-font:before {
         color: @color-bi-text-warning-clear-button;
       }
+
       background-color: transparent;
       border-width: 0;
     }
+
     &.ghost {
       &, & .b-font:before {
         color: @color-bi-text-warning-ghost-button;
       }
+
       background-color: transparent;
+
       &:hover, &:focus, &:hover .b-font:before, &:focus .b-font:before {
         color: @color-bi-text;
         background-color: @color-bi-background-warning-button;
       }
+
       &:active {
         background-color: @color-bi-background-warning-button;
       }
     }
+
     &.plain, &.plain .b-font:before {
       background-color: transparent;
       color: @color-bi-text-warning-plain-button;
     }
+
     &.plain {
       &:hover {
         background-color: @color-bi-background-hover-plain-button;
       }
+
       &:focus {
         background-color: @color-bi-background-active-plain-button;
       }
     }
   }
+
   &.button-error {
     & {
       &, & .b-font:before {
         color: @color-bi-text-error-button;
       }
+
       background-color: @color-bi-background-error-button;
       border-color: @color-bi-border-error-button;
     }
+
     &.light {
       border-width: 0;
       background-color: @color-bi-background-error-light-button;
@@ -270,39 +326,49 @@ body .bi-button, #body .bi-button {
         background-color: @color-bi-background-active-error-light-button;
       }
     }
+
     &.clear {
       &, & .b-font:before {
         color: @color-bi-text-error-clear-button;
       }
+
       background-color: transparent;
       border-width: 0;
     }
+
     &.ghost {
       &, & .b-font:before {
         color: @color-bi-text-error-ghost-button;
       }
+
       background-color: transparent;
+
       &:hover, &:focus, &:hover .b-font:before, &:focus .b-font:before {
         color: @color-bi-text;
         background-color: @color-bi-background-error-button;
       }
+
       &:active {
         background-color: @color-bi-background-error-button;
       }
     }
+
     &.plain, &.plain .b-font:before {
       background-color: transparent;
       color: @color-bi-text-error-plain-button;
     }
+
     &.plain {
       &:hover {
         background-color: @color-bi-background-hover-plain-button;
       }
+
       &:focus {
         background-color: @color-bi-background-active-plain-button;
       }
     }
   }
+
   &.button-common.disabled,
   &.button-success.disabled,
   &.button-error.disabled,
@@ -311,25 +377,30 @@ body .bi-button, #body .bi-button {
       &, & .b-font:before {
         color: @color-bi-text-disabled-button !important;
       }
+
       background-color: fade(@color-bi-background-disabled-button, 20%) !important;
       @ieColor: argb(fade(@color-bi-background-disabled-button, 20%));
-      filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr=@{ieColor},endColorstr=@{ieColor})";
       border-color: @color-bi-border-disabled-button !important;
     }
+
     &:after {
       display: none;
     }
   }
+
   &.button-ignore.disabled {
     &, & .b-font:before {
       color: @color-bi-text-disabled-ignore-button !important;
     }
+
     background: @color-bi-background-disabled-ignore-button !important;
     border-color: @color-bi-border-disabled-ignore-button !important;
+
     &:after {
       display: none;
     }
   }
+
   &.button-common.disabled,
   &.button-success.disabled,
   &.button-warning.disabled,
@@ -339,65 +410,81 @@ body .bi-button, #body .bi-button {
       &, & .b-font:before {
         color: @color-bi-text-disabled-ignore-clear-button !important;
       }
+
       background: transparent !important;
       border-width: 0 !important;
+
       &:hover, &:focus, &:active {
         .opacity(1);
       }
     }
+
     &.plain {
       &, & .b-font:before {
         color: @color-bi-text-disabled-plain-clear-button !important;
       }
+
       background: transparent !important;
       border-width: 0 !important;
+
       &:hover, &:focus, &:active {
         .opacity(1);
       }
     }
+
     &.ghost {
       &, & .b-font:before {
         // color: @color-bi-text-disabled-ignore-ghost-button !important;
       }
+
       background: transparent !important;
       // border-color: @color-bi-border-disabled-ignore-ghost-button !important;
       .opacity(0.5);
     }
   }
+
   &.button-ignore.disabled {
     &.ghost {
       .opacity(1);
     }
   }
+
   &.button-common.disabled {
     &.ghost {
       &, & .b-font:before {
         color: @color-bi-text-disabled-common-ghost-button !important;
       }
+
       border-color: @color-bi-border-disabled-common-ghost-button !important;
     }
   }
+
   &.button-success.disabled {
     &.ghost {
       &, & .b-font:before {
         color: @color-bi-text-disabled-success-ghost-button !important;
       }
+
       border-color: @color-bi-border-disabled-success-ghost-button !important;
     }
   }
+
   &.button-warning.disabled {
     &.ghost {
       &, & .b-font:before {
         color: @color-bi-text-disabled-warning-ghost-button !important;
       }
+
       border-color: @color-bi-border-disabled-warning-ghost-button !important;
     }
   }
+
   &.button-error.disabled {
     &.ghost {
       &, & .b-font:before {
         color: @color-bi-text-disabled-error-ghost-button !important;
       }
+
       border-color: @color-bi-border-disabled-error-ghost-button !important;
     }
   }
@@ -424,14 +511,17 @@ body .bi-button, #body .bi-button {
       top: 0;
       pointer-events: none;
     }
+
     &.hack:after {
       content: none;
     }
+
     &:active:after {
       transform: scale(0, 1);
       .opacity(0.1);
       .transition(@activeStopVal)
     }
+
     &:hover, &:focus {
       & .bi-button-mask {
         .opacity(0.1);
@@ -440,6 +530,7 @@ body .bi-button, #body .bi-button {
       }
     }
   }
+
   &.button-ignore {
     &:after {
       content: "";
@@ -456,24 +547,30 @@ body .bi-button, #body .bi-button {
       top: 0;
       pointer-events: none;
     }
+
     &.hack:after {
       content: none;
     }
+
     &:active:after {
       transform: scale(0, 1);
       .opacity(0.1);
       .transition(@activeStopVal)
     }
+
     &:hover, &:focus {
       &:not(.clear, .ghost) {
         background-color: @color-bi-background-hover-ignore-button-mask;
       }
+
       .transition(@hoverVal);
     }
   }
-  & .popup-content{
+
+  & .popup-content {
     font-size: @font-size-14;
   }
+
   .bi-button-mask {
     pointer-events: none;
   }
@@ -483,15 +580,19 @@ body .bi-button, #body .bi-button {
   .bi-button {
     &.button-ignore {
       background-color: @color-bi-background-ignore-button-theme-dark;
+
       &:hover, &:focus {
         background-color: @color-bi-background-hover-ignore-button-theme-dark;
       }
+
       &:active {
         background-color: @color-bi-background-active-ignore-button-theme-dark;
       }
+
       &.clear {
         background-color: transparent;
       }
+
       &.ghost {
         border-color: @color-bi-border-dark-gray-line-theme-dark;
       }
@@ -506,31 +607,36 @@ body .bi-button, #body .bi-button {
         border-color: @color-bi-border-dark-gray-line-theme-dark !important;
         background-color: fade(@color-bi-background-disabled-button-theme-dark, 20%) !important;
         @ieColor: argb(fade(@color-bi-background-disabled-button-theme-dark, 20%));
-        filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr=@{ieColor},endColorstr=@{ieColor})";
 
         &.clear {
           background-color: transparent !important;
         }
+
         &.ghost {
           // 深色系下灰化就统一用灰化色
           &, & .b-font:before {
             color: @color-bi-text-disabled-theme-dark !important;
           }
+
           background: transparent !important;
           .opacity(1);
         }
       }
     }
+
     &.button-ignore.disabled {
       &, &.base-disabled {
         &, & .b-font:before {
           color: @color-bi-text-disabled-theme-dark !important;
         }
+
         border-color: @color-bi-border-dark-gray-line-theme-dark !important;
         background-color: @color-bi-background-ignore-button-theme-dark !important;
+
         &.clear {
           background-color: transparent !important;
         }
+
         &.ghost {
           background: transparent !important;
           .opacity(1);
diff --git a/packages/fineui/src/less/visual.less b/packages/fineui/src/less/visual.less
index 3c7601937..daaec256a 100644
--- a/packages/fineui/src/less/visual.less
+++ b/packages/fineui/src/less/visual.less
@@ -43,13 +43,11 @@
 .background-color(@color, @alpha) {
   background-color: fade(@color, @alpha);
   @ieColor: argb(fade(@color, @alpha));
-  filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr=@{ieColor},endColorstr=@{ieColor})";
 }
 
 .opacity(@opa) {
   opacity: @opa;
   @opa-ie: @opa*100;
-  filter: ~'alpha(opacity=@{opa-ie})';
 }
 
 .transition(@transition) {