[Improvement] use bem mixin (#934)

packages/vant-css/src/pagination.css

@@ -28,31 +28,27 @@
     &: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 {
+    &--disabled,
+    &--disabled:active {
       background-color: $background-color;
       color: $gray-darker;
       opacity: 0.6;
     }
+
+    &--active {
+      color: $white;
+      background-color: $blue;
+    }
+  }
+
+  &__prev,
+  &__next {
+    padding: 0 5px;
+  }
+
+  &__page {
+    flex-grow: 0;
   }
 
   &__page-desc {
@@ -60,15 +56,13 @@
     height: 40px;
     color: $gray-darker;
   }
-}
 
-.van-pagination-simple {
-
-  .van-pagination__prev,
-  .van-pagination__next {
-
-    &.van-pagination__item::after {
-      border-width: 1px;
+  &--simple {
+    .van-pagination__prev,
+    .van-pagination__next {
+      &::after {
+        border-width: 1px;
+      }
     }
   }
 }

packages/vant-css/src/tab.css

@@ -22,6 +22,22 @@ $van-tabs-card-height: 30px;
       top: auto;
       bottom: 0;
     }
+
+    &--scrollable {
+      .van-tab {
+        flex: 0 0 22%;
+      }
+
+      .van-tabs__nav {
+        overflow: hidden;
+        overflow-x: auto;
+        -webkit-overflow-scrolling: touch;
+
+        &::-webkit-scrollbar {
+          display: none;
+        }
+      }
+    }
   }
 
   &__nav {
@@ -69,22 +85,6 @@ $van-tabs-card-height: 30px;
     background-color: $red;
   }
 
-  &--scrollable {
-    .van-tab {
-      flex: 0 0 22%;
-    }
-
-    .van-tabs__nav {
-      overflow: hidden;
-      overflow-x: auto;
-      -webkit-overflow-scrolling: touch;
-
-      &::-webkit-scrollbar {
-        display: none;
-      }
-    }
-  }
-
   &--line {
     padding-top: $van-tabs-line-height;
 

packages/vant-css/src/tabbar.css

@@ -31,7 +31,7 @@
         display: block;
       }
 
-      &-dot {
+      &--dot {
         &::after {
           top: 0;
           right: -8px;