[improvement] Pagination: add less vars

This commit is contained in:
陈嘉涵 2019-05-16 17:30:13 +08:00
parent df42aad53f
commit 75e1ea6b3a
2 changed files with 20 additions and 11 deletions

View File

@ -2,22 +2,22 @@
.van-pagination { .van-pagination {
display: flex; display: flex;
font-size: 14px; font-size: @pagination-font-size;
line-height: 40px; line-height: @pagination-height;
text-align: center; text-align: center;
&__item { &__item {
flex: 1; flex: 1;
box-sizing: border-box; box-sizing: border-box;
min-width: 36px; min-width: @pagination-item-width;
height: 40px; height: @pagination-height;
color: @blue; color: @pagination-item-theme-color;
background-color: @white; background-color: @pagination-background-color;
user-select: none; user-select: none;
&:active { &:active {
color: @white; color: @white;
background-color: @blue; background-color: @pagination-item-theme-color;
} }
&::after { &::after {
@ -32,12 +32,12 @@
&--disabled:active { &--disabled:active {
color: @gray-darker; color: @gray-darker;
background-color: @background-color; background-color: @background-color;
opacity: 0.6; opacity: @pagination-disabled-opacity;
} }
&--active { &--active {
color: @white; color: @white;
background-color: @blue; background-color: @pagination-item-theme-color;
} }
} }
@ -52,8 +52,8 @@
&__page-desc { &__page-desc {
flex: 1; flex: 1;
height: 40px; height: @pagination-height;
color: @gray-darker; color: @pagination-desc-color;
} }
&--simple { &--simple {

View File

@ -320,6 +320,15 @@
// Overlay // Overlay
@overlay-background-color: rgba(0, 0, 0, 0.7); @overlay-background-color: rgba(0, 0, 0, 0.7);
// Pagination
@pagination-height: 40px;
@pagination-font-size: 14px;
@pagination-item-width: 36px;
@pagination-item-theme-color: @blue;
@pagination-background-color: @white;
@pagination-desc-color: @gray-darker;
@pagination-disabled-opacity: 0.6;
// Panel // Panel
@panel-background-color: @white; @panel-background-color: @white;
@panel-header-value-color: @red; @panel-header-value-color: @red;