docs: 文档 dark 主题适配

example/src/components/LayAnchor.vue

@@ -236,6 +236,7 @@ const throttle = (func: Function, wait: number) => {
   box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
   transition: none;
   -webkit-transition: none;
+  color: rgba(0, 0, 0, 0.8);
   &:hover {
     background-color: #e2e2e2;
   }

example/src/layouts/Layout.vue

@@ -8,7 +8,7 @@
     <lay-layout class="layui-layout-document" style="height:100%">
       <lay-header
         ><lay-logo>
-          <img src="../assets/logo-png.png" />
+          <img src="../assets/logo-png.png" /><span style="margin-left:12px;font-size:20px;color: #213547;letter-spacing: -0.2px;opacity: 0.8;">layui - vue</span>
         </lay-logo>
         <ul
           class="layui-nav layui-layout-left"
@@ -116,7 +116,7 @@
           </li>
           <li class="layui-nav-item">
             <a href="https://gitee.com/layui-vue/layui-vue">
-              <lay-icon type="layui-icon-fonts-code" size="15px"></lay-icon>
+              Gitee
             </a>
           </li>
           <li class="layui-nav-item">
@@ -201,7 +201,7 @@
             </a>
           </li>
           <li class="layui-nav-item">
-            <a href="javascript:void(0)"> 0.4.4 </a>
+            <a href="javascript:void(0)"> 1.0.0 </a>
           </li>
         </ul>
       </lay-header>
@@ -326,11 +326,16 @@ export default {
   background-color: #f1f1f1!important;
 }
 
-.layui-layout-document .layui-nav .layui-nav-item > a,
-.layui-layout-document .layui-nav .layui-nav-item > a:hover {
+.layui-layout-document .layui-header .layui-nav .layui-nav-item > a,
+.layui-layout-document .layui-header .layui-nav .layui-nav-item > a:hover {
   color: rgba(0, 0, 0, 0.8);
 }
 
+.layui-layout-document .layui-header .layui-logo {
+  text-align: left;
+  padding-left: 15px;
+}
+
 .layui-logo img {
   height: 45px;
   left: 15px;

example/src/view/index.vue

@@ -20,7 +20,7 @@
           >
         </div>
         <div class="site-version">
-          <span>{{ t('home.version') }}：<cite class="site-showv">0.4.4</cite></span>
+          <span>{{ t('home.version') }}：<cite class="site-showv">1.0.0</cite></span>
           <span>{{ t('home.download') }}：<em class="site-showdowns">5463</em></span>
         </div>
       </div>
@@ -51,7 +51,7 @@
         </a>
       </div>
     </div>
-    <div style="margin-left: 10%; margin-right: 10%">
+    <div style="margin-left: 10%; margin-right: 10%;margin-top:40px;">
       <div>
         <ul class="layui-row layui-col-space30 site-idea">
           <li class="layui-col-md8">
@@ -92,10 +92,11 @@
     </div>
     <div class="footer footer-index">
       <p>
-        Copyright © 2022 <a href="/index.html">www.layui-vue.com</a> mit
-        licence
+        Released under the <a href="/index.html">MIT License</a>.
+      </p>
+      <p>
+        Copyright © 2021-2022 layui-vue.com
       </p>
-      <p></p>
     </div>
   </div>
 </template>
@@ -119,7 +120,6 @@ html,
 body {
   height: 100%;
 }
-
 .site-container {
   background: #fff;
   margin-top: 60px;
@@ -127,18 +127,19 @@ body {
   width: 100%;
 }
 .site-banner {
-  border-bottom: 1px solid #eee;
-  position: relative;
   height: 100%;
-  text-align: center;
   overflow: hidden;
+  text-align: center;
+  position: relative;
+  border-bottom: 1px solid #eee;
   background-image: url(../assets/background.svg);
-  background-size: 100%;
   background-repeat: no-repeat;
+  background-size: 100%;
 }
 .site-banner-bg {
   background-position: center 0;
 }
+
 .site-banner-bg,
 .site-banner-main {
   position: absolute;
@@ -200,12 +201,17 @@ body {
 }
 .site-desc .web-font-desc {
   color: #fff;
-  color: rgba(60, 60, 60, .7);
-  font-size: 51px;
+  color: #213547;
+  font-size: 52px;
+  opacity: 0.9;
 }
 .web-font-desc {
-  font-style: normal;
-  font-weight: 300;
+  font-size: 76px;
+  line-height: 1.25;
+  font-weight: 900;
+  letter-spacing: -1.5px;
+  max-width: 960px;
+  margin: 0 auto;
 }
 .site-desc cite {
   position: absolute;
@@ -235,7 +241,7 @@ body {
 .site-banner-other {
   position: absolute;
   left: 0;
-  bottom: 35px;
+  bottom: 90px;
   width: 100%;
   text-align: center;
   font-size: 0;
@@ -259,7 +265,9 @@ body {
   padding: 30px 15px;
   line-height: 30px;
   text-align: center;
-  color: #666;
+  color: rgba(60, 60, 60, .7);
   font-weight: 300;
+  font-size: 13.6px;
+  background: #f9f9f9;
 }
 </style>

src/component/checkbox/index.vue

@@ -105,7 +105,7 @@ const handleClick = function () {
       :lay-skin="skin"
     >
       <span v-if="$slots?.default"><slot></slot></span>
-      <i :class="{'layui-icon layui-icon-ok': isChecked}"></i>
+      <i :class="{ 'layui-icon layui-icon-ok': isChecked }"></i>
     </div>
   </span>
 </template>

src/provider/index.vue

@@ -40,20 +40,26 @@ const changeLocales = (lang: string, locales: any, merge: boolean) => {
 
 const changeTheme = (theme: string) => {
   if (theme === "dark") {
-    enableDarkMode({
-      mode: 1,
-      brightness: 100,
-      contrast: 90,
-      sepia: 0,
-      // darkSchemeTextColor: 'rgba(255, 255, 255, 0.9)',
-      // darkSchemeBackgroundColor: '#22272E'
-    }, {
+    enableDarkMode(
+      {
+        mode: 1,
+        brightness: 100,
+        contrast: 90,
+        sepia: 0,
+        // darkSchemeTextColor: 'rgba(255, 255, 255, 0.9)',
+        // darkSchemeBackgroundColor: '#22272E'
+      },
+      {
         invert: [],
         css: ``,
-        ignoreInlineStyle: ['.layui-colorpicker-trigger-span','div.layui-color-picker *'],
+        ignoreInlineStyle: [
+          ".layui-colorpicker-trigger-span",
+          "div.layui-color-picker *",
+        ],
         ignoreImageAnalysis: [],
         disableStyleSheetsProxy: false,
-    });
+      }
+    );
   } else {
     disableDarkMode();
   }