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%);
|
||||
transition: none;
|
||||
-webkit-transition: none;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
&:hover {
|
||||
background-color: #e2e2e2;
|
||||
}
|
||||
|
@ -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;
|
||||
|
@ -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>
|
||||
|
@ -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>
|
||||
|
@ -40,20 +40,26 @@ const changeLocales = (lang: string, locales: any, merge: boolean) => {
|
||||
|
||||
const changeTheme = (theme: string) => {
|
||||
if (theme === "dark") {
|
||||
enableDarkMode({
|
||||
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();
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user