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
2024-03-13 16:41:33 +08:00
parent d427261737
commit b84c93cd0a
10 changed files with 102 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
source/components/card/ul-data-card/_index.env Normal file
View File

@@ -0,0 +1,6 @@
title=数据详情卡片-简约
padding=0
margin=0
gray=0
mobile=1
inner_margin=0

43
source/components/card/ul-data-card/_index.html Normal file
View File

@@ -0,0 +1,43 @@
<div class="ul-data-card">
<div class="header">
<div class="mian">
<i class="layui-icon layui-icon-user"></i>
<span>奥古斯宏</span>
</div>
<div class="plus">
<div class="layui-btn layui-btn-sm">详情</div>
</div>
</div>
<div class="body">
<div class="main">
<div class="item" data-repeat="3">
<div class="item-title">
姓名：
</div>
<div class="item-value">
张三
</div>
</div>
<div class="item">
<div class="item-title">
地址：
</div>
<div class="item-value">
内蒙古大兴安岭雷达峰红岸基地
</div>
</div>
</div>
</div>
<div class="footer">
<div class="main">
2022年4月14日21:28:44
</div>
<div class="plus">
<div class="layui-btn layui-btn-sm layui-btn-normal">删除</div>
<div class="layui-btn layui-btn-sm layui-btn-primary">修改</div>
</div>
</div>
</div>

0
source/components/card/ul-data-card/_index.md Normal file
View File

5
source/components/card/ul-data-card/_index.php Normal file
View File

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

51
source/components/card/ul-data-card/_index.scss Normal file
View File

@@ -0,0 +1,51 @@
.ul-data-card {
margin : 15px;
padding : 15px;
box-shadow : 0 0 3px #bbb;
border-radius: 5px;
.header {
display : flex;
align-items : center;
justify-content: space-between;
padding-bottom : 10px;
border-bottom : 1px solid #eee;
}
.body {
padding: 10px 0;
.main {
display : flex;
align-items : flex-start;
justify-content: flex-start;
flex-wrap : wrap;
.item {
min-width : 50%;
display : flex;
align-items : center;
margin-bottom: 10px;
.item-title {
font-size : 14px;
font-weight: 600;
}
.item-value {
font-size: 14px;
}
}
}
}
.footer {
border-top : 1px solid #eee;
padding-top : 10px;
display : flex;
justify-content: space-between;
align-items : center
}
}