Signed-off-by: a123456 <1209165801@qq.com>
This commit is contained in:
parent
9b306f83f0
commit
3797ae5dc7
Binary file not shown.
After Width: | Height: | Size: 320 KiB |
|
@ -0,0 +1,9 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title></title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -32,11 +32,12 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<span v-text="material.title"></span>
|
<span v-text="material.title"></span>
|
||||||
<img v-lazy="material.img" />
|
<img :src="material.img" />
|
||||||
<p v-text="material.det"></p>
|
<p v-text="material.det"></p>
|
||||||
</div>
|
</div>
|
||||||
<div class="footer">
|
<div class="footer">
|
||||||
<i class="el-icon-edit"></i>
|
<i class="el-icon-edit"></i>
|
||||||
|
<em></em>
|
||||||
<i class="el-icon-delete"></i>
|
<i class="el-icon-delete"></i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -62,13 +63,13 @@
|
||||||
materialList: [{
|
materialList: [{
|
||||||
date: '12月27日',
|
date: '12月27日',
|
||||||
title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
|
title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
|
||||||
img: '',
|
img: '../images/data/img.png',
|
||||||
det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价,后置摄像头后置莱卡散射,12000万亿像素(光脚,1/1.6光圈)+1200万像素(超广角),......'
|
det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价,后置摄像头后置莱卡散射,12000万亿像素(光脚,1/1.6光圈)+1200万像素(超广角),......'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
date: '12月27日',
|
date: '12月27日',
|
||||||
title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
|
title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...',
|
||||||
img: '',
|
img: '../images/data/img.png',
|
||||||
det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价,后置摄像头后置莱卡散射,12000万亿像素(光脚,1/1.6光圈)+1200万像素(超广角),......'
|
det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价,后置摄像头后置莱卡散射,12000万亿像素(光脚,1/1.6光圈)+1200万像素(超广角),......'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
|
|
@ -39,13 +39,13 @@
|
||||||
@titleColor: #333;
|
@titleColor: #333;
|
||||||
//内容字体样式
|
//内容字体样式
|
||||||
@contentSize: 14px;
|
@contentSize: 14px;
|
||||||
@contentColor: #333;
|
@contentColor: #999;
|
||||||
// 默认字体样式
|
// 默认字体样式
|
||||||
@defalutSize: 14px;
|
@defalutSize: 14px;
|
||||||
@defalutColor: #333;
|
@defalutColor: #333;
|
||||||
//辅助性描述样式
|
//辅助性描述样式
|
||||||
@auxiliarySize: 12px;
|
@auxiliarySize: 12px;
|
||||||
@auxiliaryColor: #999;
|
@auxiliaryColor: #aaa;
|
||||||
|
|
||||||
/*
|
/*
|
||||||
*头像
|
*头像
|
||||||
|
|
|
@ -50,7 +50,7 @@ input::-webkit-input-placeholder,
|
||||||
textarea::-webkit-input-placeholder {
|
textarea::-webkit-input-placeholder {
|
||||||
font-weight: initial;
|
font-weight: initial;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: #999;
|
color: #aaa;
|
||||||
resize: none;
|
resize: none;
|
||||||
}
|
}
|
||||||
*::-webkit-scrollbar {
|
*::-webkit-scrollbar {
|
||||||
|
@ -120,14 +120,46 @@ textarea::-webkit-input-placeholder {
|
||||||
border-bottom: 1px solid #e6e6e6;
|
border-bottom: 1px solid #e6e6e6;
|
||||||
padding: 10px 0;
|
padding: 10px 0;
|
||||||
}
|
}
|
||||||
|
.ms-admin-material-list .ms-admin-material-item .head span {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
.ms-admin-material-list .ms-admin-material-item .body {
|
.ms-admin-material-list .ms-admin-material-item .body {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
line-height: 2em;
|
||||||
|
}
|
||||||
|
.ms-admin-material-list .ms-admin-material-item .body span {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.ms-admin-material-list .ms-admin-material-item .body img {
|
||||||
|
width: 170px;
|
||||||
|
height: 110px;
|
||||||
|
margin: 0.5em auto;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
.ms-admin-material-list .ms-admin-material-item .body p {
|
||||||
|
margin: 0;
|
||||||
|
color: #999;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
}
|
}
|
||||||
.ms-admin-material-list .ms-admin-material-item .footer {
|
.ms-admin-material-list .ms-admin-material-item .footer {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: 14px 0;
|
padding: 14px 0;
|
||||||
}
|
}
|
||||||
.ms-admin-material-list .ms-admin-material-item .footer i {
|
.ms-admin-material-list .ms-admin-material-item .footer i {
|
||||||
|
color: #999;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.ms-admin-material-list .ms-admin-material-item .footer em {
|
||||||
|
width: 1px;
|
||||||
|
height: 1em;
|
||||||
|
background: #e6e6e6;
|
||||||
}
|
}
|
||||||
|
|
|
@ -15,16 +15,39 @@
|
||||||
.head {
|
.head {
|
||||||
border-bottom: 1px solid #e6e6e6;
|
border-bottom: 1px solid #e6e6e6;
|
||||||
padding: 10px 0;
|
padding: 10px 0;
|
||||||
|
span {
|
||||||
|
color: @contentColor;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.body {
|
.body {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
line-height: 2em;
|
||||||
|
span {
|
||||||
|
.ms-ellipsis;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
.ms-width-height(170px, 110px);
|
||||||
|
margin: 0.5em auto;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
color: @contentColor;
|
||||||
|
.ms-ellipsis-clamp(3);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.footer {
|
.footer {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: 14px 0;
|
padding: 14px 0;
|
||||||
i {
|
i {
|
||||||
|
color: @contentColor;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
em {
|
||||||
|
.ms-width-height(1px, 1em);
|
||||||
|
background: #e6e6e6;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue