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-08-31 11:56:47 +08:00
parent 480076c74f
commit 3fb89f2d58
10 changed files with 201 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
source/components/_index.scss
View File

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

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

@@ -0,0 +1,6 @@
title=内容丰富的留言列表
padding=1
margin=0
gray=1
mobile=0
inner_margin=0

54
source/components/list/ul-message-list/_index.html Normal file
View File

@@ -0,0 +1,54 @@
<div class="ul-message-list">
<div
class="ul-message-item ul-bg-white"
data-repeat="3"
>
<div class="ul-message-item-left">
<div
class="ul-message-item-avatar"
style="background-image: url('/static/images/avatar.png');"
>
</div>
</div>
<div class="ul-message-item-right">
<div class="ul-message-item-info">
<div class="ul-message-item-name">
<div class="data-item">
奥古斯宏
</div>
<div class="data-item">
程序员
</div>
</div>
<div class="ul-message-item-data">
<div class="data-item split-border">
<span class="data-title">联系方式:</span>
<span class="data-value">13012341234</span>
</div>
<div class="data-item">
<span class="data-title">价位:</span>
<span class="data-value">￥3</span>
</div>
</div>
<div class="ul-message-item-options">
<div class="layui-btn">查看详情</div>
</div>
</div>
<div class="ul-message-item-content">
百度是拥有强大互联网基础的领先AI公司。百度愿景是：成为最懂用户，并能帮助人们成长的全球顶级高科技公司。“百度”二字，来自于八百年前南宋词人辛弃疾的一句词：众里寻他千百度。这句话描述了词人对理想的执着追求。
</div>
<div class="ul-message-item-img-list">
<div
class="ul-message-item-img"
style="background-image: url('/static/images/view.jpg');"
data-repeat="4"
>
</div>
</div>
</div>
</div>
</div>

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

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

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

68
source/components/list/ul-message-list/_index.scss Normal file
View File

@@ -0,0 +1,68 @@
.ul-message-list {}
.ul-message-item {
margin-bottom : 15px;
display : flex;
justify-content: flex-start;
align-items : flex-start;
padding : 15px;
}
.ul-message-item-left {
width: 120px;
}
.ul-message-item-right {
width: calc(100% - 120px);
}
.ul-message-item-info {
position: relative;
}
.ul-message-item-options {
position: absolute;
right : 0;
top : 0;
}
.ul-message-item-avatar {
background-size : cover;
background-position: center;
width : 100px;
height : 100px;
border-radius : 50%;
}
.ul-message-item-name {
display : flex;
color : #6cf;
font-size: 16px;
}
.ul-message-item-data {
display : flex;
font-size : 14px;
color : #999;
margin-top: 10px;
}
.ul-message-item-content {
background-color: #f0f0f0;
padding : 15px;
margin-top : 10px;
}
.ul-message-item-img-list {
margin-top: 10px;
}
.ul-message-item-img {
width : 160px;
height : 120px;
background-size : cover;
background-position: center;
margin-right : 10px;
display : inline-block;
}

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

@@ -73,73 +73,6 @@
display: block;
}
.ul-message-list {}
.ul-message-item {
margin-bottom : 15px;
display : flex;
justify-content: flex-start;
align-items : flex-start;
padding : 15px;
}
.ul-message-item-left {
width: 120px;
}
.ul-message-item-right {
width: calc(100% - 120px);
}
.ul-message-item-info {
position: relative;
}
.ul-message-item-options {
position: absolute;
right : 0;
top : 0;
}
.ul-message-item-avatar {
background-size : cover;
background-position: center;
width : 100px;
height : 100px;
border-radius : 50%;
}
.ul-message-item-name {
display : flex;
color : #6cf;
font-size: 16px;
}
.ul-message-item-data {
display : flex;
font-size : 14px;
color : #999;
margin-top: 10px;
}
.ul-message-item-content {
background-color: #f0f0f0;
padding : 15px;
margin-top : 10px;
}
.ul-message-item-img-list {
margin-top: 10px;
}
.ul-message-item-img {
width : 160px;
height : 120px;
background-size : cover;
background-position: center;
margin-right : 10px;
display : inline-block;
}
.ul-nav-easy {
background-color: transparent;