/**
 * @Author: yanxinaliang (rainyxlxl@163.com)
 * @Date: 2019/4/7 22:52
 * @Last Modified by: yanxinaliang (rainyxlxl@163.com)
 * @Last Modified time: 2019/4/7 22:52
 * @disc:Pagination
 */
@import "cursor";
@bottom:30px;
@height:44px;
@fontSize:18px;
@fontColor:#666;
@splitPadding:5px;
@inputWidth:40px;
@inputHeight:26px;
@inputBorderColor:#09ca51;
@currentColor:#333;
@totalColor:#fff;
@btnBgColor:rgba(0,0,0,0.6);
@btnColor:#ffffff;
@btnSize:35px;
@btnRight:5px;
@iconColor:#fff;


.board-pagination{
    position: absolute;
    bottom: @bottom;
    left: 50%;
    transform: translateX(-50%);
    height: @height;
    background-color: rgba(188, 188, 188, 0.5);
    border-radius: @height;
    color: @fontColor;
    font-size: @fontSize;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 @height/2;
    &-current{
        color: @currentColor;
    }
    &-split{
        padding: 0 @splitPadding;
        color: @totalColor;
    }
    &-total{
        color: @totalColor;
    }
    &-control{
        padding: 0 @height;
    }
    &-input{
        width: @inputWidth!important;
        height: @inputHeight!important;
        border-radius: 0!important;
        text-align: center;
        padding: 0;
        &:focus,&:hover{
            border-color: @inputBorderColor!important;
        }
        margin-right: @btnRight!important;
    }
    &-prev,&-next,&-go{
        color: @iconColor;
        font-size: @inputHeight*0.8!important;
        position: absolute;
        width: @height;
        height: @height;
        text-align: center;
        background-color: transparent;
        line-height: @height;
        border: none;
        outline: none;
        &:extend(.cursor-pointer);
        &.disabled{
            pointer-events: none;
            opacity:0.3;
            &:extend(.cursor-not-allowed);
        }
    }
    &-prev{
        left: 0;
    }
    &-next{
        right: 0;
        position: relative!important;
    }
    &-go{
        background-color: @btnBgColor;
        color: @btnColor;
        width: @btnSize;
        height: @btnSize;
        border-radius: @btnSize;
        outline: none;
        font-size: @fontSize!important;
        right: @btnRight;
        line-height: @btnSize;
        padding: 0;
    }
}