@import "../public/public.less";
@import "../public/header.less";

//侧滑列表
.user-list{
    width: 100%;
    height: 100%;
    overflow: auto;
    position: absolute;
    top: 44px;
    bottom: 0;
    left: 0;
    height: auto;   
}   
.user-list-scroll .user-list-row{     
    position: relative;
    overflow: hidden;
    .user-list-handle{
        position: relative;
        .transition(left 0.4s ease);
        left: 0;
        background-color: @BODY-BG-COLOR;
        padding: 15px 20px;
        .display-box();
        .box-vertical-alignment();
        z-index: 2;
        .user-list-image{
            width: 50px;
            height: 50px;
            margin-right: 10px;
        }   
        .user-list-icon{
            margin-right: 10px;
            .iconfont(@SWIPELIST-COMPONENT-ICON-FONTSIZE);
        }
        div{
            .flex();
            min-width: 0;
        }
        .user-list-title{
            .text_oneRow_ellipsis();
        }   
        .user-sub-image{
            width: 17px;
            height: 17px;
        }
        .user-list-subtitle{
            .text_oneRow_ellipsis();
            display: inline-block;
        }   
        &.user-list-selected{
            left: -120px;
        }  
        &:after{
            content: "\e611";
            display: block;
            .iconfont(@TEXT-COMPONENT-ICON-FONTSIZE);
            .transform(rotate(180deg));
        }                    
    }
    .user-list-button{
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        z-index: 1;
        div{
            width: 60px;
            height: 100%;
            .display-box();
            .box-horizontal-alignment();
            .box-vertical-alignment();
            color: @SWIPELIST-COMPONENT-BUTTON-COLOR;
            float: left;
            &:nth-last-of-type(1){
                background-color: transparent;
                .iconfont(@TEXT-COMPONENT-ICON-FONTSIZE);
                color: #00FFFF;
            }
        }
    }                   
    &:after{
        .defaultBorder();
        z-index: 2;
        .white_gradient_border();
    }
}