ulthon/layui-ul
1
0
Fork 0
mirror of https://gitee.com/ulthon/layui-ul.git synced 2026-07-09 13:42:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

增加大块导航组件

Browse Source
This commit is contained in:
augushong
2023-04-18 09:29:22 +08:00
parent 6afae57896
commit 32fc9de906
8 changed files with 93 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1647,6 +1647,31 @@
font-size: clac(20px); font-size: clac(20px);
} }
.ul-nav-block {
border-radius: 16px;
overflow: hidden;
background-color: #fff;
color: #333;
}
.ul-nav-block .item {
padding: 16px 32px;
display: flex;
align-items: center;
justify-content: flex-start;
cursor: pointer;
}
.ul-nav-block .item .item-icon {
margin-right: 16px;
}
.ul-nav-block .item.current {
background-color: rgb(255, 91, 114);
color: #fff;
}
.ul-nav-block .item:hover {
background-color: rgba(255, 91, 113, 0.772);
color: #fff;
}
.ul-nav-grid { .ul-nav-grid {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;

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

@@ -18,5 +18,6 @@
@import './list/ul-photo-list-b/index'; @import './list/ul-photo-list-b/index';
@import './list/ul-site-group/index'; @import './list/ul-site-group/index';
@import './logo/ul-logo/index'; @import './logo/ul-logo/index';
@import './nav/ul-nav-block/index';
@import './nav/ul-nav-grid/index'; @import './nav/ul-nav-grid/index';
@import './nav/ul-nav-info/index'; @import './nav/ul-nav-info/index';

6
source/components/nav/ul-nav-block/_index.env Normal file
View File

@@ -0,0 +1,6 @@
title=大块导航
padding=1
margin=0
gray=1
mobile=0
inner_margin=0

26
source/components/nav/ul-nav-block/_index.html Normal file
View File

@@ -0,0 +1,26 @@
<div class="ul-nav-block" style="width: 160px;">
<div class="item current">
<div class="item-icon">
<i class="layui-icon layui-icon-chart"></i>
</div>
<div class="item-title">首页</div>
</div>
<div class="item">
<div class="item-icon">
<i class="layui-icon layui-icon-light"></i>
</div>
<div class="item-title">订单管理</div>
</div>
<div class="item">
<div class="item-icon">
<i class="layui-icon layui-icon-app"></i>
</div>
<div class="item-title">产品管理</div>
</div>
<div class="item">
<div class="item-icon">
<i class="layui-icon layui-icon-about"></i>
</div>
<div class="item-title">其他</div>
</div>
</div>

0
source/components/nav/ul-nav-block/_index.md Normal file
View File

5
source/components/nav/ul-nav-block/_index.php Normal file
View File

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

29
source/components/nav/ul-nav-block/_index.scss Normal file
View File

@@ -0,0 +1,29 @@
.ul-nav-block {
border-radius: 16px;
overflow: hidden;
background-color: #fff;
color: #333;
.item {
padding: 16px 32px;
display: flex;
align-items: center;
justify-content: flex-start;
cursor: pointer;
.item-icon {
margin-right: 16px;
}
&.current {
background-color: rgb(255, 91, 114);
color: #fff;
}
&:hover {
background-color: rgba(255, 91, 113, 0.772);
color: #fff;
}
}
}