From 55bc3ae6af2ffe451884cc562b5525a2f099930e Mon Sep 17 00:00:00 2001
From: treecat <treecat@fanruan.com>
Date: Fri, 17 Jun 2022 13:53:57 +0800
Subject: [PATCH 1/3] =?UTF-8?q?DESIGN-4069=20feat:=20=E7=BB=99=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E5=A2=9E=E5=8A=A0=E4=B8=80=E7=BB=84=E7=82=B9=E5=87=BB?=
 =?UTF-8?q?=E6=95=88=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 demo/js/base/button/demo.button.js | 61 ++++++++++++++++++++++++++++++
 src/less/core/utils/list-item.less | 24 ++++++++++++
 2 files changed, 85 insertions(+)

diff --git a/demo/js/base/button/demo.button.js b/demo/js/base/button/demo.button.js
index 6098389e7..6ddd6c203 100644
--- a/demo/js/base/button/demo.button.js
+++ b/demo/js/base/button/demo.button.js
@@ -309,6 +309,67 @@ Demo.Button = BI.inherit(BI.Widget, {
                 cls: "hover-mask",
                 light: true
             }
+        }, {
+            el: {
+                type: "bi.button",
+                width: 24,
+                height: 24,
+                clear: true,
+                level: "error",
+                iconCls: "search-font",
+                cls: "bi-list-item-select4"
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                width: 24,
+                height: 24,
+                clear: true,
+                level: "warning",
+                iconCls: "search-font",
+                cls: "bi-list-item-select4"
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                width: 24,
+                height: 24,
+                clear: true,
+                level: "common",
+                iconCls: "search-font",
+                cls: "bi-list-item-select4"
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                width: 24,
+                height: 24,
+                clear: true,
+                level: "ignore",
+                iconCls: "search-font",
+                cls: "bi-list-item-select4"
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                width: 24,
+                height: 24,
+                clear: true,
+                level: "success",
+                iconCls: "search-font",
+                cls: "bi-list-item-select4"
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                height: 24,
+                width: 200,
+                clear: true,
+                text: "拥有悬浮效果的文字按钮",
+                level: "success",
+                iconCls: "search-font",
+                cls: "bi-list-item-select4"
+            }
         }];
         // BI.each(items, function (i, item) {
         //     item.el.handler = function () {
diff --git a/src/less/core/utils/list-item.less b/src/less/core/utils/list-item.less
index c084ac275..785084c41 100644
--- a/src/less/core/utils/list-item.less
+++ b/src/less/core/utils/list-item.less
@@ -383,6 +383,30 @@
   }
 }
 
+.bi-list-item-select4 {
+  &:hover {
+    .background-color(@color-black, 4%);
+  }
+
+  &.active {
+    .background-color(@color-black, 8%);
+  }
+
+  &.bi-button.button-error.clear,
+  &.bi-button.button-warning.clear,
+  &.bi-button.button-common.clear,
+  &.bi-button.button-success.clear,
+  &.bi-button.button-ignore.clear {
+    &:hover {
+      .background-color(@color-black, 4%);
+    }
+
+    &.active {
+      .background-color(@color-black, 8%);
+    }
+  }
+}
+
 // hover的时候背景变化
 // active的时候背景高亮
 .bi-list-item-select {

From d9c2af16aaf3e0d3773bfbb85c44cad9146d5e12 Mon Sep 17 00:00:00 2001
From: treecat <treecat@fanruan.com>
Date: Fri, 17 Jun 2022 16:35:12 +0800
Subject: [PATCH 2/3] =?UTF-8?q?Revert=20"DESIGN-4069=20feat:=20=E7=BB=99?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=E5=A2=9E=E5=8A=A0=E4=B8=80=E7=BB=84=E7=82=B9?=
 =?UTF-8?q?=E5=87=BB=E6=95=88=E6=9E=9C"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This reverts commit 55bc3ae6af2ffe451884cc562b5525a2f099930e.
---
 demo/js/base/button/demo.button.js | 61 ------------------------------
 src/less/core/utils/list-item.less | 24 ------------
 2 files changed, 85 deletions(-)

diff --git a/demo/js/base/button/demo.button.js b/demo/js/base/button/demo.button.js
index 6ddd6c203..6098389e7 100644
--- a/demo/js/base/button/demo.button.js
+++ b/demo/js/base/button/demo.button.js
@@ -309,67 +309,6 @@ Demo.Button = BI.inherit(BI.Widget, {
                 cls: "hover-mask",
                 light: true
             }
-        }, {
-            el: {
-                type: "bi.button",
-                width: 24,
-                height: 24,
-                clear: true,
-                level: "error",
-                iconCls: "search-font",
-                cls: "bi-list-item-select4"
-            }
-        }, {
-            el: {
-                type: "bi.button",
-                width: 24,
-                height: 24,
-                clear: true,
-                level: "warning",
-                iconCls: "search-font",
-                cls: "bi-list-item-select4"
-            }
-        }, {
-            el: {
-                type: "bi.button",
-                width: 24,
-                height: 24,
-                clear: true,
-                level: "common",
-                iconCls: "search-font",
-                cls: "bi-list-item-select4"
-            }
-        }, {
-            el: {
-                type: "bi.button",
-                width: 24,
-                height: 24,
-                clear: true,
-                level: "ignore",
-                iconCls: "search-font",
-                cls: "bi-list-item-select4"
-            }
-        }, {
-            el: {
-                type: "bi.button",
-                width: 24,
-                height: 24,
-                clear: true,
-                level: "success",
-                iconCls: "search-font",
-                cls: "bi-list-item-select4"
-            }
-        }, {
-            el: {
-                type: "bi.button",
-                height: 24,
-                width: 200,
-                clear: true,
-                text: "拥有悬浮效果的文字按钮",
-                level: "success",
-                iconCls: "search-font",
-                cls: "bi-list-item-select4"
-            }
         }];
         // BI.each(items, function (i, item) {
         //     item.el.handler = function () {
