feat: 分页组件 (#327)

* feat: 分页组件

* feat: 代码规范化

packages/vant-css/src/index.css

@@ -18,6 +18,7 @@
 @import './notice-bar.css';
 @import './popup.css';
 @import './search.css';
+@import './pagination.css';
 @import './panel.css';
 @import './steps.css';
 @import './tag.css';

packages/vant-css/src/pagination.css

@@ -0,0 +1,74 @@
+@import './common/var.css';
+
+.van-pagination {
+  display: flex;
+  text-align: center;
+  line-height: 40px;
+  font-size: 14px;
+
+  &__item {
+    flex: 1;
+    height: 40px;
+    min-width: 36px;
+    color: $blue;
+    background-color: $white;
+    box-sizing: border-box;
+    user-select: none;
+
+    &:active {
+      background-color: $blue;
+      color: $white;
+      opacity: 0.8;
+    }
+
+    &::after {
+      border-width: 1px 0 1px 1px;
+    }
+
+    &:last-child::after {
+      border-right-width: 1px;
+    }
+  }
+
+  &__prev,
+  &__next {
+    &.van-pagination__item {
+      padding: 0 5px;
+    }
+  }
+
+  &__page {
+    flex-grow: 0;
+
+    &.van-pagination--active {
+      background-color: $blue;
+      color: $white;
+    }
+  }
+
+  &--disabled {
+
+    &.van-pagination__item {
+      background-color: $background-color;
+      color: $gray-darker;
+      opacity: 0.6;
+    }
+  }
+
+  &__page-desc {
+    flex: 1;
+    height: 40px;
+    color: $gray-darker;
+  }
+}
+
+.van-pagination-simple {
+
+  .van-pagination__prev,
+  .van-pagination__next {
+
+    &.van-pagination__item::after {
+      border-width: 1px;
+    }
+  }
+}