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

新增用户信息列表卡片

Browse Source
This commit is contained in:
augushong
2023-05-20 17:18:03 +08:00
parent 4090314532
commit 3c071d54b4
10 changed files with 207 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -76,7 +76,7 @@
background-size: cover; background-size: cover;
background-position: center; background-position: center;
} }
.ul-demo-img-bg.circel { .ul-demo-img-bg.circle {
border-radius: 100%; border-radius: 100%;
} }
@@ -1581,6 +1581,69 @@
color: orangered; color: orangered;
} }
.ul-list-user-info .item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 9px;
background-color: #fff;
}
.ul-list-user-info .item:not(:last-child) {
border-bottom: 1px solid #eee;
}
.ul-list-user-info .item .info {
display: flex;
align-items: center;
justify-content: flex-start;
flex-shrink: 1;
}
.ul-list-user-info .item .info .main {
margin-left: 9px;
}
.ul-list-user-info .item .info .main .header {
display: flex;
align-items: center;
margin-bottom: 8px;
}
.ul-list-user-info .item .info .main .header .name {
font-size: 14px;
font-weight: 500;
margin-right: 6px;
}
.ul-list-user-info .item .info .main .content {
display: flex;
flex-wrap: wrap;
margin-bottom: 6px;
}
.ul-list-user-info .item .info .main .footer {
display: flex;
align-items: flex-end;
}
.ul-list-user-info .tag-item {
font-size: 10px;
background-color: #c6e6fe;
color: #0091ff;
padding: 2px 4px;
border-radius: 3px 3px 3px 0;
margin-right: 6px;
}
.ul-list-user-info .info-item {
color: #999;
margin-right: 6px;
font-size: 12px;
}
.ul-list-user-info .title-item {
font-size: 14px;
font-weight: 500;
margin-right: 6px;
}
.ul-list-user-info .text-item {
color: #1E9FFF;
margin-right: 6px;
font-size: 12px;
line-height: 18px;
}
.ul-music-list .ul-music-list-item { .ul-music-list .ul-music-list-item {
display: flex; display: flex;
align-items: center; align-items: center;

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

@@ -17,6 +17,7 @@
@import './list/ul-course-list/index'; @import './list/ul-course-list/index';
@import './list/ul-course-sidebar-list/index'; @import './list/ul-course-sidebar-list/index';
@import './list/ul-list-record/index'; @import './list/ul-list-record/index';
@import './list/ul-list-user-info/index';
@import './list/ul-music-list/index'; @import './list/ul-music-list/index';
@import './list/ul-note-list/index'; @import './list/ul-note-list/index';
@import './list/ul-order-list-simple-card/index'; @import './list/ul-order-list-simple-card/index';

2
source/components/card/ul-card-avatar-info/_index.html
View File

@@ -33,7 +33,7 @@
</div> </div>
</div> </div>
<div class="fixed-container"> <div class="fixed-container">
<div class="ul-demo-img-bg circel" style="width: 48px;height: 48px;"></div> <div class="ul-demo-img-bg circle" style="width: 48px;height: 48px;"></div>
</div> </div>
</div> </div>
</div> </div>

6
source/components/list/ul-list-user-info/_index.env Normal file
View File

@@ -0,0 +1,6 @@
title=用户信息列表
padding=0
margin=0
gray=1
mobile=1
inner_margin=0

49
source/components/list/ul-list-user-info/_index.html Normal file
View File

@@ -0,0 +1,49 @@
<div class="ul-list-user-info">
<div class="item" data-repeat="4">
<div class="info">
<div class="avatar ul-demo-img-bg circle" style="width: 60px;height: 60px;">
</div>
<div class="main">
<div class="header">
<div class="name">
奥古斯宏
</div>
<div class="tag-item">
8年经验
</div>
<div class="tag-item">
全栈开发
</div>
</div>
<div class="content">
<div class="info-item">
PHP全栈开发
</div>
<div class="info-item">
开源
</div>
<div class="info-item">
山东
</div>
</div>
<div class="footer">
<div class="title-item">
￥ 2200
</div>
<div class="text-item">
山东
</div>
<div class="text-item">
3.3.km
</div>
</div>
</div>
</div>
<div class="option">
<div class="layui-btn layui-btn-sm">
联系
</div>
</div>
</div>
</div>

0
source/components/list/ul-list-user-info/_index.md Normal file
View File

5
source/components/list/ul-list-user-info/_index.php Normal file
View File

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

79
source/components/list/ul-list-user-info/_index.scss Normal file
View File

@@ -0,0 +1,79 @@
.ul-list-user-info {
.item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 9px;
background-color: #fff;
&:not(:last-child) {
border-bottom: 1px solid #eee;
}
.info {
display: flex;
align-items: center;
justify-content: flex-start;
flex-shrink: 1;
.main {
margin-left: 9px;
.header {
display: flex;
align-items: center;
margin-bottom: 8px;
.name {
font-size: 14px;
font-weight: 500;
margin-right: 6px;
}
}
.content {
display: flex;
flex-wrap: wrap;
margin-bottom: 6px;
}
.footer {
display: flex;
align-items: flex-end;
}
}
}
}
.tag-item {
font-size: 10px;
background-color: #c6e6fe;
color: #0091ff;
padding: 2px 4px;
border-radius: 3px 3px 3px 0;
margin-right: 6px;
}
.info-item {
color: #999;
margin-right: 6px;
font-size: 12px;
}
.title-item {
font-size: 14px;
font-weight: 500;
margin-right: 6px;
}
.text-item {
color: #1E9FFF;
margin-right: 6px;
font-size: 12px;
line-height: 18px;
}
}

2
source/scss/_common.scss
View File

@@ -79,7 +79,7 @@
background-size: cover; background-size: cover;
background-position: center; background-position: center;
&.circel { &.circle {
border-radius: 100%; border-radius: 100%;
} }
} }