[文档] 更新主页
This commit is contained in:
parent
4eb431415c
commit
98beb7c23c
@ -3,8 +3,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<lay-collapse>
|
<lay-collapse>
|
||||||
<lay-collapse-item title="标题" show> 内容 </lay-collapse-item>
|
<lay-collapse-item title="标题" show> 内容 </lay-collapse-item>
|
||||||
<lay-collapse-item title="标题"> 内容 </lay-collapse-item>
|
<lay-collapse-item title="标题" show> 内容 </lay-collapse-item>
|
||||||
<lay-collapse-item title="标题"> 内容 </lay-collapse-item>
|
<lay-collapse-item title="标题" show> 内容 </lay-collapse-item>
|
||||||
</lay-collapse>
|
</lay-collapse>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -60,3 +60,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
|
|
||||||
|
| | | |
|
||||||
|
|--|--|--|
|
||||||
|
| trigger | 触发方式 | `click` `hover` |
|
@ -2,6 +2,12 @@
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<lay-timeline>
|
<lay-timeline>
|
||||||
|
<lay-timeline-item title="0.0.11">
|
||||||
|
</lay-timeline-item>
|
||||||
|
<lay-timeline-item title="0.0.10">
|
||||||
|
</lay-timeline-item>
|
||||||
|
<lay-timeline-item title="0.0.9">
|
||||||
|
</lay-timeline-item>
|
||||||
<lay-timeline-item title="0.0.8">
|
<lay-timeline-item title="0.0.8">
|
||||||
</lay-timeline-item>
|
</lay-timeline-item>
|
||||||
</lay-timeline>
|
</lay-timeline>
|
||||||
|
@ -4,27 +4,38 @@
|
|||||||
layui(谐音:类 UI) 是 一 套 Vue 3.0 的 桌 面 端 组 件 库 , Layui 的 另 一 种 呈 现 方 式
|
layui(谐音:类 UI) 是 一 套 Vue 3.0 的 桌 面 端 组 件 库 , Layui 的 另 一 种 呈 现 方 式
|
||||||
</lay-block>
|
</lay-block>
|
||||||
|
|
||||||
::: demo
|
<lay-timeline style="padding-left:38px;padding-top:30px;">
|
||||||
|
<lay-timeline-item title="2021年,layui vue 里程碑版本 0.0.1 发布" simple></lay-timeline-item>
|
||||||
<template>
|
|
||||||
<lay-timeline>
|
|
||||||
<lay-timeline-item title="2021年,layui vue 里程碑版本 1.0 发布" simple></lay-timeline-item>
|
|
||||||
<lay-timeline-item title="2017年,layui 里程碑版本 2.0 发布" simple></lay-timeline-item>
|
<lay-timeline-item title="2017年,layui 里程碑版本 2.0 发布" simple></lay-timeline-item>
|
||||||
<lay-timeline-item title="2016年,layui 首个版本发布" simple></lay-timeline-item>
|
<lay-timeline-item title="2016年,layui 首个版本发布" simple></lay-timeline-item>
|
||||||
<lay-timeline-item title="2015年,layui 孵化" simple></lay-timeline-item>
|
<lay-timeline-item title="2015年,layui 孵化" simple></lay-timeline-item>
|
||||||
</lay-timeline>
|
</lay-timeline>
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
<div>
|
||||||
import { ref } from 'vue'
|
<ul class="layui-row layui-col-space30 site-idea">
|
||||||
|
<li class="layui-col-md4">
|
||||||
export default {
|
<div>
|
||||||
setup() {
|
<fieldset class="layui-elem-field layui-field-title">
|
||||||
|
<legend>返璞归真</legend>
|
||||||
return {
|
<p>身处在前端社区的繁荣之下,我们都在有意或无意地追逐。而 layui 偏偏回望当初,奔赴在返璞归真的漫漫征途,自信并勇敢着,追寻于原生态的书写指令,试图以最简单的方式诠释高效。</p>
|
||||||
}
|
</fieldset>
|
||||||
}
|
</div>
|
||||||
}
|
</li>
|
||||||
</script>
|
<li class="layui-col-md4">
|
||||||
|
<div>
|
||||||
:::
|
<fieldset class="layui-elem-field layui-field-title">
|
||||||
|
<legend>双面体验</legend>
|
||||||
|
<p>拥有双面的不仅是人生,还有 layui。一面极简,一面丰盈。极简是视觉所见的外在,是开发所念的简易。丰盈是倾情雕琢的内在,是信手拈来的承诺。一切本应如此,简而全,双重体验。</p>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="layui-col-md4">
|
||||||
|
<div>
|
||||||
|
<fieldset class="layui-elem-field layui-field-title">
|
||||||
|
<legend>星辰大海</legend>
|
||||||
|
<p>如果眼下还是一团零星之火,那运筹帷幄之后,迎面东风,就是一场烈焰燎原吧,那必定会是一番尽情的燃烧。待,秋风萧瑟时,散作满天星辰,你看那四季轮回<!--海天相接-->,正是 layui 不灭的执念。</p>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
@ -30,3 +30,4 @@ createApp(App)
|
|||||||
<lay-footer>pearadmin.com</lay-footer>
|
<lay-footer>pearadmin.com</lay-footer>
|
||||||
</lay-layout>
|
</lay-layout>
|
||||||
```
|
```
|
||||||
|
完整案例, 前往: [layui-vue-sample](https://gitee.com/layui-vue/layui-vue-sample)
|
@ -98,7 +98,7 @@ function handleScroll() {
|
|||||||
.lay-code .meta .description {
|
.lay-code .meta .description {
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
border: 1px solid var(--c-divider);
|
border: 1px solid whitesmoke;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
background: var(--c-bg);
|
background: var(--c-bg);
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
@ -115,7 +115,7 @@ function handleScroll() {
|
|||||||
padding: 1px 5px;
|
padding: 1px 5px;
|
||||||
margin: 0 4px;
|
margin: 0 4px;
|
||||||
height: 18px;
|
height: 18px;
|
||||||
border-radius: 3px;
|
border-radius: 2px;
|
||||||
background-color: var(--code-inline-bg-color);
|
background-color: var(--code-inline-bg-color);
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 18px;
|
line-height: 18px;
|
||||||
|
@ -37,7 +37,7 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</lay-header>
|
</lay-header>
|
||||||
<lay-side>
|
<lay-side>
|
||||||
<ul class="layui-menu layui-menu-lg layui-menu-docs">
|
<ul class="layui-menu layui-menu-lg layui-menu-docs" style="padding:6px">
|
||||||
<li
|
<li
|
||||||
:key="menu"
|
:key="menu"
|
||||||
v-for="menu in menus"
|
v-for="menu in menus"
|
||||||
|
@ -22,7 +22,7 @@ div[class*='language-'] {
|
|||||||
margin: 1rem -1.5rem;
|
margin: 1rem -1.5rem;
|
||||||
background-color: #fafafa;
|
background-color: #fafafa;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
border: 1px solid #eaeefb;
|
border: 1px solid whitesmoke;
|
||||||
}
|
}
|
||||||
|
|
||||||
li > div[class*='language-'] {
|
li > div[class*='language-'] {
|
||||||
|
@ -214,3 +214,28 @@ table td {
|
|||||||
.site-doc-bgcolor li {
|
.site-doc-bgcolor li {
|
||||||
padding: 20px 10px;
|
padding: 20px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.site-idea {
|
||||||
|
margin: 30px 0;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-idea li {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-idea li div {
|
||||||
|
padding: 25px;
|
||||||
|
line-height: 24px;
|
||||||
|
border: 1px solid #d2d2d2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-idea .layui-field-title {
|
||||||
|
border-color: #d2d2d2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-idea .layui-field-title legend {
|
||||||
|
margin: 0 20px 20px 0;
|
||||||
|
padding: 0 20px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@layui/layui-vue",
|
"name": "@layui/layui-vue",
|
||||||
"version": "0.0.11",
|
"version": "0.0.12",
|
||||||
"description": "a component library for Vue 3 base on layui-vue",
|
"description": "a component library for Vue 3 base on layui-vue",
|
||||||
"main": "lib/layui-vue.umd.js",
|
"main": "lib/layui-vue.umd.js",
|
||||||
"module": "lib/layui-vue.es.js",
|
"module": "lib/layui-vue.es.js",
|
||||||
|
@ -4312,6 +4312,7 @@ body .layui-table-tips .layui-layer-content {
|
|||||||
.layui-menu .layui-menu-item-checked,
|
.layui-menu .layui-menu-item-checked,
|
||||||
.layui-menu .layui-menu-item-checked2 {
|
.layui-menu .layui-menu-item-checked2 {
|
||||||
background-color: #F6F6F6 !important;
|
background-color: #F6F6F6 !important;
|
||||||
|
border-radius: 2px;
|
||||||
color: #5FB878
|
color: #5FB878
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user