diff --git a/src/less/core/utils/list-item.less b/src/less/core/utils/list-item.less
index 785084c41..c084ac275 100644
--- a/src/less/core/utils/list-item.less
+++ b/src/less/core/utils/list-item.less
@@ -383,30 +383,6 @@
   }
 }
 
-.bi-list-item-select4 {
-  &:hover {
-    .background-color(@color-black, 4%);
-  }
-
-  &.active {
-    .background-color(@color-black, 8%);
-  }
-
-  &.bi-button.button-error.clear,
-  &.bi-button.button-warning.clear,
-  &.bi-button.button-common.clear,
-  &.bi-button.button-success.clear,
-  &.bi-button.button-ignore.clear {
-    &:hover {
-      .background-color(@color-black, 4%);
-    }
-
-    &.active {
-      .background-color(@color-black, 8%);
-    }
-  }
-}
-
 // hover的时候背景变化
 // active的时候背景高亮
 .bi-list-item-select {

From 667c9bb3039b690cf0ea4547e289c2e4d043c916 Mon Sep 17 00:00:00 2001
From: treecat <treecat@fanruan.com>
Date: Mon, 20 Jun 2022 16:11:46 +0800
Subject: [PATCH 3/3] =?UTF-8?q?DESIGN-4069=20feat:=20=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E4=BA=86=E4=B8=80=E7=BB=84=20plain=20=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 demo/js/base/button/demo.button.js       | 67 +++++++++++++++++++++
 src/base/single/button/buttons/button.js |  4 ++
 src/less/base/single/button/button.less  | 75 ++++++++++++++++++++++++
 src/less/lib/theme.less                  |  8 +++
 4 files changed, 154 insertions(+)

diff --git a/demo/js/base/button/demo.button.js b/demo/js/base/button/demo.button.js
index 6098389e7..400559566 100644
--- a/demo/js/base/button/demo.button.js
+++ b/demo/js/base/button/demo.button.js
@@ -309,6 +309,73 @@ Demo.Button = BI.inherit(BI.Widget, {
                 cls: "hover-mask",
                 light: true
             }
+        }, {
+            el: {
+                type: "bi.button",
+                iconCls: "plus-font",
+                text: "朴素的按钮",
+                level: "common",
+                plain: true
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                iconCls: "plus-font",
+                text: "朴素的按钮",
+                level: "success",
+                plain: true
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                iconCls: "plus-font",
+                text: "朴素的按钮",
+                level: "error",
+                plain: true
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                iconCls: "plus-font",
+                text: "朴素的按钮",
+                level: "warning",
+                plain: true
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                iconCls: "plus-font",
+                text: "朴素的按钮",
+                level: "ignore",
+                plain: true
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                iconCls: "plus-font",
+                text: "朴素的按钮",
+                level: "ignore",
+                plain: true,
+                disabled: true
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                iconCls: "plus-font",
+                text: "朴素的按钮",
+                level: "error",
+                plain: true,
+                disabled: true
+            }
+        }, {
+            el: {
+                type: "bi.button",
+                iconCls: "plus-font",
+                text: "朴素的按钮",
+                level: "common",
+                plain: true,
+                disabled: true
+            }
         }];
         // BI.each(items, function (i, item) {
         //     item.el.handler = function () {
diff --git a/src/base/single/button/buttons/button.js b/src/base/single/button/buttons/button.js
index 1eb9c0f22..78e910f7c 100644
--- a/src/base/single/button/buttons/button.js
+++ b/src/base/single/button/buttons/button.js
@@ -38,6 +38,7 @@
                 ghost: false, // 是否幽灵显示, 即正常状态无背景
                 loading: false, // 是否处于加载中
                 light: false, // 是否使用浅色
+                plain: false, // 是否是朴素按钮，和 clear 的区别是 plain 有悬浮效果
                 textAlign: "center",
                 whiteSpace: "nowrap",
                 textWidth: null,
@@ -144,6 +145,9 @@
             if (o.ghost === true) {
                 this.element.addClass("ghost");
             }
