fix: button 样式 primary 与 default

example/docs/zh-CN/components/button.md

@@ -14,7 +14,7 @@
 
 <template>
   <lay-button type="primary">原始按钮</lay-button>
-  <lay-button type="default">默认按钮</lay-button>
+  <lay-button>默认按钮</lay-button>
   <lay-button type="normal">百搭按钮</lay-button>
   <lay-button type="warm">暖色按钮</lay-button>
   <lay-button type="danger">警告按钮</lay-button>
@@ -40,12 +40,11 @@ export default {
 ::: demo 使用 `border` 属性设置边框主题
 
 <template>
-  <lay-button type="primary">原始按钮</lay-button>
+  <lay-button>原始按钮</lay-button>
-  <lay-button type="primary" border="green">默认按钮</lay-button>
+  <lay-button border="green">默认按钮</lay-button>
-  <lay-button type="primary" border="blue">百搭按钮</lay-button>
+  <lay-button border="blue">百搭按钮</lay-button>
-  <lay-button type="primary" border="orange">暖色按钮</lay-button>
+  <lay-button border="orange">暖色按钮</lay-button>
-  <lay-button type="primary" border="red">警告按钮</lay-button>
+  <lay-button border="red">警告按钮</lay-button>
-  <lay-button type="primary" border="black">禁用按钮</lay-button>
 </template>
 
 <script>

example/src/layouts/Layout.vue

@@ -51,7 +51,11 @@
                 <lay-icon
                   size="15px"
                   type="layui-icon-theme"
-                  style="color: rgba(255, 255, 255, 0.7);padding-left: 30px;padding-right: 30px;"
+                  style="
+                    color: rgba(255, 255, 255, 0.7);
+                    padding-left: 30px;
+                    padding-right: 30px;
+                  "
                 ></lay-icon>
               </a>
               <template #content>
@@ -139,6 +143,24 @@
               >
             </a>
           </li>
+          <li class="layui-nav-item">
+            <a href="javascript:void(0)">
+              <lay-badge
+                type="rim"
+                class="layui-local-badge"
+                v-if="isDark"
+                @click="toggleDark"
+                >白天</lay-badge
+              >
+              <lay-badge
+                type="rim"
+                class="layui-local-badge"
+                v-else
+                @click="toggleDark"
+                >黑夜</lay-badge
+              >
+            </a>
+          </li>
           <li class="layui-nav-item">
             <a href="https://gitee.com/layui-vue/layui-vue/issues">
               <lay-icon type="layui-icon-chat" size="15px"></lay-icon>
@@ -160,6 +182,8 @@ import menu from "../view/utils/menus";
 import { useI18n } from "vue-i18n";
 import zh_CN from "../locales/zh_CN.ts";
 import en_US from "../locales/en_US.ts";
+import { useDark, useToggle } from "@vueuse/core";
+
 export default {
   setup() {
     const { t } = useI18n();
@@ -197,6 +221,9 @@ export default {
       });
     });
 
+    const isDark = useDark();
+    const toggleDark = useToggle(isDark);
+
     watch(
       () => route.path,
       (val) => {
@@ -219,6 +246,8 @@ export default {
       theme,
       locale,
       locales,
+      isDark,
+      toggleDark,
       currentPath,
       handleClick,
       changeLocale,
@@ -229,7 +258,6 @@ export default {
 </script>
 
 <style>
-
 .layui-layout-document > .layui-header {
   z-index: 9999;
   width: 100%;

src/component/button/index.less

@@ -20,25 +20,21 @@
   height: 38px;
   line-height: 36px;
   padding: 0 18px;
-  color: #fff;
   font-size: 14px;
   text-align: center;
   white-space: nowrap;
-  border: 1px solid transparent;
-  background-color: @button-primary-color;
   border-radius: @button-border-radius;
+  border-color: @button-border-color;
+  border-width: 1px;
+  border-style: solid;
+  background: 0 0;
+  color: #666;
   cursor: pointer;
 }
 
-.layui-btn:hover {
+.layui-btn:hover,
-  color: #fff;
-  opacity: 0.8;
-  filter: alpha(opacity=80);
-}
-
 .layui-btn:active {
-  opacity: 1;
+  color: #333;
-  filter: alpha(opacity=100);
 }
 
 .layui-btn + .layui-btn {
@@ -56,25 +52,36 @@
 }
 
 .layui-btn-primary {
-  border-color: @button-border-color;
+  color: #fff;
-  background: 0 0;
+  background-color: @button-primary-color;
-  color: #666;
+  border-color: @button-primary-color;
-}
-
-.layui-btn-primary:hover {
-  color: #333;
 }
 
 .layui-btn-normal {
+  color: #fff;
   background-color: @button-normal-color;
+  border-color: @button-normal-color;
 }
 
 .layui-btn-warm {
+  color: #fff;
   background-color: @button-warm-color;
+  border-color: @button-warm-color;
 }
 
 .layui-btn-danger {
+  color: #fff;
   background-color: @button-danger-color;
+  border-color: @button-danger-color;
+}
+
+.layui-btn-primary:hover,
+.layui-btn-normal:hover,
+.layui-btn-warm:hover,
+.layui-btn-danger:hover {
+  color: #fff;
+  opacity: 0.8;
+  filter: alpha(opacity=80);
 }
 
 .layui-btn-lg {

src/component/table/index.vue

@@ -14,7 +14,6 @@ import LayDropdown from "../dropdown";
 import LayPage from "../page";
 import LayIcon from "../icon";
 import "./index.less";
-import { AnyARecord } from "dns";
 
 const tableId = guid();
 
@@ -102,6 +101,7 @@ const rowDoubleClick = function (data: any) {
   emit("row-double", data);
 };
 
+// 打印 table 数据
 const print = function () {
   let subOutputRankPrint = document.getElementById(tableId) as HTMLElement;
   let newContent = subOutputRankPrint.innerHTML;
@@ -112,6 +112,7 @@ const print = function () {
   document.body.innerHTML = oldContent;
 };
 
+// 导出 table 数据
 const exportData = () => {
   const wb = XLSX.utils.book_new();
   let arr: any[] = [];

src/theme/public.less

@@ -1 +0,0 @@
-/** public.css 公共样式 */

src/theme/variable.less

@@ -63,15 +63,27 @@
   --global-neutral-color-7: #cccccc;
   
   --global-neutral-color-8: #c2c2c2;
-  
 }
 
 body[lay-theme="dark"] {
 
-  --global-border-color: #d2d2d2;
-
   --global-fore-color: #ffffff;
 
   --global-back-color: #393d49;
 
+  --global-neutral-color-1: #FAFAFA;
+
+  --global-neutral-color-2: #F6F6F6;
+  
+  --global-neutral-color-3: #eeeeee;
+  
+  --global-neutral-color-4: #e2e2e2;
+  
+  --global-neutral-color-5: #dddddd;
+  
+  --global-neutral-color-6: #d2d2d2;
+  
+  --global-neutral-color-7: #cccccc;
+  
+  --global-neutral-color-8: #c2c2c2;
 }