light-application/light-application-wx/pages/chat-room/chat-room.wxss

/* pages/chat-room/chat-room.wxss */
.chat-room {
    padding: 30rpx;
    width: 93%;
}

.chat {
    width: 99%;
    display: flex;
    height: 100rpx;
    display: inline-flex;
    flex-direction: row;
    border-bottom: solid 1rpx #ece9e4;
    padding-bottom: 10rpx;
    margin-top: 20rpx;
}

.photo {
    width: 100rpx;
    height: 100rpx;
    border-radius: 50rpx;
}

.item-row {
    display: inline-flex;
    flex-direction: column;
    height: 100rpx;
    width: 82%;
    margin-left: 15rpx;
}

.chat-name {
    font-size: 1.1em;
}

.chat-time {
    font-size: .9em;
    color: #9a9a9a;
    position: absolute;
    right: 40rpx;
}

.chat-content {
    font-size: .9em;
    color: #aaa9a8;
    line-height: 50rpx;
    max-width: 80%;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.unread-num {
    background-color: #e95543;
    width: 40rpx;
    height: 40rpx;
    border-radius: 20rpx;
    text-align: center;
    color: white;
    position: absolute;
    right: 48rpx;
    margin-top: 48rpx;
}