+            if (o.plain === true) {
+                this.element.addClass("plain");
+            }
             if (o.loading === true) {
                 this.element.addClass("loading");
             }
diff --git a/src/less/base/single/button/button.less b/src/less/base/single/button/button.less
index f6f24bfa6..210bc4e89 100644
--- a/src/less/base/single/button/button.less
+++ b/src/less/base/single/button/button.less
@@ -33,6 +33,11 @@ body .bi-button, #body .bi-button {
       display: none;
     }
   }
+  &.plain {
+    font-size: inherit;
+    border-width: 0;
+    background-color: transparent;
+  }
   &.ghost {
     font-size: inherit;
     background-color: transparent;
@@ -60,6 +65,18 @@ body .bi-button, #body .bi-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;
@@ -99,6 +116,18 @@ body .bi-button, #body .bi-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 {
     & {
@@ -144,6 +173,18 @@ body .bi-button, #body .bi-button {
         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 {
     & {
@@ -189,6 +230,18 @@ body .bi-button, #body .bi-button {
         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 {
     & {
@@ -234,6 +287,18 @@ body .bi-button, #body .bi-button {
         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,
@@ -277,6 +342,16 @@ body .bi-button, #body .bi-button {
         .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;
diff --git a/src/less/lib/theme.less b/src/less/lib/theme.less
index 87d578943..ae3fd45bb 100644
--- a/src/less/lib/theme.less
+++ b/src/less/lib/theme.less
@@ -64,6 +64,7 @@
 @color-bi-background-button: @color-bi-background-highlight;
 @color-bi-text-common-button: @color-bi-text;
 @color-bi-text-common-clear-button: @color-bi-text-highlight;
+@color-bi-text-common-plain-button: @color-bi-text-highlight;
 @color-bi-text-common-ghost-button: @color-bi-text-highlight;
 @color-bi-text-common-ghost-button-theme-dark: @color-bi-text;
 @color-bi-text-disabled-common-ghost-button-theme-dark: @color-bi-text;
@@ -77,10 +78,13 @@
 @color-bi-background-common-light-button: @color-bi-background-light-blue;
 @color-bi-background-hover-common-light-button: @color-bi-background-light-blue;
 @color-bi-background-active-common-light-button: @color-bi-background-light-blue;
+@color-bi-background-hover-plain-button: @color-black-5;
+@color-bi-background-active-plain-button: @color-black-10;
 
 @color-bi-background-active-common-ghost-button: @color-bi-background-highlight;
 @color-bi-background-active-common-ghost-button-theme-dark: @color-bi-background-default;
 @color-bi-text-ignore-button: @color-bi-text-highlight;
+@color-bi-text-ignore-plain-button: @background-color-light-black;
 @color-bi-border-ignore-button: @color-bi-border-highlight;
 @color-bi-background-ignore-button: @color-bi-background-default;
 @color-bi-background-ignore-button-theme-dark: @color-bi-background-default-theme-dark;
@@ -91,6 +95,7 @@
 @color-bi-background-success-button: @color-bi-background-success;
 @color-bi-border-success-button: @color-bi-border-success;
 @color-bi-text-success-clear-button: @color-bi-text-success;
+@color-bi-text-success-plain-button: @color-bi-text-success;
 @color-bi-text-success-ghost-button: @color-bi-text-success;
 @color-bi-text-success-light-button: @color-bi-text-success;
 @color-bi-background-success-light-button: @color-bi-background-light-success;
@@ -98,6 +103,7 @@
 @color-bi-background-active-success-light-button: @color-bi-background-light-success;
 
 @color-bi-text-warning-button: @color-bi-text;
+@color-bi-text-warning-plain-button:  @color-bi-text-redmark;
 @color-bi-text-warning-light-button: @color-bi-text-redmark;
 @color-bi-background-warning-light-button: @color-bi-background-light-warning;
 @color-bi-background-hover-warning-light-button: @color-bi-background-light-warning;
@@ -115,6 +121,7 @@
 @color-bi-background-hover-error-light-button: @color-bi-background-light-failure;
 @color-bi-background-active-error-light-button: @color-bi-background-light-failure;
 @color-bi-border-error-button: @color-bi-border-failure;
+@color-bi-text-error-plain-button: @color-bi-text-failure;
 @color-bi-text-error-clear-button: @color-bi-text-failure;
 @color-bi-text-error-ghost-button: @color-bi-text-failure;
 @color-bi-text-disabled-button: @color-bi-text-disabled;
@@ -124,6 +131,7 @@
 @color-bi-background-disabled-ignore-button: @color-bi-background-default;
 @color-bi-border-disabled-ignore-button: @color-bi-border-line;
 @color-bi-text-disabled-ignore-clear-button: @color-bi-text-disabled;
+@color-bi-text-disabled-plain-clear-button: @color-bi-text-disabled;
 @color-bi-text-disabled-common-ghost-button: @color-bi-text-highlight;
 @color-bi-border-disabled-common-ghost-button: @color-bi-border-highlight;
 @color-bi-text-disabled-success-ghost-button: @color-bi-text-success;