docs: 文档 dark 主题适配
This commit is contained in:
parent
09a5502f54
commit
d31ef061ef
@ -236,6 +236,7 @@ const throttle = (func: Function, wait: number) => {
|
|||||||
box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
|
box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
|
||||||
transition: none;
|
transition: none;
|
||||||
-webkit-transition: none;
|
-webkit-transition: none;
|
||||||
|
color: rgba(0, 0, 0, 0.8);
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: #e2e2e2;
|
background-color: #e2e2e2;
|
||||||
}
|
}
|
||||||
|
@ -8,7 +8,7 @@
|
|||||||
<lay-layout class="layui-layout-document" style="height:100%">
|
<lay-layout class="layui-layout-document" style="height:100%">
|
||||||
<lay-header
|
<lay-header
|
||||||
><lay-logo>
|
><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>
|
</lay-logo>
|
||||||
<ul
|
<ul
|
||||||
class="layui-nav layui-layout-left"
|
class="layui-nav layui-layout-left"
|
||||||
@ -116,7 +116,7 @@
|
|||||||
</li>
|
</li>
|
||||||
<li class="layui-nav-item">
|
<li class="layui-nav-item">
|
||||||
<a href="https://gitee.com/layui-vue/layui-vue">
|
<a href="https://gitee.com/layui-vue/layui-vue">
|
||||||
<lay-icon type="layui-icon-fonts-code" size="15px"></lay-icon>
|
Gitee
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="layui-nav-item">
|
<li class="layui-nav-item">
|
||||||
@ -201,7 +201,7 @@
|
|||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="layui-nav-item">
|
<li class="layui-nav-item">
|
||||||
<a href="javascript:void(0)"> 0.4.4 </a>
|
<a href="javascript:void(0)"> 1.0.0 </a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</lay-header>
|
</lay-header>
|
||||||
@ -326,11 +326,16 @@ export default {
|
|||||||
background-color: #f1f1f1!important;
|
background-color: #f1f1f1!important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.layui-layout-document .layui-nav .layui-nav-item > a,
|
.layui-layout-document .layui-header .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:hover {
|
||||||
color: rgba(0, 0, 0, 0.8);
|
color: rgba(0, 0, 0, 0.8);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.layui-layout-document .layui-header .layui-logo {
|
||||||
|
text-align: left;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
.layui-logo img {
|
.layui-logo img {
|
||||||
height: 45px;
|
height: 45px;
|
||||||
left: 15px;
|
left: 15px;
|
||||||
|
@ -20,7 +20,7 @@
|
|||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="site-version">
|
<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>
|
<span>{{ t('home.download') }}:<em class="site-showdowns">5463</em></span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -51,7 +51,7 @@
|
|||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-left: 10%; margin-right: 10%">
|
<div style="margin-left: 10%; margin-right: 10%;margin-top:40px;">
|
||||||
<div>
|
<div>
|
||||||
<ul class="layui-row layui-col-space30 site-idea">
|
<ul class="layui-row layui-col-space30 site-idea">
|
||||||
<li class="layui-col-md8">
|
<li class="layui-col-md8">
|
||||||
@ -92,10 +92,11 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="footer footer-index">
|
<div class="footer footer-index">
|
||||||
<p>
|
<p>
|
||||||
Copyright © 2022 <a href="/index.html">www.layui-vue.com</a> mit
|
Released under the <a href="/index.html">MIT License</a>.
|
||||||
licence
|
</p>
|
||||||
|
<p>
|
||||||
|
Copyright © 2021-2022 layui-vue.com
|
||||||
</p>
|
</p>
|
||||||
<p></p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -119,7 +120,6 @@ html,
|
|||||||
body {
|
body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.site-container {
|
.site-container {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
margin-top: 60px;
|
margin-top: 60px;
|
||||||
@ -127,18 +127,19 @@ body {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
.site-banner {
|
.site-banner {
|
||||||
border-bottom: 1px solid #eee;
|
|
||||||
position: relative;
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
text-align: center;
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
background-image: url(../assets/background.svg);
|
background-image: url(../assets/background.svg);
|
||||||
background-size: 100%;
|
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
}
|
}
|
||||||
.site-banner-bg {
|
.site-banner-bg {
|
||||||
background-position: center 0;
|
background-position: center 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.site-banner-bg,
|
.site-banner-bg,
|
||||||
.site-banner-main {
|
.site-banner-main {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -200,12 +201,17 @@ body {
|
|||||||
}
|
}
|
||||||
.site-desc .web-font-desc {
|
.site-desc .web-font-desc {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
color: rgba(60, 60, 60, .7);
|
color: #213547;
|
||||||
font-size: 51px;
|
font-size: 52px;
|
||||||
|
opacity: 0.9;
|
||||||
}
|
}
|
||||||
.web-font-desc {
|
.web-font-desc {
|
||||||
font-style: normal;
|
font-size: 76px;
|
||||||
font-weight: 300;
|
line-height: 1.25;
|
||||||
|
font-weight: 900;
|
||||||
|
letter-spacing: -1.5px;
|
||||||
|
max-width: 960px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
.site-desc cite {
|
.site-desc cite {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -235,7 +241,7 @@ body {
|
|||||||
.site-banner-other {
|
.site-banner-other {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
bottom: 35px;
|
bottom: 90px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 0;
|
font-size: 0;
|
||||||
@ -259,7 +265,9 @@ body {
|
|||||||
padding: 30px 15px;
|
padding: 30px 15px;
|
||||||
line-height: 30px;
|
line-height: 30px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #666;
|
color: rgba(60, 60, 60, .7);
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
|
font-size: 13.6px;
|
||||||
|
background: #f9f9f9;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -40,20 +40,26 @@ const changeLocales = (lang: string, locales: any, merge: boolean) => {
|
|||||||
|
|
||||||
const changeTheme = (theme: string) => {
|
const changeTheme = (theme: string) => {
|
||||||
if (theme === "dark") {
|
if (theme === "dark") {
|
||||||
enableDarkMode({
|
enableDarkMode(
|
||||||
|
{
|
||||||
mode: 1,
|
mode: 1,
|
||||||
brightness: 100,
|
brightness: 100,
|
||||||
contrast: 90,
|
contrast: 90,
|
||||||
sepia: 0,
|
sepia: 0,
|
||||||
// darkSchemeTextColor: 'rgba(255, 255, 255, 0.9)',
|
// darkSchemeTextColor: 'rgba(255, 255, 255, 0.9)',
|
||||||
// darkSchemeBackgroundColor: '#22272E'
|
// darkSchemeBackgroundColor: '#22272E'
|
||||||
}, {
|
},
|
||||||
|
{
|
||||||
invert: [],
|
invert: [],
|
||||||
css: ``,
|
css: ``,
|
||||||
ignoreInlineStyle: ['.layui-colorpicker-trigger-span','div.layui-color-picker *'],
|
ignoreInlineStyle: [
|
||||||
|
".layui-colorpicker-trigger-span",
|
||||||
|
"div.layui-color-picker *",
|
||||||
|
],
|
||||||
ignoreImageAnalysis: [],
|
ignoreImageAnalysis: [],
|
||||||
disableStyleSheetsProxy: false,
|
disableStyleSheetsProxy: false,
|
||||||
});
|
}
|
||||||
|
);
|
||||||
} else {
|
} else {
|
||||||
disableDarkMode();
|
disableDarkMode();
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user