368 lines
6.3 KiB
Plaintext
368 lines
6.3 KiB
Plaintext
/* packageA/mycomponent/invitation/invitation.wxss */
|
|
@import "/mycss/stylesheet.wxss";
|
|
@import "/mycss/iconfont.wxss";
|
|
|
|
.list-post {
|
|
width: 100%;
|
|
padding: 0 0 40rpx;
|
|
z-index: 9999;
|
|
height: 92.5vh;
|
|
overflow-y: scroll;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
.list-post .item {
|
|
padding: 20rpx 30rpx;
|
|
box-sizing: border-box;
|
|
margin-bottom: 20rpx;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.list-post .item .userInfo {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.list-post .item .avatar {
|
|
width: 50rpx;
|
|
height: 50rpx;
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
background-color: #c8c8c8;
|
|
}
|
|
|
|
.list-post .item .avatar image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.list-post .item .nickname {
|
|
font-size: 14px;
|
|
max-width: 300rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
|
|
.list-post .item .evaluate {
|
|
margin-top: 25rpx;
|
|
}
|
|
|
|
.list-post .item .evaluate .message {
|
|
font-size: 13px;
|
|
margin-left: 5rpx;
|
|
color: #3c3c3c;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
overflow: hidden;
|
|
-webkit-line-clamp: 5;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
|
|
.list-post .item .evaluate .album .img {
|
|
display: inline-block;
|
|
width: 206rpx;
|
|
height: 206rpx;
|
|
margin: 10rpx;
|
|
background-color: #ececec;
|
|
border-radius: 10rpx;
|
|
}
|
|
|
|
.list-post .item .bottom {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.list-post .item .bottom .iconfont {
|
|
display: inherit;
|
|
}
|
|
|
|
.list-post .item .comment,
|
|
.link {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.comment {
|
|
color: #929292;
|
|
}
|
|
|
|
.link {
|
|
margin-left: 50rpx;
|
|
color: #ff9600;
|
|
}
|
|
|
|
.moreText {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 27rpx;
|
|
color: #6666;
|
|
margin: 20rpx 0;
|
|
}
|
|
|
|
/* 新样式 */
|
|
.panel {
|
|
margin: 20rpx;
|
|
border-radius: 20rpx;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.posts-live {
|
|
padding: 0 20rpx;
|
|
}
|
|
|
|
.posts-live .posts-live-tabs {
|
|
width: 500rpx;
|
|
padding-bottom: 22rpx;
|
|
}
|
|
|
|
.posts-live .posts-live-tabs .van-tabs__line {
|
|
bottom: 5px;
|
|
}
|
|
|
|
.posts-live .posts-live-tabs .tabs-item {
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
color: #aaa;
|
|
}
|
|
|
|
.posts-live .posts-live-tabs .tabs-item.active {
|
|
position: relative;
|
|
color: #484848;
|
|
}
|
|
|
|
.posts-live .posts-live-tabs .tabs-item.active::before {
|
|
content: "";
|
|
position: absolute;
|
|
left: 50%;
|
|
bottom: -15rpx;
|
|
transform: translateX(-50%);
|
|
display: block;
|
|
width: 66rpx;
|
|
height: 8rpx;
|
|
background-color: #f14e4e;
|
|
border-radius: 4rpx;
|
|
}
|
|
|
|
.posts-live .posts-box {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
column-gap: 12rpx;
|
|
row-gap: 12rpx;
|
|
}
|
|
|
|
.posts-live .posts-box .posts-item {
|
|
width: 100%;
|
|
height: 0;
|
|
padding-bottom: 100%;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
}
|
|
|
|
.posts-box-out,
|
|
.live-room {
|
|
position: relative;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.live-room .my-swipe {
|
|
width: 100%;
|
|
height: 520rpx;
|
|
}
|
|
|
|
.live-room .my-swipe-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
flex-wrap: wrap;
|
|
padding-bottom: 30rpx;
|
|
}
|
|
|
|
.text-overHide {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
/* 自定义轮播指示点样式 */
|
|
.indication {
|
|
width: 400rpx;
|
|
height: 36rpx;
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
/* 未选中指示点样式 */
|
|
|
|
.spot {
|
|
width: 12rpx;
|
|
height: 10rpx;
|
|
border-radius: 50%;
|
|
margin-right: 26rpx;
|
|
background-color: #c2c2c2;
|
|
}
|
|
|
|
/* 选中指示样式 */
|
|
|
|
.spot.active {
|
|
width: 22rpx;
|
|
height: 10rpx;
|
|
border-radius: 6rpx;
|
|
background-color: #f14e4e;
|
|
}
|
|
|
|
.live-room .live-room-item {
|
|
position: relative;
|
|
width: 48%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.live-room .live-room-item .live-bg {
|
|
width: 100%;
|
|
height: 420rpx;
|
|
position: relative;
|
|
border-radius: 25rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.live-room .live-room-item .live-bg .live-bg-img {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
border-radius: 26rpx;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.live-room .live-room-item .live-bg .live-top {
|
|
position: absolute;
|
|
top: 20rpx;
|
|
left: 10rpx;
|
|
display: flex;
|
|
}
|
|
|
|
.live-room .live-room-item .live-bg .live-top .living {
|
|
width: 68rpx;
|
|
height: 40rpx;
|
|
line-height: 40rpx;
|
|
font-size: 22rpx;
|
|
text-align: center;
|
|
background-color: #ff2c29;
|
|
border-radius: 8rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
.live-room .live-room-item .live-bg .live-top .isBack {
|
|
width: 68rpx;
|
|
height: 40rpx;
|
|
line-height: 40rpx;
|
|
font-size: 22rpx;
|
|
text-align: center;
|
|
background-color: #999;
|
|
border-radius: 8rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
.live-room .live-room-item .live-bg .live-top .live-num {
|
|
width: 122rpx;
|
|
height: 40rpx;
|
|
line-height: 40rpx;
|
|
font-size: 22rpx;
|
|
text-align: center;
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|
border-radius: 8rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
.live-room .live-room-item .live-bg .live-top .goods_icon {
|
|
font-size: 12px;
|
|
height: 40rpx;
|
|
line-height: 40rpx;
|
|
position: relative;
|
|
margin-left: 40rpx;
|
|
}
|
|
|
|
.live-bg .live-top .goods_icon .icon-customform_list_2 {
|
|
margin-top: -9px;
|
|
font-size: 40rpx;
|
|
color: #ffa303;
|
|
}
|
|
|
|
.live-bg .live-top .goods_icon .num {
|
|
position: absolute;
|
|
background-color: #fff;
|
|
border-radius: 10rpx;
|
|
color: #f00;
|
|
top: 0;
|
|
right: -18rpx;
|
|
height: 28rpx;
|
|
line-height: 28rpx;
|
|
font-size: 20rpx;
|
|
padding: 0 6rpx;
|
|
}
|
|
|
|
.live-room .live-room-item .live-bg .live-title {
|
|
position: absolute;
|
|
bottom: 30rpx;
|
|
left: 10rpx;
|
|
font-size: 28rpx;
|
|
text-align: left;
|
|
margin-right: 14rpx;
|
|
color: #fff;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
overflow: hidden;
|
|
-webkit-line-clamp: 2;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
|
|
.live-room .live-room-item .user {
|
|
/* position: absolute;
|
|
bottom: -36rpx; */
|
|
transform: translateY(-16rpx);
|
|
display: flex;
|
|
align-items: flex-end;
|
|
margin-left: 12rpx;
|
|
}
|
|
|
|
.live-room .live-room-item .user .user-photo {
|
|
width: 56rpx;
|
|
height: 56rpx;
|
|
}
|
|
|
|
.live-room .live-room-item .user .user-photo image {
|
|
border: solid 2px #fff;
|
|
border-radius: 50%;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.live-room .live-room-item .user .user-name {
|
|
margin-left: 4rpx;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.posts-live .posts-live-all {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 20rpx 20rpx 10rpx 20rpx;
|
|
}
|
|
|
|
.posts-live .posts-live-all .text {
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
color: #5e5e5e;
|
|
}
|
|
|
|
.posts-live .posts-live-all .icon-advertise-next {
|
|
color: #616161;
|
|
}
|