vant-css: use hairline classes instead of mixins

packages/vant-css/src/search.css

@@ -1,5 +1,4 @@
 @import './common/var.css';
-@import './icon.css';
 
 .van-search {
   position: relative;
@@ -13,19 +12,19 @@
 
   &--showcase {
     padding: 10px;
-    background-color: #f8f8f8;
+    background-color: $background-color;
 
     .van-search__input-wrap {
-      border-color: $c-gray-light;
+      border-color: $gray-light;
     }
   }
 
   &__input-wrap {
     position: relative;
     padding: 8px 24px 8px 35px;
-    border: 1px solid $c-gray-light;
+    border: 1px solid $gray-light;
     border-radius: 4px;
-    background-color: $c-white;
+    background-color: $white;
   }
 
   &__input {
@@ -33,10 +32,8 @@
     width: 100%;
     height: 14px;
     font-size: 14px;
-    color: $c-gray-dark;
+    color: $gray-dark;
     border: none;
-    outline: none;
-    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   }
 
   &__cancel {
@@ -46,11 +43,11 @@
     top: 0;
     right: 10px;
     font-size: 14px;
-    color: $c-green;
+    color: $green;
   }
 
   .van-icon-search {
-    color: $c-gray-darker;
+    color: $gray-darker;
     position: absolute;
     top: 50%;
     transform: translateY(-50%);