add GoodsAction component

packages/vant-css/src/button.css

@@ -103,6 +103,7 @@
     line-height: 50px;
     border: 0;
     border-radius: 0;
+    font-size: 16px;
     color: $bottom-action-button-default-color;
     background-color: $bottom-action-button-default-background-color;
 

packages/vant-css/src/common/var.css

@@ -13,6 +13,7 @@ $c-yellow-light: #fcff00;
 $c-orange: #f60;
 $c-orange-dark: #f15a0c;
 $c-blue: #38f;
+$c-active: #e8e8e8;
 
 $c-background: #f8f8f8;
 

packages/vant-css/src/goods-action.css

@@ -0,0 +1,40 @@
+@import './common/var.css';
+
+.van-goods-action {
+  left: 0;
+  right: 0;
+  bottom: 0;
+  display: flex;
+  position: fixed;
+
+  &__mini-btn {
+    color: #666;
+    display: flex;
+    height: 50px;
+    font-size: 10px;
+    min-width: 15%;
+    text-align: center;
+    background-color: #fff;
+    flex-direction: column;
+    justify-content: center;
+
+    &::after {
+      @mixin border-retina (top, right), #cacaca;
+    }
+
+    &:last-child {
+      &::after {
+        border-right-width: 0;
+      }
+    }
+
+    &:active {
+      background-color: $c-active;
+    }
+  }
+
+  &__mini-btn-icon {
+    font-size: 20px;
+    margin-bottom: 5px;
+  }
+}

packages/vant-css/src/index.css

@@ -36,3 +36,4 @@
 @import './pay-order.css';
 @import './order-goods.css';
 @import './invalid-goods.css';
+@import './goods-action.css';

packages/vant-css/src/invalid-goods.css

@@ -1,4 +1,4 @@
-@import "./mixins/ellipsis";
+@import "./mixins/ellipsis.css";
 
 $van-invalid-goods-photo-size: 90px;
 

packages/vant-css/src/order-goods.css

@@ -1,4 +1,4 @@
-@import "./mixins/border_retina";
+@import "./mixins/border_retina.css";
 
 .van-order-goods {
   background-color: #fff;