layui-ul/source/components/list/ul-message-list/_index.scss

.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;
}