Merge branch 'dark' into develop
This commit is contained in:
就眠儀式
commit
a3a3955a0f
@ -102,8 +102,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext animation
|
||||
:::
|
||||
@ -135,8 +135,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext avatar
|
||||
:::
|
||||
|
||||
@ -68,8 +68,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext badge
|
||||
:::
|
||||
@ -110,8 +110,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext breadcrumb
|
||||
:::
|
||||
@ -341,8 +341,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext button
|
||||
:::
|
||||
|
||||
@ -220,8 +220,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext card
|
||||
:::
|
||||
|
||||
@ -182,8 +182,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext carousel
|
||||
:::
|
||||
@ -220,8 +220,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext checkbox
|
||||
:::
|
||||
@ -249,8 +249,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext collapse
|
||||
:::
|
||||
@ -170,8 +170,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext color
|
||||
:::
|
||||
@ -66,8 +66,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext colorPicker
|
||||
:::
|
||||
@ -83,8 +83,7 @@ layer.confirm(content, options)
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext confirm
|
||||
:::
|
||||
@ -85,8 +85,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext container
|
||||
:::
|
||||
@ -112,8 +112,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext transfer
|
||||
:::
|
||||
@ -104,8 +104,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext dropdown
|
||||
:::
|
||||
@ -64,8 +64,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext empty
|
||||
:::
|
||||
@ -144,8 +144,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext field
|
||||
:::
|
||||
@ -75,8 +75,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext field
|
||||
:::
|
||||
@ -580,8 +580,7 @@ export default {
|
||||
```
|
||||
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext form
|
||||
:::
|
||||
@ -188,8 +188,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext grid
|
||||
:::
|
||||
@ -1137,8 +1137,7 @@ npm install @layui/icons-vue
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext iconfont
|
||||
:::
|
||||
@ -145,8 +145,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext iconPicker
|
||||
:::
|
||||
@ -192,8 +192,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext input
|
||||
:::
|
||||
@ -147,8 +147,7 @@
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext inputNumber
|
||||
:::
|
||||
@ -263,8 +263,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext layout
|
||||
:::
|
||||
@ -48,8 +48,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext line
|
||||
:::
|
||||
@ -133,8 +133,7 @@ layer.load(load, options)
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext load
|
||||
:::
|
||||
@ -534,8 +534,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext nav
|
||||
:::
|
||||
|
||||
@ -320,8 +320,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext modal
|
||||
:::
|
||||
@ -94,8 +94,7 @@ layer.msg(content, options)
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext msg
|
||||
:::
|
||||
@ -94,8 +94,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext transfer
|
||||
:::
|
||||
@ -308,8 +308,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext page
|
||||
:::
|
||||
@ -62,8 +62,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext panel
|
||||
:::
|
||||
@ -135,8 +135,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext progress
|
||||
:::
|
||||
@ -61,8 +61,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext block
|
||||
:::
|
||||
@ -127,8 +127,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext radio
|
||||
:::
|
||||
@ -315,8 +315,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext rate
|
||||
:::
|
||||
@ -78,8 +78,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext field
|
||||
:::
|
||||
@ -46,8 +46,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext field
|
||||
:::
|
||||
@ -235,8 +235,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext select
|
||||
:::
|
||||
@ -113,8 +113,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext skeleton
|
||||
:::
|
||||
@ -117,8 +117,7 @@ export default {
|
||||
| max | 最大值 | `Number` | - | - |
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext slider
|
||||
:::
|
||||
|
||||
@ -116,8 +116,7 @@
|
||||
:::
|
||||
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext splitPanel
|
||||
:::
|
||||
@ -468,8 +468,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext step
|
||||
:::
|
||||
@ -172,8 +172,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext switch
|
||||
:::
|
||||
@ -304,8 +304,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext tab
|
||||
:::
|
||||
|
||||
@ -390,8 +390,7 @@ export default {
|
||||
| titleSlot | 标题插槽 | -- |
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext table
|
||||
:::
|
||||
@ -118,8 +118,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext textarea
|
||||
:::
|
||||
@ -137,8 +137,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext timeline
|
||||
:::
|
||||
@ -128,8 +128,7 @@
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext tooltip
|
||||
:::
|
||||
@ -185,8 +185,7 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext transfer
|
||||
:::
|
||||
@ -268,8 +268,7 @@ function handleClick(node) {
|
||||
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext tree
|
||||
:::
|
||||
|
||||
@ -186,7 +186,6 @@ export default {
|
||||
:::
|
||||
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
|
||||
::: previousNext button
|
||||
|
||||
17
example/docs/zh-CN/guide/dark.md
Normal file
17
example/docs/zh-CN/guide/dark.md
Normal file
@ -0,0 +1,17 @@
|
||||
::: title 夜间模式
|
||||
:::
|
||||
|
||||
::: describe 默认情况下, 网站主题为日间模式。若需启用深夜模式, 使用 config-provider 组件。
|
||||
:::
|
||||
|
||||
```
|
||||
<template>
|
||||
<lay-config-provider :theme="theme">
|
||||
<App />
|
||||
</lay-config-provider>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const theme = ref('dark')
|
||||
</script>
|
||||
```
|
||||
@ -4,5 +4,4 @@
|
||||
::: describe 以下整理了一些 Layui Vue 社区常见的问题和官方答复，在提问之前建议找找有没有类似的问题。
|
||||
:::
|
||||
|
||||
::: comment
|
||||
:::
|
||||
|
||||
@ -1,3 +1,33 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" baseProfile="full" width="100%" height="100%" viewBox="0 0 1400 800">
|
||||
|
||||
<rect x="1300" y="400" rx="40" ry="40" width="300" height="300" stroke="rgb(129, 201, 149)" fill="rgb(129, 201, 149)">
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="35s" type="rotate" from="0 1450 550" to="360 1450 550" repeatCount="indefinite"/>
|
||||
</rect>
|
||||
|
||||
<path d="M 100 350 A 150 150 0 1 1 400 350 Q400 370 380 370 L 250 370 L 120 370 Q100 370 100 350" stroke="rgb(253, 214, 99)" fill="rgb(253, 214, 99)">
|
||||
<animateMotion path="M 800 -200 L 800 -300 L 800 -200" dur="20s" begin="0s" repeatCount="indefinite"/>
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="30s" type="rotate" values="0 210 530 ; -30 210 530 ; 0 210 530" keyTimes="0 ; 0.5 ; 1" repeatCount="indefinite"/>
|
||||
</path>
|
||||
|
||||
<circle cx="200" cy="150" r="30" stroke="#1a73e8" fill="#1a73e8">
|
||||
<animateMotion path="M 0 0 L 40 20 Z" dur="5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- 三角形 -->
|
||||
<path d="M 165 580 L 270 580 Q275 578 270 570 L 223 483 Q220 480 217 483 L 165 570 Q160 578 165 580" stroke="rgb(238, 103, 92)" fill="rgb(238, 103, 92)">
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="35s" type="rotate" from="0 210 530" to="360 210 530" repeatCount="indefinite"/>
|
||||
</path>
|
||||
|
||||
<circle cx="1200" cy="600" r="30" stroke="rgb(241, 243, 244)" fill="rgb(241, 243, 244)">
|
||||
<animateMotion path="M 0 0 L -20 40 Z" dur="9s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<path d="M 100 350 A 40 40 0 1 1 180 350 L 180 430 A 40 40 0 1 1 100 430 Z" stroke="rgb(241, 243, 244)" fill="rgb(241, 243, 244)">
|
||||
<animateMotion path="M 140 390 L 180 360 L 140 390" dur="20s" begin="0s" repeatCount="indefinite"/>
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="30s" type="rotate" values="0 140 390; -60 140 390; 0 140 390" keyTimes="0 ; 0.5 ; 1" repeatCount="indefinite"/>
|
||||
</path>
|
||||
|
||||
<rect x="400" y="600" rx="40" ry="40" width="100" height="100" stroke="rgb(129, 201, 149)" fill="rgb(129, 201, 149)">
|
||||
<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="35s" type="rotate" from="-30 550 750" to="330 550 750" repeatCount="indefinite"/>
|
||||
</rect>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 131 B After Width: | Height: | Size: 2.3 KiB |
BIN
example/src/assets/logo-png.png
Normal file
BIN
example/src/assets/logo-png.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.2 KiB |
@ -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;
|
||||
}
|
||||
|
||||
@ -1,24 +0,0 @@
|
||||
<template>
|
||||
<div id="comment"></div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'Utterances',
|
||||
methods: {
|
||||
initValine () {
|
||||
const utterances = document.createElement('script');
|
||||
utterances.type = 'text/javascript';
|
||||
utterances.async = true;
|
||||
utterances.setAttribute('issue-term', 'pathname')
|
||||
utterances.setAttribute('theme','github-light')
|
||||
utterances.setAttribute('repo',`layui-vue/layui-doc`)
|
||||
utterances.crossorigin = 'anonymous';
|
||||
utterances.src = 'https://utteranc.es/client.js';
|
||||
window.document.getElementById('comment').appendChild(utterances);
|
||||
}
|
||||
},
|
||||
mounted: function(){
|
||||
this.initValine()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -31,8 +31,28 @@ onMounted(() => {
|
||||
:root {
|
||||
--docsearch-logo-color: var(--global-primary-color);
|
||||
--docsearch-primary-color: var(--global-primary-color);
|
||||
--docsearch-searchbox-background: rgba(255, 255, 255, 0.05);
|
||||
--docsearch-searchbox-focus-background: rgba(255, 255, 255, 0.05);
|
||||
--docsearch-searchbox-background: rgba(255, 255, 255, 0.02);
|
||||
--docsearch-searchbox-focus-background: rgba(255, 255, 255, 0.02);
|
||||
--docsearch-container-background: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.DocSearch-Button,
|
||||
.DocSearch-Button:hover,
|
||||
.DocSearch-Button:active,
|
||||
.DocSearch-Button:focus {
|
||||
border: 1px solid rgb(224, 224, 230);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.DocSearch-Button-Key {
|
||||
border: 1px solid rgba(60, 60, 60, .29);
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.DocSearch-Button
|
||||
.DocSearch-Search-Icon,
|
||||
.DocSearch-Button-Placeholder {
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -5,10 +5,10 @@
|
||||
:locales="locales"
|
||||
:themeVariable="themeVariable"
|
||||
>
|
||||
<lay-layout class="layui-layout-document">
|
||||
<lay-layout class="layui-layout-document" style="height:100%">
|
||||
<lay-header
|
||||
><lay-logo style="box-shadow: 0 0px 2px 0 rgba(0, 0, 0, 0.15)">
|
||||
<img src="../assets/logo.png" />
|
||||
><lay-logo>
|
||||
<img src="../assets/logo-png.png" /><span style="margin-left:12px;font-size:20px;color: rgba(0, 0, 0, 0.8);letter-spacing: -0.2px;opacity: 0.8;">layui - vue</span>
|
||||
</lay-logo>
|
||||
<ul
|
||||
class="layui-nav layui-layout-left"
|
||||
@ -30,11 +30,6 @@
|
||||
{{ t("nav.resources") }}
|
||||
</router-link>
|
||||
</li>
|
||||
<li class="layui-nav-item">
|
||||
<router-link to="/zh-CN/material">
|
||||
{{ t("nav.material") }}
|
||||
</router-link>
|
||||
</li>
|
||||
<li class="layui-nav-item">
|
||||
<lay-form>
|
||||
<lay-search :datas="menus" />
|
||||
@ -52,7 +47,6 @@
|
||||
size="15px"
|
||||
type="layui-icon-theme"
|
||||
style="
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
padding-left: 30px;
|
||||
padding-right: 30px;
|
||||
"
|
||||
@ -122,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">
|
||||
@ -143,11 +137,6 @@
|
||||
>
|
||||
</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>
|
||||
</a>
|
||||
</li>
|
||||
<li class="layui-nav-item">
|
||||
<a href="javascript:void(0)">
|
||||
<lay-switch
|
||||
@ -212,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>
|
||||
@ -221,7 +210,7 @@
|
||||
</lay-config-provider>
|
||||
</template>
|
||||
<script>
|
||||
import { ref, watch } from "vue";
|
||||
import { provide, ref, watch } from "vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import menu from "../view/utils/menus";
|
||||
import { useI18n } from "vue-i18n";
|
||||
@ -290,6 +279,9 @@ export default {
|
||||
locale.value = lang;
|
||||
};
|
||||
|
||||
provide("isDark",isDark);
|
||||
provide("theme",theme);
|
||||
|
||||
return {
|
||||
t,
|
||||
menus,
|
||||
@ -311,8 +303,8 @@ export default {
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
background: #393d49;
|
||||
border-bottom: 1px solid #404553;
|
||||
background: #ffffff;
|
||||
border-bottom: 1px solid #EEEEEE;
|
||||
}
|
||||
|
||||
.layui-layout-document > .layui-layout > .layui-side {
|
||||
@ -321,13 +313,7 @@ export default {
|
||||
margin-top: 60px;
|
||||
z-index: 99;
|
||||
height: calc(100% - 60px);
|
||||
box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
|
||||
}
|
||||
|
||||
.layui-layout-document .layui-body,
|
||||
.layui-layout-document .layui-menu,
|
||||
.layui-layout-document .lay-aside {
|
||||
background-color: var(--global-back-color);
|
||||
border-right: 1px solid #EEEEEE;
|
||||
}
|
||||
|
||||
.layui-layout-document > .layui-layout > .layui-body {
|
||||
@ -338,11 +324,25 @@ export default {
|
||||
height: calc(100% - 60px);
|
||||
}
|
||||
|
||||
.layui-layout-document .layui-header .layui-form-switch {
|
||||
border: 1px solid rgba(60, 60, 60, .29);
|
||||
background-color: #f1f1f1!important;
|
||||
}
|
||||
|
||||
.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: 31px;
|
||||
width: 82px;
|
||||
height: 45px;
|
||||
left: 15px;
|
||||
top: 16px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.layui-header > .layui-nav {
|
||||
@ -352,13 +352,6 @@ export default {
|
||||
.layui-header .layui-local-badge {
|
||||
font-size: 12.4px;
|
||||
background: transparent;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
border-color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
|
||||
.layui-header > .layui-local:hover {
|
||||
color: white;
|
||||
border-color: white;
|
||||
}
|
||||
|
||||
.layui-menu-docs {
|
||||
|
||||
@ -6,7 +6,6 @@ import layui from '../../src/index'
|
||||
import LayCode from './components/LayCode.vue'
|
||||
import LaySearch from './components/LaySearch.vue'
|
||||
import LayTableBox from './components/LayTableBox.vue'
|
||||
import LayComment from './components/LayComment.vue'
|
||||
import LayAnchor from './components/LayAnchor.vue'
|
||||
import './assets/css/index.css'
|
||||
|
||||
@ -24,7 +23,6 @@ export function createApp(): {
|
||||
.component('LayCode', LayCode)
|
||||
.component('LaySearch', LaySearch)
|
||||
.component('LayTableBox', LayTableBox)
|
||||
.component('LayComment', LayComment)
|
||||
.component('LayAnchor',LayAnchor)
|
||||
|
||||
return { app, router }
|
||||
|
||||
@ -8,7 +8,6 @@ import createTitle from "./create-title";
|
||||
import createQuote from "./create-quote";
|
||||
import createDescribe from "./create-describe";
|
||||
import createTable from "./create-table";
|
||||
import createComment from "./create-comment";
|
||||
import createAnchor from "./create-anchor";
|
||||
import preWrapper from "./pre-wrapper";
|
||||
import previousNext from "./previous-next";
|
||||
@ -32,7 +31,6 @@ const plugins = [
|
||||
.use(...createQuote("quote", ""))
|
||||
.use(...createTitle("title", ""))
|
||||
.use(...createDescribe("describe", ""))
|
||||
.use(...createComment("comment", ""))
|
||||
.use(...createAnchor("anchor", ""))
|
||||
.use(...previousNext("previousNext", ""));
|
||||
},
|
||||
|
||||
@ -1,27 +0,0 @@
|
||||
import container from 'markdown-it-container'
|
||||
import type Token from 'markdown-it/lib/token'
|
||||
|
||||
type ContainerArgs = [
|
||||
typeof container, string,
|
||||
{ render(tokens: Token[], idx: number): string }
|
||||
]
|
||||
|
||||
export default function createContainer(
|
||||
klass: string,
|
||||
defaultTitle: string
|
||||
): ContainerArgs {
|
||||
return [
|
||||
container,
|
||||
klass,
|
||||
{
|
||||
render(tokens, idx) {
|
||||
const token = tokens[idx]
|
||||
if (token.nesting === 1) {
|
||||
return `<lay-comment>`
|
||||
} else {
|
||||
return '</lay-comment>\n'
|
||||
}
|
||||
},
|
||||
},
|
||||
]
|
||||
}
|
||||
@ -30,7 +30,7 @@ export default function createContainer(
|
||||
}
|
||||
});
|
||||
if (token.nesting === 1) {
|
||||
return `<div style="display: flex; justify-content: space-between">
|
||||
return `<div style="display: flex; justify-content: space-between; margin-top:20px;">
|
||||
<div><router-link to="${
|
||||
menusChild[prevIndex]?.path
|
||||
}" class="lay-link" style="display: ${
|
||||
|
||||
@ -68,6 +68,11 @@ const zhCN = [
|
||||
component: () => import("../../docs/zh-CN/guide/locale.md"),
|
||||
meta: { title: "语言" },
|
||||
},
|
||||
{
|
||||
path: "/zh-CN/guide/dark",
|
||||
component: () => import("../../docs/zh-CN/guide/dark.md"),
|
||||
meta: { title: "夜间" },
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
@ -91,6 +91,11 @@ export default {
|
||||
title: '主题',
|
||||
subTitle: 'theme',
|
||||
path: '/zh-CN/guide/theme',
|
||||
},{
|
||||
id: 3,
|
||||
title: '夜间',
|
||||
subTitle: 'dark',
|
||||
path: '/zh-CN/guide/dark',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
|
||||
@ -4,31 +4,34 @@
|
||||
<div class="site-banner-main">
|
||||
<div class="site-zfj site-zfj-anim">
|
||||
<img
|
||||
src="../assets/logo.jpg"
|
||||
src="../assets/logo-png.png"
|
||||
style="width: 220px; border-radius: 10px"
|
||||
/>
|
||||
</div>
|
||||
<div class="layui-anim site-desc site-desc-anim">
|
||||
<p class="web-font-desc">layui - vue</p>
|
||||
<cite
|
||||
>{{ t('home.description') }}</cite
|
||||
>
|
||||
<cite>{{ t("home.description") }}</cite>
|
||||
</div>
|
||||
<div class="site-download">
|
||||
<router-link class="layui-inline site-down" to="/zh-CN/guide"
|
||||
>Get Started</router-link
|
||||
>
|
||||
<router-link class="layui-inline site-down" to="/zh-CN/guide">
|
||||
Get Started
|
||||
</router-link>
|
||||
<a class="layui-inline site-down" href="javascript:void(0);" @click="changeTheme">
|
||||
|
||||
{{ isDark ? 'Turn Off' : 'Turn On'}}
|
||||
</a>
|
||||
</div>
|
||||
<div class="site-version">
|
||||
<span>{{ t('home.version') }}：v<cite class="site-showv">0.4.4</cite></span>
|
||||
<span
|
||||
><router-link
|
||||
class="layui-inline site-down"
|
||||
to="/zh-CN/guide/changelog"
|
||||
>{{ t('home.changelog') }}</router-link
|
||||
>{{ 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 class="site-banner-other">
|
||||
@ -38,7 +41,7 @@
|
||||
rel="nofollow"
|
||||
class="site-star"
|
||||
>
|
||||
<i class="layui-icon"></i> Star <cite id="getStars">716</cite>
|
||||
<i class="layui-icon"></i> Star <cite id="getStars">741</cite>
|
||||
</a>
|
||||
<a
|
||||
href="https://gitee.com/layui-vue"
|
||||
@ -58,7 +61,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">
|
||||
@ -98,45 +101,67 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer footer-index">
|
||||
<p>
|
||||
Copyright © 2022 <a href="/index.html">www.layui-vue.com</a> mit
|
||||
licence
|
||||
</p>
|
||||
<p></p>
|
||||
<p>Released under the <a href="/index.html">MIT License</a>.</p>
|
||||
<p>Copyright © 2021-2022 layui-vue.com</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { inject, provide } from 'vue';
|
||||
import { useI18n } from "vue-i18n";
|
||||
export default {
|
||||
name: "index",
|
||||
setup() {
|
||||
const { t } = useI18n();
|
||||
|
||||
return {
|
||||
t
|
||||
const isDark = inject("isDark");
|
||||
const theme = inject("theme");
|
||||
|
||||
const changeTheme = () => {
|
||||
isDark.value = !isDark.value;
|
||||
if(theme.value === 'dark') {
|
||||
theme.value = 'light';
|
||||
} else {
|
||||
theme.value = 'dark';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
t,
|
||||
isDark,
|
||||
theme,
|
||||
changeTheme
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
#app,
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
.site-container {
|
||||
background: #fff;
|
||||
margin-top: 60px;
|
||||
background-color: whitesmoke;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.site-banner {
|
||||
position: relative;
|
||||
height: 600px;
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background-color: #393d49;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
border-bottom: 1px solid #eee;
|
||||
background-image: url(../assets/background.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.site-banner-bg {
|
||||
background-position: center 0;
|
||||
}
|
||||
|
||||
.site-banner-bg,
|
||||
.site-banner-main {
|
||||
position: absolute;
|
||||
@ -151,21 +176,29 @@ export default {
|
||||
}
|
||||
.site-download a {
|
||||
position: relative;
|
||||
padding: 0 50px 0 50px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
padding: 0 20px 0 20px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #c2c2c2;
|
||||
border-color: rgba(255, 255, 255, 0.2);
|
||||
font-size: 24px;
|
||||
color: #ccc;
|
||||
background: #f1f1f1;
|
||||
border: 1px solid #f1f1f1;
|
||||
font-size: 16px;
|
||||
color: #476582;
|
||||
font-weight: 500;
|
||||
font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
transition: all 0.5s;
|
||||
-webkit-transition: all 0.5s;
|
||||
letter-spacing: 0.2px;
|
||||
}
|
||||
.site-download a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.05);
|
||||
border-radius: 50px;
|
||||
color: #ccc;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.site-download a:first-child {
|
||||
background: #009688;
|
||||
color: white;
|
||||
}
|
||||
.site-download a+a {
|
||||
margin-left: 20px;
|
||||
}
|
||||
.site-zfj {
|
||||
padding-top: 25px;
|
||||
@ -200,26 +233,30 @@ export default {
|
||||
}
|
||||
.site-desc .web-font-desc {
|
||||
color: #fff;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-size: 51px;
|
||||
color: #213547;
|
||||
font-size: 52px;
|
||||
opacity: 0.82;
|
||||
}
|
||||
.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;
|
||||
bottom: -40px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
color: #c2c2c2;
|
||||
color: rgba(255, 255, 255, 0.66);
|
||||
color: rgba(60, 60, 60, 0.7);
|
||||
font-style: normal;
|
||||
}
|
||||
.site-version {
|
||||
position: relative;
|
||||
margin-top: 18px;
|
||||
color: #ccc;
|
||||
color: rgba(60, 60, 60, 0.7);
|
||||
font-size: 12px;
|
||||
}
|
||||
.site-version span {
|
||||
@ -229,18 +266,23 @@ export default {
|
||||
font-style: normal;
|
||||
}
|
||||
.site-version a {
|
||||
color: #e2e2e2;
|
||||
color: rgba(60, 60, 60, 0.7);
|
||||
text-decoration: none;
|
||||
margin-top: -4px;
|
||||
}
|
||||
.site-banner-other {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 35px;
|
||||
bottom: 90px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.site-container .layui-field-title {
|
||||
border-top: 1px solid #d2d2d2;
|
||||
}
|
||||
|
||||
.site-banner-other a {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
@ -249,10 +291,8 @@ export default {
|
||||
margin: 0 6px;
|
||||
padding: 0 8px;
|
||||
border-radius: 4px;
|
||||
color: #c2c2c2;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
border: 1px solid #c2c2c2;
|
||||
border-color: rgba(255, 255, 255, 0.2);
|
||||
color: rgba(60, 60, 60, 0.7);
|
||||
border: 1px solid rgba(60, 60, 60, 0.7);
|
||||
font-size: 14px;
|
||||
transition: all 0.5s;
|
||||
-webkit-transition: all 0.5s;
|
||||
@ -262,7 +302,9 @@ export default {
|
||||
padding: 30px 15px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
color: #666;
|
||||
color: rgba(60, 60, 60, 0.7);
|
||||
font-weight: 300;
|
||||
font-size: 13.6px;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="alone-banner layui-bg-black">
|
||||
<div class="alone-banner">
|
||||
<div class="layui-main">
|
||||
<h1>物 料 市 场</h1>
|
||||
<p class="layui-hide-xs">让 每 一 个 轮 子 产 生 价 值 ✨<a style="color:white;" href="https://gitee.com/layui-vue/layui-vue/issues/new?issue%5Bassignee_id%5D=0&issue%5Bmilestone_id%5D=0">【投递】</a></p>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@layui/layui-vue",
|
||||
"version": "0.4.4",
|
||||
"version": "0.4.5-alpha.1",
|
||||
"author": "就眠儀式",
|
||||
"license": "MIT",
|
||||
"description": "a component library for Vue 3 base on layui-vue",
|
||||
@ -43,6 +43,7 @@
|
||||
"@layui/layer-vue": "^1.3.11",
|
||||
"@vueuse/core": "^7.6.2",
|
||||
"async-validator": "^4.0.7",
|
||||
"darkreader": "^4.9.46",
|
||||
"evtd": "^0.2.3",
|
||||
"moment": "^2.29.1",
|
||||
"uuid": "^8.3.2",
|
||||
|
||||
@ -13,7 +13,7 @@ import {
|
||||
ButtonSize,
|
||||
ButtonType,
|
||||
} from "./interface";
|
||||
import { BooleanOrString, String } from "src/types";
|
||||
import { BooleanOrString, String } from "../../types";
|
||||
|
||||
export interface LayButtonProps {
|
||||
type?: ButtonType;
|
||||
|
||||
@ -7,7 +7,7 @@ export default {
|
||||
<script setup lang="ts">
|
||||
import { computed, useSlots } from "vue";
|
||||
import "./index.less";
|
||||
import { String } from "src/types";
|
||||
import { String } from "../../types";
|
||||
import { CardShadow } from "./interface";
|
||||
|
||||
const slot = useSlots();
|
||||
|
||||
@ -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"></i>
|
||||
<i :class="{ 'layui-icon layui-icon-ok': isChecked }"></i>
|
||||
</div>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
1
src/component/datePicker/interface.ts
Normal file
1
src/component/datePicker/interface.ts
Normal file
@ -0,0 +1 @@
|
||||
export type DatePickerType = "date" | "datetime" | "year" | "time" | "month";
|
||||
@ -7,6 +7,11 @@ export default {
|
||||
<script setup lang="ts">
|
||||
import { watch } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {
|
||||
enable as enableDarkMode,
|
||||
disable as disableDarkMode,
|
||||
} from "darkreader";
|
||||
|
||||
const { locale, setLocaleMessage, mergeLocaleMessage } = useI18n();
|
||||
|
||||
export interface LayConfigProviderProps {
|
||||
@ -34,8 +39,30 @@ const changeLocales = (lang: string, locales: any, merge: boolean) => {
|
||||
};
|
||||
|
||||
const changeTheme = (theme: string) => {
|
||||
document.body.removeAttribute("lay-theme");
|
||||
document.body.setAttribute("lay-theme", theme);
|
||||
if (theme === "dark") {
|
||||
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 *",
|
||||
],
|
||||
ignoreImageAnalysis: [],
|
||||
disableStyleSheetsProxy: false,
|
||||
}
|
||||
);
|
||||
} else {
|
||||
disableDarkMode();
|
||||
}
|
||||
};
|
||||
|
||||
const changeThemeVariable = (vars: any) => {
|
||||
|
||||
@ -276,7 +276,6 @@ a cite {
|
||||
text-align: center;
|
||||
color: @global-primary-color;
|
||||
font-size: 16px;
|
||||
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%);
|
||||
}
|
||||
|
||||
.layui-layout-left {
|
||||
|
||||
@ -44,10 +44,6 @@
|
||||
|
||||
--global-border-radius: 2px;
|
||||
|
||||
--global-fore-color: #333;
|
||||
|
||||
--global-back-color: #ffffff;
|
||||
|
||||
--global-neutral-color-1: #FAFAFA;
|
||||
|
||||
--global-neutral-color-2: #F6F6F6;
|
||||
@ -63,27 +59,5 @@
|
||||
--global-neutral-color-7: #cccccc;
|
||||
|
||||
--global-neutral-color-8: #c2c2c2;
|
||||
}
|
||||
|
||||
body[lay-theme="dark"] {
|
||||
|
||||
--global-fore-color: #ffffff;
|
||||
|
||||
--global-back-color: #333;
|
||||
|
||||
--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;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user