wux-weapp/src/pagination/index.less

一套组件化、可复用、易扩展的微信小程序 UI 组件库

@import "../styles/mixins/index.less";
@import "../styles/themes/index.less";

.@{wux-prefix}-pagination {
    display: block;
    width: 100%;
    height: @pagination-height;
    overflow: hidden;
    box-sizing: border-box;
    position: relative;

    &__prev {
        position: absolute;
        left: 10px;
        top: 0;
    }

    &__next {
        position: absolute;
        right: 10px;
        top: 0;
    }

    &__number {
        width: 100%;
        height: @pagination-height;
        line-height: @pagination-height;
        margin: 0 auto;
        text-align: center;
    }

    &__active {
        display: inline;
        color: @pagination-color;
    }

    &__pointer {
        width: 100%;
        height: @pagination-height;
        line-height: @pagination-height;
        margin: 0 auto;
        text-align: center;
    }

    &__dot {
        .square(@pagination-dot-size);

        display: inline-block;
        margin: 0 @pagination-dot-margin;
        border-radius: 50%;
        background: @pagination-dot-bg;

        &--active {
            background: @pagination-dot-active-bg;
        }
    }

    &__button {
        display: inline-block;
        margin: 0;
    }
}