channel_business/pages/msgModule/index.wxss

/* pages/msgPage/msgPage.wxss */
.msg-page {
    min-height: calc(100vh - 150rpx);
}
.top-view {
    background: #fff;
    box-sizing: border-box;
    padding: 0 20rpx;
    height: 88rpx;
    line-height: 88rpx;
    box-shadow: -1px 3px 12px 4px rgba(186, 186, 186, 0.1);
    border-radius: 20rpx;
    margin-bottom: 20rpx;
}
.top-view .msg-top-img {
    width: 87rpx;
    height: 67rpx;
    margin-right: 26rpx;
    position: relative;
    top: 13rpx;
}
.top-view .msg-text{
    font-size: 24rpx;
    color: #728dd4;
    margin-right: 10rpx;
}

.top-view .msg-btn-go .van-button{
    width: 144rpx;
    margin-right: 10rpx;
}

.top-view .msg-colse-img{
    width: 30rpx;
    height: 30rpx;
    margin-left: 10rpx;
    margin-top: 29rpx;
}

.msg-box-view {
    background: #fff;
    box-sizing: border-box;
    border-radius: 20rpx;
    min-height: calc(100vh - 150rpx);
}
.msg-box-view.topShow{
    min-height: calc(100vh - 258rpx);
}

.msg-box-view.not-msg-data{
    text-align: center;
    box-sizing: border-box;
    padding-top: 140rpx;
}
.msg-box-view.not-msg-data .not-msg-data-img{
    width: 302rpx;
    height: 224rpx;
}

.msg-box-view.not-msg-data .not-data-msg-info{
    font-size: 24rpx;
    color: #b3bfcb;
    margin-top: 20rpx;
}

.msg-li-item {
    height: 140rpx;
    border-bottom: 1rpx solid #d9dde5;
    box-sizing: border-box;
    /* padding: 26rpx 0; */
    padding-top: 20rpx;
}

.msg-li-item .chatheads-view{
    width: 88rpx;
    height: 88rpx;
    margin: 0 20rpx;
    border-radius: 50%;
    margin-top: 7rpx;
    position: relative;
}
.msg-li-item .chatheads-view .other-head-img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.msg-li-item .msg-content {
    width: calc(100% - 140rpx);
}
.msg-li-item .msg-content .msg-nickName{
    font-size: 30rpx;
    line-height: 56rpx;
    width: 100%;
}
.msg-li-item .msg-content .msg-last-content,
.msg-li-item .msg-content .msg-last-content-date{
    font-size: 24rpx;
    color: #999;
}

.msg-li-item .msg-content .msg-last-content-date {
    margin-right: 20rpx;
}
.msg-li-item .msg-content .msg-last-content {
    max-width: calc(100% - 270rpx);
}

.msg-li-item .chatheads-view .view-info {
    position: absolute;
    right: -8rpx;
    top: -8rpx;
    background: red;
    color: #fff;
    font-size: 12px;
    border-radius: 50%;
    box-sizing: border-box;
    min-width: 30rpx;
    height: 30rpx;
    line-height: 30rpx;
    text-align: center;
}