|
@@ -1,167 +0,0 @@
|
|
-.commodity .cardBox {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- padding: 34rpx 21rpx;
|
|
|
|
- background-color: white;
|
|
|
|
-}
|
|
|
|
-.commodity .cardBox .vipBox {
|
|
|
|
- position: relative;
|
|
|
|
- width: 340rpx;
|
|
|
|
- height: 198rpx;
|
|
|
|
- background-size: cover;
|
|
|
|
- border-radius: 22rpx;
|
|
|
|
- -webkit-box-reflect: below 0rpx linear-gradient(top, rgba(255, 0, 0, 0), rgba(255, 0, 0, 0.24));
|
|
|
|
- -webkit-box-reflect: below 4rpx -webkit-linear-gradient(top, rgba(255, 0, 0, 0), rgba(255, 0, 0, 0.24));
|
|
|
|
-}
|
|
|
|
-.commodity .cardBox .bg1 {
|
|
|
|
- background-image: url(http://reader-wx.ai160.com/images/reader/v3/learn/svip.png);
|
|
|
|
-}
|
|
|
|
-.commodity .cardBox .bg2 {
|
|
|
|
- background-image: url(http://reader-wx.ai160.com/images/reader/v3/learn/vip.png);
|
|
|
|
-}
|
|
|
|
-.commodity .cardBox .bgBorder {
|
|
|
|
- border: 4rpx solid #30C866;
|
|
|
|
-}
|
|
|
|
-.commodity .cardBox .selectBtn {
|
|
|
|
- position: absolute;
|
|
|
|
- bottom: 10rpx;
|
|
|
|
- right: 10rpx;
|
|
|
|
- width: 48rpx;
|
|
|
|
- height: 46rpx;
|
|
|
|
-}
|
|
|
|
-.commodity .cardBox .checked {
|
|
|
|
- background-color: #30C866;
|
|
|
|
-}
|
|
|
|
-.commodity .introduce {
|
|
|
|
- margin: 20rpx 0;
|
|
|
|
- position: relative;
|
|
|
|
- z-index: 2;
|
|
|
|
- width: 100%;
|
|
|
|
- padding: 0rpx 20rpx 30rpx;
|
|
|
|
- background-color: white;
|
|
|
|
- box-shadow: 0 -31rpx 30rpx #ffffff;
|
|
|
|
-}
|
|
|
|
-.commodity .introduce .title {
|
|
|
|
- margin-bottom: 20rpx;
|
|
|
|
- font-size: 32rpx;
|
|
|
|
- font-weight: bold;
|
|
|
|
-}
|
|
|
|
-.commodity .introduce .price {
|
|
|
|
- font-size: 34rpx;
|
|
|
|
- font-weight: bold;
|
|
|
|
- color: #FF3B00;
|
|
|
|
-}
|
|
|
|
-.commodity .entry {
|
|
|
|
- margin-top: 10rpx;
|
|
|
|
- padding: 36rpx 0rpx;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- background-color: white;
|
|
|
|
- font-size: 30rpx;
|
|
|
|
-}
|
|
|
|
-.commodity .entry .title {
|
|
|
|
- width: 140rpx;
|
|
|
|
- text-align: center;
|
|
|
|
- color: #666666;
|
|
|
|
-}
|
|
|
|
-.commodity .entry .detaild {
|
|
|
|
- font-weight: bold;
|
|
|
|
-}
|
|
|
|
-.commodity .remind {
|
|
|
|
- padding: 25rpx 36rpx;
|
|
|
|
-}
|
|
|
|
-.commodity .remind .title {
|
|
|
|
- font-weight: bold;
|
|
|
|
- color: #212122;
|
|
|
|
-}
|
|
|
|
-.commodity .remind .li {
|
|
|
|
- margin-top: 20rpx;
|
|
|
|
- font-size: 28rpx;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
-}
|
|
|
|
-.commodity .remind .li .resetBtn {
|
|
|
|
- margin-left: 30rpx;
|
|
|
|
- border: none;
|
|
|
|
-}
|
|
|
|
-.commodity .remind .li .img {
|
|
|
|
- width: 70rpx;
|
|
|
|
- height: 70rpx;
|
|
|
|
-}
|
|
|
|
-.commodity .payBox {
|
|
|
|
- position: fixed;
|
|
|
|
- width: 100%;
|
|
|
|
- bottom: 0px;
|
|
|
|
- left: 0;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- padding: 22rpx 36rpx 30rpx;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- background-color: white;
|
|
|
|
- box-shadow: rgba(0, 0, 0, 0.35) 0px 30rpx 20rpx 20rpx;
|
|
|
|
-}
|
|
|
|
-.commodity .payBox .left {
|
|
|
|
- font-size: 32rpx;
|
|
|
|
-}
|
|
|
|
-.commodity .payBox .left text {
|
|
|
|
- font-size: 36rpx;
|
|
|
|
- color: #FF3B00;
|
|
|
|
-}
|
|
|
|
-.commodity .payBox .buyBtn {
|
|
|
|
- padding: 14rpx 100rpx;
|
|
|
|
- background-color: #FF8E20;
|
|
|
|
- border-radius: 50rpx;
|
|
|
|
- color: white;
|
|
|
|
- font-size: 36rpx;
|
|
|
|
-}
|
|
|
|
-.commodity .activationModal {
|
|
|
|
- position: fixed;
|
|
|
|
- z-index: 2;
|
|
|
|
- left: 0rpx;
|
|
|
|
- top: 0rpx;
|
|
|
|
- width: 100vw;
|
|
|
|
- height: 100vh;
|
|
|
|
- background: rgba(0, 0, 0, 0.7);
|
|
|
|
-}
|
|
|
|
-.commodity .activationModal .bg {
|
|
|
|
- position: absolute;
|
|
|
|
- width: 100%;
|
|
|
|
- height: 200rpx;
|
|
|
|
- z-index: -1;
|
|
|
|
- border-radius: 0 0 100rpx 100rpx;
|
|
|
|
- background-image: linear-gradient(132deg, #FFF4DB 14%, #FFF4DB 62%, #FEE5B5 100%);
|
|
|
|
- font-size: 40rpx;
|
|
|
|
- font-weight: bold;
|
|
|
|
- padding-top: 60rpx;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- text-align: center;
|
|
|
|
-}
|
|
|
|
-.commodity .activationModal .box {
|
|
|
|
- position: absolute;
|
|
|
|
- left: 0;
|
|
|
|
- right: 0;
|
|
|
|
- top: 30%;
|
|
|
|
- margin: auto;
|
|
|
|
- width: 660rpx;
|
|
|
|
- height: 550rpx;
|
|
|
|
- background-color: white;
|
|
|
|
- border-radius: 20rpx;
|
|
|
|
- text-align: center;
|
|
|
|
-}
|
|
|
|
-.commodity .activationModal .box .sLcon {
|
|
|
|
- margin-top: 164rpx;
|
|
|
|
- width: 580rpx;
|
|
|
|
- height: 326rpx;
|
|
|
|
-}
|
|
|
|
-.commodity .activationModal .box .close {
|
|
|
|
- position: absolute;
|
|
|
|
- padding: 40rpx;
|
|
|
|
- width: 54rpx;
|
|
|
|
- height: 54rpx;
|
|
|
|
- left: 0;
|
|
|
|
- right: 0;
|
|
|
|
- bottom: -140rpx;
|
|
|
|
- margin: auto;
|
|
|
|
-}
|
|
|