ulthon/layui-ul
1
0
Fork 0
mirror of https://gitee.com/ulthon/layui-ul.git synced 2026-07-01 10:32:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 迁移文档目录

Browse Source
This commit is contained in:
augushong
2025-09-02 19:45:32 +08:00
parent 4b5b14cf9b
commit 34385ef6fa
10 changed files with 147 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
demo/pc/tree.html
View File

@@ -244,55 +244,4 @@
</div> </div>
</div> </div>
</fieldset>
<fieldset class="layui-elem-field layui-field-title">
<legend>文档目录</legend>
<div class="layui-field-box">
<div class="ul-bg-black">
<div class="ul-doc-info-page">
<div class="ul-doc-info-page-list">
<div class="ul-doc-info-page-item page level-0">
文章标题
</div>
<div class="ul-doc-info-page-item page level-0">
文章标题
</div>
<div class="ul-doc-info-page-item group level-0">
文章分组
</div>
<div class="ul-doc-info-page-item page level-1">
二级文章标题
</div>
<div class="ul-doc-info-page-item page level-1">
二级文章标题
</div>
<div class="ul-doc-info-page-item point level-2">
文章内部锚点
</div>
<div class="ul-doc-info-page-item point level-2">
文章内部锚点
</div>
<div class="ul-doc-info-page-item group level-0">
文章分组
</div>
<div class="ul-doc-info-page-item page level-1">
二级文章标题
</div>
<div class="ul-doc-info-page-item page level-1">
二级文章标题
</div>
<div class="ul-doc-info-page-item point level-2">
文章内部锚点
</div>
<div class="ul-doc-info-page-item point level-2">
文章内部锚点
</div>
</div>
</div>
</div>
<div>
这个样式不适合做复杂的特效,比如展开收缩/上移下移.用来展示就好.
</div>
</div>
</fieldset> </fieldset>

84
public/cdn/layui-ul.css
View File

