xiaoe_mp_npm 0.5.42-test2 → 0.5.42-test21

package/src/coupon/components/CouponSelect/index.wxss

@@ -1,48 +1,60 @@
+@charset "UTF-8";
 /* 主题色 */
 .theme-customize-bg {
   background: linear-gradient(180.25deg, #fe6500 0%, #ff4102 100%) !important;
 }
+
 .theme-customize-font {
   color: #1472FF !important;
 }
+
 .theme-customize-light-new {
   background-color: #9db8f1 !important;
 }
+
 .theme-customize-bg-light {
   background-color: #fff3eb !important;
 }
+
 .theme-customize-border {
   border-color: #FF781F !important;
 }
+
 .popUp {
   height: 80%;
-  border-radius: 3.52vmin 3.52vmin 0 0;
-}
-.full-screen .header-content {
-  position: absolute;
-  width: 90vmin;
+  border-radius: 3.46667vmin 3.46667vmin 0 0;
 }
+
 .coupon-select-box {
   display: flex;
   flex-direction: column;
   margin: 0 auto;
   max-width: 100vmin;
   background-color: #F5F6F9;
-  border-radius: 3.52vmin 3.52vmin 0 0;
+  border-radius: 3.46667vmin 3.46667vmin 0 0;
   user-select: none;
 }
+
 .coupon-select-box.vertical-screen {
   height: 100%;
 }
+
 .coupon-select-box.full-screen {
-  height: 75vmin;
+  height: 74.93333vmin;
   overflow: scroll;
   margin: 13vmin 0;
 }
+
+.coupon-select-box.full-screen .header-content {
+  position: absolute;
+  width: 90vmin;
+}
+
 .coupon-select-box .coupon-header {
   display: flex;
   flex-direction: column;
 }
+
 .coupon-select-box .coupon-header .header-content {
   display: flex;
   flex-direction: row;
@@ -52,167 +64,190 @@
   padding: 0 4.8vmin;
   top: 0;
   left: 0;
-  font-size: 4.27vmin;
+  font-size: 4.26667vmin;
   font-weight: 500;
   background-color: #ffffff;
-  border-radius: 3.52vmin 3.52vmin 0 0;
+  border-radius: 3.46667vmin 3.46667vmin 0 0;
 }
+
 .coupon-select-box .coupon-header .promo-code-wrap {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 0 4.8vmin;
-  height: 15.33vmin;
+  height: 15.33333vmin;
   background-color: #fff;
 }
+
 .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input {
-  width: 62.67vmin;
+  width: 62.66667vmin;
   height: 11.2vmin;
-  padding: 0 2.93vmin;
-  border: 0.13vmin solid #DCDCDC;
+  padding: 0 2.93333vmin;
+  border: 0.13333vmin solid #DCDCDC;
   border-right: none;
-  border-radius: 1.17vmin 0 0 1.17vmin;
+  border-radius: 1.06667vmin 0 0 1.06667vmin;
   color: #333;
-  font-size: 4.11vmin;
+  font-size: 4vmin;
   user-select: text;
   box-shadow: none;
 }
+
 .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input::-webkit-input-placeholder {
   color: #c8c8c8;
 }
+
 .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input:disabled {
   color: #999;
   background-color: #eee;
 }
+
 .coupon-select-box .coupon-header .promo-code-wrap .promo-code-btn {
   width: 24vmin;
   height: 11.2vmin;
   line-height: 11.2vmin;
   margin: 0;
   border: none;
-  border-radius: 0 1.17vmin 1.17vmin 0;
+  border-radius: 0 1.06667vmin 1.06667vmin 0;
   text-align: center;
   color: #fff;
-  font-size: 3.67vmin;
+  font-size: 3.6vmin;
   cursor: pointer;
 }
+
 .coupon-select-box .coupon-header .coupon-code-tip {
   display: flex;
   align-items: center;
   padding: 0 4.8vmin;
   background-color: #fff;
-  height: 5.28vmin;
+  height: 5.33333vmin;
 }
+
 .coupon-select-box .coupon-header .coupon-code-tip .tips-img {
   margin-right: 0.88vmin;
-  width: 4.11vmin;
-  height: 3.81vmin;
+  width: 4vmin;
+  height: 3.73333vmin;
 }
+
 .coupon-select-box .coupon-header .coupon-code-tip text {
-  font-size: 3.52vmin;
+  font-size: 3.46667vmin;
   color: #999;
 }
+
 .coupon-select-box .coupon-header .coupon-tab_warp {
   display: flex;
   justify-items: center;
   align-items: center;
-  font-size: 4.69vmin;
+  font-size: 4.66667vmin;
   padding: 0 4.8vmin;
   font-weight: 700;
   text-align: center;
   background-color: #fff;
 }
+
 .coupon-select-box .coupon-header .coupon-tab_warp text {
   display: block;
 }
+
 .coupon-select-box .coupon-header .coupon-tab_warp .tabItem {
   position: relative;
   width: 50%;
-  height: 14.08vmin;
-  line-height: 14.08vmin;
+  height: 14.13333vmin;
+  line-height: 14.13333vmin;
   text-align: center;
   cursor: pointer;
 }
+
 .coupon-select-box .coupon-header .coupon-tab_warp .greyColor {
   color: #999999;
-  font-size: 4.11vmin;
+  font-size: 4vmin;
   font-weight: normal;
 }
+
 .coupon-select-box .coupon-header .coupon-tab_warp .activeBorder {
   position: absolute;
   bottom: 0;
   left: 50%;
   transform: translateX(-50%);
-  width: 5.87vmin;
-  height: 0.59vmin;
+  width: 5.86667vmin;
+  height: 0.53333vmin;
   background: #09BB07;
-  border-radius: 0.44vmin;
+  border-radius: 0.53333vmin;
 }
+
 .coupon-select-box .coupon-header .coupon-tips {
   display: flex;
   background: #fff;
   align-items: center;
   justify-items: center;
-  padding: 1.33vmin 4.8vmin;
+  padding: 1.33333vmin 4.8vmin;
   justify-content: space-between;
 }
+
 .coupon-select-box .coupon-header .coupon-tips .coupon-tips-font {
-  line-height: 7.33vmin;
-  font-size: 3.52vmin;
+  line-height: 7.33333vmin;
+  font-size: 3.46667vmin;
   font-weight: 500;
   color: #000;
 }
+
 .coupon-select-box .coupon-header .coupon-tips .coupon-tips-font .coupon-money-num {
   color: #FF4747;
 }
+
 .coupon-select-box .coupon-header .coupon-tips .coupon-best-combination {
-  min-width: 28.16vmin;
-  height: 7.04vmin;
+  min-width: 28.13333vmin;
+  height: 7.06667vmin;
   text-align: center;
-  line-height: 7.33vmin;
+  line-height: 7.33333vmin;
   background: #FF821F;
   border: 0;
   margin: 0;
-  border-radius: 5.87vmin;
-  font-size: 3.52vmin;
+  border-radius: 5.86667vmin;
+  font-size: 3.46667vmin;
   font-weight: 500;
   color: #fff;
 }
+
 .coupon-select-box.vertical-screen .coupon-list {
   overflow: scroll;
   -webkit-overflow-scrolling: touch;
 }
+
 .coupon-select-box .coupon-list {
   box-sizing: border-box;
   flex: 1;
   /* 撑满剩余容器高度 */
   text-align: center;
-  padding: 3.52vmin 4.69vmin 0;
+  padding: 3.46667vmin 4.66667vmin 0;
 }
+
 .coupon-select-box .coupon-list .coupon-item {
   position: relative;
   display: flex;
-  margin-bottom: 3.52vmin;
-  border-radius: 1.17vmin;
+  margin-bottom: 3.46667vmin;
+  border-radius: 1.06667vmin;
   background: #fff;
 }
+
 .coupon-select-box .coupon-list .not-use-coupon {
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
-  height: 15.25vmin;
-  margin-bottom: 3.52vmin;
-  border-radius: 1.17vmin;
+  height: 15.2vmin;
+  margin-bottom: 3.46667vmin;
+  border-radius: 1.06667vmin;
   background: #fff;
 }
+
 .coupon-select-box .coupon-list .not-use-coupon .not-use-text {
-  width: 74.51vmin;
-  padding-left: 4.69vmin;
-  font-size: 4.11vmin;
+  width: 74.4vmin;
+  padding-left: 4.66667vmin;
+  font-size: 4vmin;
   color: #333;
   text-align: left;
 }
+
 .coupon-select-box .coupon-list .not-use-coupon .choose-box {
   display: flex;
   align-items: center;
@@ -220,62 +255,878 @@
   width: 17.6vmin;
   height: 100%;
 }
+
 .coupon-select-box .coupon-list .not-use-coupon .choose-box .choose-inner {
-  width: 5.28vmin;
-  height: 5.28vmin;
+  width: 5.33333vmin;
+  height: 5.33333vmin;
   border-radius: 50%;
-  border: 0.44vmin solid #ccc;
+  border: 0.53333vmin solid #ccc;
 }
+
 .coupon-select-box .coupon-list .not-use-coupon .choose-box .coupon-not-used {
   border: none;
 }
+
 .coupon-select-box .coupon-bottom {
-  height: 13.33vmin;
+  height: 13.33333vmin;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: #fff;
 }
+
 .coupon-select-box .coupon-bottom .coupon-confirm-button {
-  height: 10.77vmin;
-  border-radius: 6.45vmin;
-  line-height: 10.77vmin;
+  height: 10.66667vmin;
+  border-radius: 6.4vmin;
+  line-height: 10.66667vmin;
   text-align: center;
-  font-size: 4.11vmin;
+  font-size: 4vmin;
   font-weight: 500;
   color: #fff;
 }
+
 .coupon-select-box.vertical-screen .coupon-bottom {
   padding: 0 4.8vmin;
 }
+
 .coupon-select-box.vertical-screen .coupon-bottom .coupon-confirm-button {
   background: #FF821F;
-  width: 100.61vmin;
+  width: 100.53333vmin;
 }
+
 .coupon-select-box.vertical-screen .promo-code-btn {
   background-color: #FF821F !important;
 }
+
 .coupon-select-box.full-screen .coupon-bottom {
   width: 100%;
   position: absolute;
   bottom: 0;
 }
+
 .coupon-select-box.full-screen .coupon-bottom .coupon-confirm-button {
   background: linear-gradient(270deg, #fe6500 0%, #ff4102 100%);
-  width: 95vmin;
+  width: 94.93333vmin;
 }
+
 .coupon-select-box.full-screen .promo-code-btn {
   background: linear-gradient(270deg, #fe6500 0%, #ff4102 100%);
 }
+
 .coupon-select-box .coupon_emptypage {
   text-align: center;
   margin: 2vmin 0 10vmin 0;
-  font-size: 3.5vmin;
+  font-size: 3.46667vmin;
   color: #ADADB4;
 }
+
 .coupon-select-box .coupon_emptypage .coupon_emptyImg {
-  margin-bottom: 2.13vmin;
-  width: 25vmin;
-  height: 25vmin;
+  margin-bottom: 2.13333vmin;
+  width: 25.06667vmin;
+  height: 25.06667vmin;
   background-size: 100% 100%;
 }
+
+@media screen and (min-width: 768px) and (orientation: portrait) {
+  .popUp {
+    height: 80%;
+    border-radius: 1.69271vmin 1.69271vmin 0 0;
+  }
+  .coupon-select-box {
+    display: flex;
+    flex-direction: column;
+    margin: 0 auto;
+    max-width: 100vmin;
+    background-color: #F5F6F9;
+    border-radius: 1.69271vmin 1.69271vmin 0 0;
+    user-select: none;
+  }
+  .coupon-select-box.vertical-screen {
+    height: 100%;
+  }
+  .coupon-select-box.full-screen {
+    height: 36.58854vmin;
+    overflow: scroll;
+    margin: 6.34766vmin 0;
+  }
+  .coupon-select-box.full-screen .header-content {
+    position: absolute;
+    width: 90vmin;
+  }
+  .coupon-select-box .coupon-header {
+    display: flex;
+    flex-direction: column;
+  }
+  .coupon-select-box .coupon-header .header-content {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    height: 5.85938vmin;
+    padding: 0 2.34375vmin;
+    top: 0;
+    left: 0;
+    font-size: 2.08333vmin;
+    font-weight: 500;
+    background-color: #ffffff;
+    border-radius: 1.69271vmin 1.69271vmin 0 0;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 0 2.34375vmin;
+    height: 7.48698vmin;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input {
+    width: 30.59896vmin;
+    height: 5.46875vmin;
+    padding: 0 1.43229vmin;
+    border: 0.0651vmin solid #DCDCDC;
+    border-right: none;
+    border-radius: 0.52083vmin 0 0 0.52083vmin;
+    color: #333;
+    font-size: 1.95312vmin;
+    user-select: text;
+    box-shadow: none;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input::-webkit-input-placeholder {
+    color: #c8c8c8;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input:disabled {
+    color: #999;
+    background-color: #eee;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-btn {
+    width: 11.71875vmin;
+    height: 5.46875vmin;
+    line-height: 5.46875vmin;
+    margin: 0;
+    border: none;
+    border-radius: 0 0.52083vmin 0.52083vmin 0;
+    text-align: center;
+    color: #fff;
+    font-size: 1.75781vmin;
+    cursor: pointer;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip {
+    display: flex;
+    align-items: center;
+    padding: 0 2.34375vmin;
+    background-color: #fff;
+    height: 2.60417vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip .tips-img {
+    margin-right: 0.88vmin;
+    width: 1.95312vmin;
+    height: 1.82292vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip text {
+    font-size: 1.69271vmin;
+    color: #999;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp {
+    display: flex;
+    justify-items: center;
+    align-items: center;
+    font-size: 2.27865vmin;
+    padding: 0 2.34375vmin;
+    font-weight: 700;
+    text-align: center;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp text {
+    display: block;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .tabItem {
+    position: relative;
+    width: 50%;
+    height: 6.90104vmin;
+    line-height: 6.90104vmin;
+    text-align: center;
+    cursor: pointer;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .greyColor {
+    color: #999999;
+    font-size: 1.95312vmin;
+    font-weight: normal;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .activeBorder {
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 2.86458vmin;
+    height: 0.26042vmin;
+    background: #09BB07;
+    border-radius: 0.26042vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-tips {
+    display: flex;
+    background: #fff;
+    align-items: center;
+    justify-items: center;
+    padding: 0.65104vmin 2.34375vmin;
+    justify-content: space-between;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-tips-font {
+    line-height: 3.58073vmin;
+    font-size: 1.69271vmin;
+    font-weight: 500;
+    color: #000;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-tips-font .coupon-money-num {
+    color: #FF4747;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-best-combination {
+    min-width: 13.73698vmin;
+    height: 3.45052vmin;
+    text-align: center;
+    line-height: 3.58073vmin;
+    background: #FF821F;
+    border: 0;
+    margin: 0;
+    border-radius: 2.86458vmin;
+    font-size: 1.69271vmin;
+    font-weight: 500;
+    color: #fff;
+  }
+  .coupon-select-box.vertical-screen .coupon-list {
+    overflow: scroll;
+    -webkit-overflow-scrolling: touch;
+  }
+  .coupon-select-box .coupon-list {
+    box-sizing: border-box;
+    flex: 1;
+    /* 撑满剩余容器高度 */
+    text-align: center;
+    padding: 1.69271vmin 2.27865vmin 0;
+  }
+  .coupon-select-box .coupon-list .coupon-item {
+    position: relative;
+    display: flex;
+    margin-bottom: 1.69271vmin;
+    border-radius: 0.52083vmin;
+    background: #fff;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    height: 7.42188vmin;
+    margin-bottom: 1.69271vmin;
+    border-radius: 0.52083vmin;
+    background: #fff;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .not-use-text {
+    width: 36.32812vmin;
+    padding-left: 2.27865vmin;
+    font-size: 1.95312vmin;
+    color: #333;
+    text-align: left;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 8.59375vmin;
+    height: 100%;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box .choose-inner {
+    width: 2.60417vmin;
+    height: 2.60417vmin;
+    border-radius: 50%;
+    border: 0.26042vmin solid #ccc;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box .coupon-not-used {
+    border: none;
+  }
+  .coupon-select-box .coupon-bottom {
+    height: 6.51042vmin;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-bottom .coupon-confirm-button {
+    height: 5.20833vmin;
+    border-radius: 3.125vmin;
+    line-height: 5.20833vmin;
+    text-align: center;
+    font-size: 1.95312vmin;
+    font-weight: 500;
+    color: #fff;
+  }
+  .coupon-select-box.vertical-screen .coupon-bottom {
+    padding: 0 2.34375vmin;
+  }
+  .coupon-select-box.vertical-screen .coupon-bottom .coupon-confirm-button {
+    background: #FF821F;
+    width: 49.08854vmin;
+  }
+  .coupon-select-box.vertical-screen .promo-code-btn {
+    background-color: #FF821F !important;
+  }
+  .coupon-select-box.full-screen .coupon-bottom {
+    width: 100%;
+    position: absolute;
+    bottom: 0;
+  }
+  .coupon-select-box.full-screen .coupon-bottom .coupon-confirm-button {
+    background: linear-gradient(270deg, #fe6500 0%, #ff4102 100%);
+    width: 46.35417vmin;
+  }
+  .coupon-select-box.full-screen .promo-code-btn {
+    background: linear-gradient(270deg, #fe6500 0%, #ff4102 100%);
+  }
+  .coupon-select-box .coupon_emptypage {
+    text-align: center;
+    margin: 0.97656vmin 0 4.88281vmin 0;
+    font-size: 1.69271vmin;
+    color: #ADADB4;
+  }
+  .coupon-select-box .coupon_emptypage .coupon_emptyImg {
+    margin-bottom: 1.04167vmin;
+    width: 12.23958vmin;
+    height: 12.23958vmin;
+    background-size: 100% 100%;
+  }
+}
+
+@media screen and (min-height: 630px) and (orientation: landscape) {
+  .popUp {
+    height: 80%;
+    border-radius: 2.06349vmin 2.06349vmin 0 0;
+  }
+  .coupon-select-box {
+    display: flex;
+    flex-direction: column;
+    margin: 0 auto;
+    max-width: 100vmin;
+    background-color: #F5F6F9;
+    border-radius: 2.06349vmin 2.06349vmin 0 0;
+    user-select: none;
+  }
+  .coupon-select-box.vertical-screen {
+    height: 100%;
+  }
+  .coupon-select-box.full-screen {
+    height: 44.60317vmin;
+    overflow: scroll;
+    margin: 7.7381vmin 0;
+  }
+  .coupon-select-box.full-screen .header-content {
+    position: absolute;
+    width: 90vmin;
+  }
+  .coupon-select-box .coupon-header {
+    display: flex;
+    flex-direction: column;
+  }
+  .coupon-select-box .coupon-header .header-content {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    height: 7.14286vmin;
+    padding: 0 2.85714vmin;
+    top: 0;
+    left: 0;
+    font-size: 2.53968vmin;
+    font-weight: 500;
+    background-color: #ffffff;
+    border-radius: 2.06349vmin 2.06349vmin 0 0;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 0 2.85714vmin;
+    height: 9.12698vmin;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input {
+    width: 37.30159vmin;
+    height: 6.66667vmin;
+    padding: 0 1.74603vmin;
+    border: 0.07937vmin solid #DCDCDC;
+    border-right: none;
+    border-radius: 0.63492vmin 0 0 0.63492vmin;
+    color: #333;
+    font-size: 2.38095vmin;
+    user-select: text;
+    box-shadow: none;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input::-webkit-input-placeholder {
+    color: #c8c8c8;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input:disabled {
+    color: #999;
+    background-color: #eee;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-btn {
+    width: 14.28571vmin;
+    height: 6.66667vmin;
+    line-height: 6.66667vmin;
+    margin: 0;
+    border: none;
+    border-radius: 0 0.63492vmin 0.63492vmin 0;
+    text-align: center;
+    color: #fff;
+    font-size: 2.14286vmin;
+    cursor: pointer;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip {
+    display: flex;
+    align-items: center;
+    padding: 0 2.85714vmin;
+    background-color: #fff;
+    height: 3.1746vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip .tips-img {
+    margin-right: 0.88vmin;
+    width: 2.38095vmin;
+    height: 2.22222vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip text {
+    font-size: 2.06349vmin;
+    color: #999;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp {
+    display: flex;
+    justify-items: center;
+    align-items: center;
+    font-size: 2.77778vmin;
+    padding: 0 2.85714vmin;
+    font-weight: 700;
+    text-align: center;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp text {
+    display: block;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .tabItem {
+    position: relative;
+    width: 50%;
+    height: 8.4127vmin;
+    line-height: 8.4127vmin;
+    text-align: center;
+    cursor: pointer;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .greyColor {
+    color: #999999;
+    font-size: 2.38095vmin;
+    font-weight: normal;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .activeBorder {
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 3.49206vmin;
+    height: 0.31746vmin;
+    background: #09BB07;
+    border-radius: 0.31746vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-tips {
+    display: flex;
+    background: #fff;
+    align-items: center;
+    justify-items: center;
+    padding: 0.79365vmin 2.85714vmin;
+    justify-content: space-between;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-tips-font {
+    line-height: 4.36508vmin;
+    font-size: 2.06349vmin;
+    font-weight: 500;
+    color: #000;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-tips-font .coupon-money-num {
+    color: #FF4747;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-best-combination {
+    min-width: 16.74603vmin;
+    height: 4.20635vmin;
+    text-align: center;
+    line-height: 4.36508vmin;
+    background: #FF821F;
+    border: 0;
+    margin: 0;
+    border-radius: 3.49206vmin;
+    font-size: 2.06349vmin;
+    font-weight: 500;
+    color: #fff;
+  }
+  .coupon-select-box.vertical-screen .coupon-list {
+    overflow: scroll;
+    -webkit-overflow-scrolling: touch;
+  }
+  .coupon-select-box .coupon-list {
+    box-sizing: border-box;
+    flex: 1;
+    /* 撑满剩余容器高度 */
+    text-align: center;
+    padding: 2.06349vmin 2.77778vmin 0;
+  }
+  .coupon-select-box .coupon-list .coupon-item {
+    position: relative;
+    display: flex;
+    margin-bottom: 2.06349vmin;
+    border-radius: 0.63492vmin;
+    background: #fff;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    height: 9.04762vmin;
+    margin-bottom: 2.06349vmin;
+    border-radius: 0.63492vmin;
+    background: #fff;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .not-use-text {
+    width: 44.28571vmin;
+    padding-left: 2.77778vmin;
+    font-size: 2.38095vmin;
+    color: #333;
+    text-align: left;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 10.47619vmin;
+    height: 100%;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box .choose-inner {
+    width: 3.1746vmin;
+    height: 3.1746vmin;
+    border-radius: 50%;
+    border: 0.31746vmin solid #ccc;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box .coupon-not-used {
+    border: none;
+  }
+  .coupon-select-box .coupon-bottom {
+    height: 7.93651vmin;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-bottom .coupon-confirm-button {
+    height: 6.34921vmin;
+    border-radius: 3.80952vmin;
+    line-height: 6.34921vmin;
+    text-align: center;
+    font-size: 2.38095vmin;
+    font-weight: 500;
+    color: #fff;
+  }
+  .coupon-select-box.vertical-screen .coupon-bottom {
+    padding: 0 2.85714vmin;
+  }
+  .coupon-select-box.vertical-screen .coupon-bottom .coupon-confirm-button {
+    background: #FF821F;
+    width: 59.84127vmin;
+  }
+  .coupon-select-box.vertical-screen .promo-code-btn {
+    background-color: #FF821F !important;
+  }
+  .coupon-select-box.full-screen .coupon-bottom {
+    width: 100%;
+    position: absolute;
+    bottom: 0;
+  }
+  .coupon-select-box.full-screen .coupon-bottom .coupon-confirm-button {
+    background: linear-gradient(270deg, #fe6500 0%, #ff4102 100%);
+    width: 56.50794vmin;
+  }
+  .coupon-select-box.full-screen .promo-code-btn {
+    background: linear-gradient(270deg, #fe6500 0%, #ff4102 100%);
+  }
+  .coupon-select-box .coupon_emptypage {
+    text-align: center;
+    margin: 1.19048vmin 0 5.95238vmin 0;
+    font-size: 2.06349vmin;
+    color: #ADADB4;
+  }
+  .coupon-select-box .coupon_emptypage .coupon_emptyImg {
+    margin-bottom: 1.26984vmin;
+    width: 14.92063vmin;
+    height: 14.92063vmin;
+    background-size: 100% 100%;
+  }
+}
+
+@media screen and (min-height: 768px) and (orientation: landscape) {
+  .popUp {
+    height: 80%;
+    border-radius: 1.69271vmin 1.69271vmin 0 0;
+  }
+  .coupon-select-box {
+    display: flex;
+    flex-direction: column;
+    margin: 0 auto;
+    max-width: 100vmin;
+    background-color: #F5F6F9;
+    border-radius: 1.69271vmin 1.69271vmin 0 0;
+    user-select: none;
+  }
+  .coupon-select-box.vertical-screen {
+    height: 100%;
+  }
+  .coupon-select-box.full-screen {
+    height: 36.58854vmin;
+    overflow: scroll;
+    margin: 6.34766vmin 0;
+  }
+  .coupon-select-box.full-screen .header-content {
+    position: absolute;
+    width: 90vmin;
+  }
+  .coupon-select-box .coupon-header {
+    display: flex;
+    flex-direction: column;
+  }
+  .coupon-select-box .coupon-header .header-content {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    height: 5.85938vmin;
+    padding: 0 2.34375vmin;
+    top: 0;
+    left: 0;
+    font-size: 2.08333vmin;
+    font-weight: 500;
+    background-color: #ffffff;
+    border-radius: 1.69271vmin 1.69271vmin 0 0;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 0 2.34375vmin;
+    height: 7.48698vmin;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input {
+    width: 30.59896vmin;
+    height: 5.46875vmin;
+    padding: 0 1.43229vmin;
+    border: 0.0651vmin solid #DCDCDC;
+    border-right: none;
+    border-radius: 0.52083vmin 0 0 0.52083vmin;
+    color: #333;
+    font-size: 1.95312vmin;
+    user-select: text;
+    box-shadow: none;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input::-webkit-input-placeholder {
+    color: #c8c8c8;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-input:disabled {
+    color: #999;
+    background-color: #eee;
+  }
+  .coupon-select-box .coupon-header .promo-code-wrap .promo-code-btn {
+    width: 11.71875vmin;
+    height: 5.46875vmin;
+    line-height: 5.46875vmin;
+    margin: 0;
+    border: none;
+    border-radius: 0 0.52083vmin 0.52083vmin 0;
+    text-align: center;
+    color: #fff;
+    font-size: 1.75781vmin;
+    cursor: pointer;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip {
+    display: flex;
+    align-items: center;
+    padding: 0 2.34375vmin;
+    background-color: #fff;
+    height: 2.60417vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip .tips-img {
+    margin-right: 0.88vmin;
+    width: 1.95312vmin;
+    height: 1.82292vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-code-tip text {
+    font-size: 1.69271vmin;
+    color: #999;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp {
+    display: flex;
+    justify-items: center;
+    align-items: center;
+    font-size: 2.27865vmin;
+    padding: 0 2.34375vmin;
+    font-weight: 700;
+    text-align: center;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp text {
+    display: block;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .tabItem {
+    position: relative;
+    width: 50%;
+    height: 6.90104vmin;
+    line-height: 6.90104vmin;
+    text-align: center;
+    cursor: pointer;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .greyColor {
+    color: #999999;
+    font-size: 1.95312vmin;
+    font-weight: normal;
+  }
+  .coupon-select-box .coupon-header .coupon-tab_warp .activeBorder {
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 2.86458vmin;
+    height: 0.26042vmin;
+    background: #09BB07;
+    border-radius: 0.26042vmin;
+  }
+  .coupon-select-box .coupon-header .coupon-tips {
+    display: flex;
+    background: #fff;
+    align-items: center;
+    justify-items: center;
+    padding: 0.65104vmin 2.34375vmin;
+    justify-content: space-between;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-tips-font {
+    line-height: 3.58073vmin;
+    font-size: 1.69271vmin;
+    font-weight: 500;
+    color: #000;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-tips-font .coupon-money-num {
+    color: #FF4747;
+  }
+  .coupon-select-box .coupon-header .coupon-tips .coupon-best-combination {
+    min-width: 13.73698vmin;
+    height: 3.45052vmin;
+    text-align: center;
+    line-height: 3.58073vmin;
+    background: #FF821F;
+    border: 0;
+    margin: 0;
+    border-radius: 2.86458vmin;
+    font-size: 1.69271vmin;
+    font-weight: 500;
+    color: #fff;
+  }
+  .coupon-select-box.vertical-screen .coupon-list {
+    overflow: scroll;
+    -webkit-overflow-scrolling: touch;
+  }
+  .coupon-select-box .coupon-list {
+    box-sizing: border-box;
+    flex: 1;
+    /* 撑满剩余容器高度 */
+    text-align: center;
+    padding: 1.69271vmin 2.27865vmin 0;
+  }
+  .coupon-select-box .coupon-list .coupon-item {
+    position: relative;
+    display: flex;
+    margin-bottom: 1.69271vmin;
+    border-radius: 0.52083vmin;
+    background: #fff;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    height: 7.42188vmin;
+    margin-bottom: 1.69271vmin;
+    border-radius: 0.52083vmin;
+    background: #fff;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .not-use-text {
+    width: 36.32812vmin;
+    padding-left: 2.27865vmin;
+    font-size: 1.95312vmin;
+    color: #333;
+    text-align: left;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 8.59375vmin;
+    height: 100%;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box .choose-inner {
+    width: 2.60417vmin;
+    height: 2.60417vmin;
+    border-radius: 50%;
+    border: 0.26042vmin solid #ccc;
+  }
+  .coupon-select-box .coupon-list .not-use-coupon .choose-box .coupon-not-used {
+    border: none;
+  }
+  .coupon-select-box .coupon-bottom {
+    height: 6.51042vmin;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: #fff;
+  }
+  .coupon-select-box .coupon-bottom .coupon-confirm-button {
+    height: 5.20833vmin;
+    border-radius: 3.125vmin;
+    line-height: 5.20833vmin;
+    text-align: center;
+    font-size: 1.95312vmin;
+    font-weight: 500;
+    color: #fff;
+  }
+  .coupon-select-box.vertical-screen .coupon-bottom {
+    padding: 0 2.34375vmin;
+  }
+  .coupon-select-box.vertical-screen .coupon-bottom .coupon-confirm-button {
+    background: #FF821F;
+    width: 49.08854vmin;
+  }
+  .coupon-select-box.vertical-screen .promo-code-btn {
+    background-color: #FF821F !important;
+  }
+  .coupon-select-box.full-screen .coupon-bottom {
+    width: 100%;
+    position: absolute;
+    bottom: 0;
+  }
+  .coupon-select-box.full-screen .coupon-bottom .coupon-confirm-button {
+    background: linear-gradient(270deg, #fe6500 0%, #ff4102 100%);
+    width: 46.35417vmin;
+  }
+  .coupon-select-box.full-screen .promo-code-btn {
+    background: linear-gradient(270deg, #fe6500 0%, #ff4102 100%);
+  }
+  .coupon-select-box .coupon_emptypage {
+    text-align: center;
+    margin: 0.97656vmin 0 4.88281vmin 0;
+    font-size: 1.69271vmin;
+    color: #ADADB4;
+  }
+  .coupon-select-box .coupon_emptypage .coupon_emptyImg {
+    margin-bottom: 1.04167vmin;
+    width: 12.23958vmin;
+    height: 12.23958vmin;
+    background-size: 100% 100%;
+  }
+}