@import '~css/public.scss';

.LoadMore{
    width: 100%;
    height: .3rem;
    line-height: .3rem;
    text-align: center;
    display: none;
    span{
        font-size: .12rem;
        display: none;
    }
    &.loading{
        display:block;
        span:nth-of-type(1){
            padding-left: .3rem;
            background: url('../../images/loading.gif') no-repeat left center;
            background-size: .2rem;
            display:inline-block;
        }
        span:nth-of-type(2){
            display: none;
        }
    }
    &.finished{
        display:block;
        span:nth-of-type(1){
            display: none;
        }
        span:nth-of-type(2){
            display:inline-block;
            position: relative;
            &:before,&:after{
                content: "";
                width: .5rem;
                height: .01rem;
                background-color: $minorText;
                position: absolute;
                top: 50%;
            }

            &:before{
                left: 0;
                transform: translate3d(-110%,0,0);
                -webkit-transform: translate3d(-110%,0,0);
            }
            &:after{
                right: 0;
                transform: translate3d(110%,0,0);
                -webkit-transform: translate3d(110%,0,0);
            }
        }
    }
}