@@ -3051,6 +3051,48 @@
margin-top: 8px; margin-top: 8px;
} }
.ul-doc-info-page-list {
padding: 15px;
color: #999;
}
.ul-doc-info-page-item {
line-height: 2;
padding: 0 15px;
position: relative;
}
.ul-doc-info-page-item.page {
cursor: pointer;
font-size: 18px;
}
.ul-doc-info-page-item.group {
color: #bbb;
font-size: 16px;
}
.ul-doc-info-page-item.point {
color: #eee;
font-size: 14px;
}
.ul-doc-info-page-item.page:hover {
background-color: #555;
}
.ul-doc-info-page-item.level-1 {
margin-left: 15px;
}
.ul-doc-info-page-item.level-2 {
margin-left: 30px;
}
.ul-doc-info-page-item.level-3 {
margin-left: 45px;
}
/* 链接导航结束 */ /* 链接导航结束 */
.ul-card-status { .ul-card-status {
padding: 5px; padding: 5px;
@@ -3212,48 +3254,6 @@
top: 0px; top: 0px;
} }
.ul-doc-info-page-list {
padding: 15px;
color: #999;
}
.ul-doc-info-page-item {
line-height: 2;
padding: 0 15px;
position: relative;
}
.ul-doc-info-page-item.page {
cursor: pointer;
font-size: 18px;
}
.ul-doc-info-page-item.group {
color: #bbb;
font-size: 16px;
}
.ul-doc-info-page-item.point {
color: #eee;
font-size: 14px;
}
.ul-doc-info-page-item.page:hover {
background-color: #555;
}
.ul-doc-info-page-item.level-1 {
margin-left: 15px;
}
.ul-doc-info-page-item.level-2 {
margin-left: 30px;
}
.ul-doc-info-page-item.level-3 {
margin-left: 45px;
}
.ul-timeline-rowstyle { .ul-timeline-rowstyle {
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;

2
public/cdn/layui-ul.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
source/components/_index.scss
View File

@@ -68,3 +68,4 @@
@import './title/ul-group-title-2/index'; @import './title/ul-group-title-2/index';
@import './title/ul-group-title-simple/index'; @import './title/ul-group-title-simple/index';
@import './title/ul-title/index'; @import './title/ul-title/index';
@import './tree/ul-doc-info-page/index';

6
source/components/tree/ul-doc-info-page/_index.env Normal file
View File

@@ -0,0 +1,6 @@
title=文档目录
padding=0
margin=0
gray=0
mobile=0
inner_margin=0

43
source/components/tree/ul-doc-info-page/_index.html Normal file
View File

@@ -0,0 +1,43 @@
<div class="ul-bg-black">
<div class="ul-doc-info-page">
<div class="ul-doc-info-page-list">
<div class="ul-doc-info-page-item page level-0">
文章标题
</div>
<div class="ul-doc-info-page-item page level-0">
文章标题
</div>
<div class="ul-doc-info-page-item group level-0">
文章分组
</div>
<div class="ul-doc-info-page-item page level-1">
二级文章标题
</div>
<div class="ul-doc-info-page-item page level-1">
二级文章标题
</div>
<div class="ul-doc-info-page-item point level-2">
文章内部锚点
</div>
<div class="ul-doc-info-page-item point level-2">
文章内部锚点
</div>
<div class="ul-doc-info-page-item group level-0">
文章分组
</div>
<div class="ul-doc-info-page-item page level-1">
二级文章标题
</div>
<div class="ul-doc-info-page-item page level-1">
二级文章标题
</div>
<div class="ul-doc-info-page-item point level-2">
文章内部锚点
</div>
<div class="ul-doc-info-page-item point level-2">
文章内部锚点
</div>
</div>
</div>
</div>

0
source/components/tree/ul-doc-info-page/_index.md Normal file
View File

5
source/components/tree/ul-doc-info-page/_index.php Normal file
View File

@@ -0,0 +1,5 @@
<?php
return [
];

49
source/components/tree/ul-doc-info-page/_index.scss Normal file
View File

@@ -0,0 +1,49 @@
.ul-doc-info-page-list {
padding: 15px;
color : #999;
}
.ul-doc-info-page-item {
line-height: 2;
padding : 0 15px;
position : relative;
}
.ul-doc-info-page-item.page {
cursor : pointer;
font-size: 18px;
}
.ul-doc-info-page-item.group {
color : #bbb;
font-size: 16px;
}
.ul-doc-info-page-item.point {
color : #eee;
font-size: 14px;
}
.ul-doc-info-page-item.page:hover {
background-color: #555;
}
.ul-doc-info-page-item.level-0 {}
.ul-doc-info-page-item.level-1 {
margin-left: 15px;
}
.ul-doc-info-page-item.level-2 {
margin-left: 30px;
}
.ul-doc-info-page-item.level-3 {
margin-left: 45px;
}

49
source/scss/layui-ul.scss
View File

@@ -183,55 +183,6 @@
.ul-doc-info-page-list {
padding: 15px;
color : #999;
}
.ul-doc-info-page-item {
line-height: 2;
padding : 0 15px;
position : relative;
}
.ul-doc-info-page-item.page {
cursor : pointer;
font-size: 18px;
}
.ul-doc-info-page-item.group {
color : #bbb;
font-size: 16px;
}
.ul-doc-info-page-item.point {
color : #eee;
font-size: 14px;
}
.ul-doc-info-page-item.page:hover {
background-color: #555;
}
.ul-doc-info-page-item.level-0 {}
.ul-doc-info-page-item.level-1 {
margin-left: 15px;
}
.ul-doc-info-page-item.level-2 {
margin-left: 30px;
}
.ul-doc-info-page-item.level-3 {
margin-left: 45px;
}
.ul-timeline-rowstyle { .ul-timeline-rowstyle {
display : flex; display : flex;
flex-wrap : nowrap; flex-wrap : nowrap;