xiaoe_mp_npm 0.5.42-test2 → 0.5.42-test21

package/src/ConfirmOrder/components/PayBar/index.wxss

@@ -1,24 +1,108 @@
 .paybar {
   bottom: 0;
   background: #fff;
-  box-shadow: 0 0 2.13vmin 0 rgba(0, 0, 0, 0.08);
+  box-shadow: 0 0 2.13333vmin 0 rgba(0, 0, 0, 0.08);
   position: fixed;
   width: 100%;
 }
+
 .paybar .pay-wrapper {
   display: flex;
   justify-content: space-between;
   align-items: center;
   box-sizing: border-box;
-  padding: 0 5.33vmin;
-  height: 14.93vmin;
+  padding: 0 5.33333vmin;
+  height: 14.93333vmin;
 }
+
 .paybar .pay-wrapper .pay-amount .pay-text {
   font-weight: 500;
 }
+
 .paybar .pay-wrapper .pay-amount .pay-price-float,
 .paybar .pay-wrapper .pay-amount .pay-price-int,
 .paybar .pay-wrapper .pay-amount .pay-currency {
   color: #ff5429;
   font-weight: 500;
 }
+
+@media screen and (min-width: 768px) and (orientation: portrait) {
+  .paybar {
+    bottom: 0;
+    background: #fff;
+    box-shadow: 0 0 1.04167vmin 0 rgba(0, 0, 0, 0.08);
+    position: fixed;
+    width: 100%;
+  }
+  .paybar .pay-wrapper {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0 2.60417vmin;
+    height: 7.29167vmin;
+  }
+  .paybar .pay-wrapper .pay-amount .pay-text {
+    font-weight: 500;
+  }
+  .paybar .pay-wrapper .pay-amount .pay-price-float,
+  .paybar .pay-wrapper .pay-amount .pay-price-int,
+  .paybar .pay-wrapper .pay-amount .pay-currency {
+    color: #ff5429;
+    font-weight: 500;
+  }
+}
+
+@media screen and (min-height: 630px) and (orientation: landscape) {
+  p.paybar {
+    bottom: 0;
+    background: #fff;
+    box-shadow: 0 0 1.26984vmin 0 rgba(0, 0, 0, 0.08);
+    position: fixed;
+    width: 100%;
+  }
+  p.paybar .pay-wrapper {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0 3.1746vmin;
+    height: 8.88889vmin;
+  }
+  p.paybar .pay-wrapper .pay-amount .pay-text {
+    font-weight: 500;
+  }
+  p.paybar .pay-wrapper .pay-amount .pay-price-float,
+  p.paybar .pay-wrapper .pay-amount .pay-price-int,
+  p.paybar .pay-wrapper .pay-amount .pay-currency {
+    color: #ff5429;
+    font-weight: 500;
+  }
+}
+
+@media screen and (min-height: 768px) and (orientation: landscape) {
+  .paybar {
+    bottom: 0;
+    background: #fff;
+    box-shadow: 0 0 1.04167vmin 0 rgba(0, 0, 0, 0.08);
+    position: fixed;
+    width: 100%;
+  }
+  .paybar .pay-wrapper {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0 2.60417vmin;
+    height: 7.29167vmin;
+  }
+  .paybar .pay-wrapper .pay-amount .pay-text {
+    font-weight: 500;
+  }
+  .paybar .pay-wrapper .pay-amount .pay-price-float,
+  .paybar .pay-wrapper .pay-amount .pay-price-int,
+  .paybar .pay-wrapper .pay-amount .pay-currency {
+    color: #ff5429;
+    font-weight: 500;
+  }
+}

package/src/ConfirmOrder/components/PayDetail/index.scss

@@ -0,0 +1,41 @@
+$deviceWidth: 750;
+@function vmin($rpx) {
+  @return #{$rpx * 100 / $deviceWidth}vmin;
+}
+
+@mixin price-wrapper {
+    padding: 0 vmin(30);
+    background: #fff;
+    font-size: vmin(28);
+  
+    .price-item {
+      padding: vmin(28) 0;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+  
+    .price-item:not(:last-child) {
+      border-bottom: vmin(1) solid rgba(240, 240, 240, 0.6);
+    }
+}
+
+.price-wrapper {
+    @include price-wrapper;
+}
+// 竖屏pad
+@media screen and (min-width: 768px) and (orientation: portrait) {
+    $deviceWidth: 1536 !global;
+
+    .price-wrapper {
+        @include price-wrapper;
+    }
+}
+// 横屏pad
+@media screen and (min-height: 768px) and (orientation: landscape) {
+    $deviceWidth: 1536 !global;
+
+    .price-wrapper {
+        @include price-wrapper;
+    }
+}

package/src/ConfirmOrder/components/PayDetail/index.wxss

@@ -1,14 +1,50 @@
 .price-wrapper {
   padding: 0 4vmin;
   background: #fff;
-  font-size: 3.73vmin;
+  font-size: 3.73333vmin;
 }
+
 .price-wrapper .price-item {
-  padding: 3.73vmin 0;
+  padding: 3.73333vmin 0;
   display: flex;
   align-items: center;
   justify-content: space-between;
 }
+
 .price-wrapper .price-item:not(:last-child) {
-  border-bottom: 0.13vmin solid rgba(240, 240, 240, 0.6);
+  border-bottom: 0.13333vmin solid rgba(240, 240, 240, 0.6);
+}
+
+@media screen and (min-width: 768px) and (orientation: portrait) {
+  .price-wrapper {
+    padding: 0 1.95312vmin;
+    background: #fff;
+    font-size: 1.82292vmin;
+  }
+  .price-wrapper .price-item {
+    padding: 1.82292vmin 0;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .price-wrapper .price-item:not(:last-child) {
+    border-bottom: 0.0651vmin solid rgba(240, 240, 240, 0.6);
+  }
+}
+
+@media screen and (min-height: 768px) and (orientation: landscape) {
+  .price-wrapper {
+    padding: 0 1.95312vmin;
+    background: #fff;
+    font-size: 1.82292vmin;
+  }
+  .price-wrapper .price-item {
+    padding: 1.82292vmin 0;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .price-wrapper .price-item:not(:last-child) {
+    border-bottom: 0.0651vmin solid rgba(240, 240, 240, 0.6);
+  }
 }