vue-easytable/libs/themes-base/v-pagination.css

vue table component

@charset "UTF-8";
*, :after, :before {
    box-sizing: border-box;
}

.v-page--large .v-page-total,
.v-page--large .v-page-li,
.v-page--large .v-page-select,
.v-page--large .v-page-goto,
.v-page--large .v-page-goto .v-page-goto-input{
    font-size:16px;
    height:40px;
    line-height: 40px;
}
.v-page--large .v-page-li{
    min-width: 40px;
}
.v-page--large .v-page-li i{
    font-size:120%;
}
.v-page--large .v-page-goto .v-page-goto-input{
    width:50px;
}


.v-page--middle .v-page-total,
.v-page--middle .v-page-li,
.v-page--middle .v-page-select,
.v-page--middle .v-page-goto,
.v-page--middle .v-page-goto .v-page-goto-input{
    font-size:14px;
    height:32px;
    line-height: 32px;
}
.v-page--middle .v-page-li{
    min-width: 32px;
}
.v-page--middle .v-page-li i{
    font-size:120%;
}
.v-page--middle .v-page-goto .v-page-goto-input{
    width:50px;
}


.v-page--small .v-page-total,
.v-page--small .v-page-li,
.v-page--small .v-page-select,
.v-page--small .v-page-goto,
.v-page--small .v-page-goto .v-page-goto-input{
    font-size:12px;
    height:24px;
    line-height: 24px;
}

.v-page--small .v-page-li{
    min-width: 24px;
}
.v-page--small .v-page-li i{
    font-size:120%;
}
.v-page--small .v-page-goto .v-page-goto-input{
    width:45px;
}


.v-page-ul {
    margin: 0;
    padding: 0;
    display: inline-block;
    margin: 0 4px;
    list-style-type: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
}

.v-page-total {
    float: left;
    display: inline-block;
    margin: 0 4px;
}

.v-page-select{
    float: left;
    margin: 0 4px;
}

.v-page-li{
    float: left;
    margin-right: 4px;
    cursor: pointer;
    transition: all .1s ease-in-out;
    text-align: center;
    list-style: none;
    background-color: #fff;
    border: 1px solid #c8cdd4;
    border-radius: 4px;
}

.v-page-li a{
    color:#333;
}

.v-page-li:hover{
    border-color: #0092dd;
}

.v-page-li:hover a{
    color:#0092dd;
}

.v-page-li-active{

    border-color: #0092dd;
    background-color:#0092dd;
}

.v-page-li-active a{
    color:#fff;
}

.v-page-li-active:hover{
    border-color: #0092dd;
    background-color:#0092dd;
}

.v-page-li-active:hover a{
    color:#fff;
}

.v-page-prev i,.v-page-next i{
    color:#666;
}

.v-page-jump-prev:after,.v-page-jump-next:after{
    content: "•••";
    display: block;
    letter-spacing: 1px;
    color:#666;
    text-align: center;
}

.v-page-jump-prev i,.v-page-jump-prev:hover:after,.v-page-jump-next i,.v-page-jump-next:hover:after{
    display: none;
}

.v-page-jump-prev:hover i,.v-page-jump-next:hover i {
    display: inline;
    color:#0092dd;
}


.v-page-select {
    display: inline-block;
    margin: 0 4px;
}

.v-page-pager{
    float: left;
}

.v-page-goto {
    float: left;
    display: inline-block;
    margin: 0 4px;
}

.v-page-goto-input{

    padding: 1px 7px;
    display: inline-block;
    border: 1px solid #c8cdd4;
    background-color: #fff;
    background-image: none;
    transition: border .2s ease-in-out,background .2s ease-in-out,box-shadow .2s ease-in-out;
    border-radius: 4px;
}

.v-page-goto-input:hover{
    border-color: #0092dd;
}

.v-page-disabled{
    cursor: not-allowed;
    border-color: #d7dde4;
}

.v-page-disabled i {
    color: #ccc;
}

.v-page-disabled:hover {
    border-color: #d7dde4
}

.v-page-disabled:hover i {
    color: #ccc;
    cursor: not-allowed
}