xiaoe_mp_npm 0.5.42-test2 → 0.5.42-test21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/miniprogram_dist/ConfirmOrder/components/ConfirmOrderContent/index.scss +45 -0
  2. package/miniprogram_dist/ConfirmOrder/components/ConfirmOrderContent/index.wxss +37 -1
  3. package/miniprogram_dist/ConfirmOrder/components/GoodsInfo/index.scss +223 -0
  4. package/miniprogram_dist/ConfirmOrder/components/GoodsInfo/index.wxss +522 -36
  5. package/miniprogram_dist/ConfirmOrder/components/IntegralSelect/index.scss +91 -0
  6. package/miniprogram_dist/ConfirmOrder/components/IntegralSelect/index.wxss +170 -14
  7. package/miniprogram_dist/ConfirmOrder/components/Invoice/index.scss +61 -0
  8. package/miniprogram_dist/ConfirmOrder/components/Invoice/index.wxss +68 -2
  9. package/miniprogram_dist/ConfirmOrder/components/LeaveWord/index.scss +40 -0
  10. package/miniprogram_dist/ConfirmOrder/components/LeaveWord/index.wxss +26 -2
  11. package/miniprogram_dist/ConfirmOrder/components/PayBar/index.scss +62 -0
  12. package/miniprogram_dist/ConfirmOrder/components/PayBar/index.wxss +81 -3
  13. package/miniprogram_dist/ConfirmOrder/components/PayDetail/index.scss +41 -0
  14. package/miniprogram_dist/ConfirmOrder/components/PayDetail/index.wxss +35 -3
  15. package/miniprogram_dist/CouponList/components/CouponItem/index.css +1715 -1715
  16. package/miniprogram_dist/CouponList/components/CouponItem/index.js +31 -22
  17. package/miniprogram_dist/CouponList/components/CouponItem/index.min.css +1 -1
  18. package/miniprogram_dist/CouponList/components/CouponItem/index.wxml +6 -2
  19. package/miniprogram_dist/CouponList/components/CouponItem/index.wxss +1037 -79
  20. package/miniprogram_dist/CouponList/couponColumn/index.js +5 -1
  21. package/miniprogram_dist/CouponList/couponColumn/index.scss +118 -0
  22. package/miniprogram_dist/CouponList/couponColumn/index.wxml +1 -0
  23. package/miniprogram_dist/CouponList/couponColumn/index.wxss +221 -32
  24. package/miniprogram_dist/CouponReceivePopup/index.js +75 -0
  25. package/miniprogram_dist/CouponReceivePopup/index.json +6 -0
  26. package/miniprogram_dist/CouponReceivePopup/index.scss +99 -0
  27. package/miniprogram_dist/CouponReceivePopup/index.wxml +85 -0
  28. package/miniprogram_dist/CouponReceivePopup/index.wxss +75 -0
  29. package/miniprogram_dist/GoodsItem/index.js +7 -5
  30. package/miniprogram_dist/GoodsItem/index.scss +45 -22
  31. package/miniprogram_dist/GoodsItem/index.wxml +11 -11
  32. package/miniprogram_dist/GoodsItem/index.wxs +18 -18
  33. package/miniprogram_dist/GoodsItem/index.wxss +1273 -116
  34. package/miniprogram_dist/GoodsRecommend/index.scss +162 -0
  35. package/miniprogram_dist/GoodsRecommend/index.wxss +418 -33
  36. package/miniprogram_dist/LiveGoodsList/Header/index.scss +79 -0
  37. package/miniprogram_dist/LiveGoodsList/Header/index.wxss +148 -10
  38. package/miniprogram_dist/LiveGoodsList/index.js +167 -25
  39. package/miniprogram_dist/LiveGoodsList/index.scss +93 -0
  40. package/miniprogram_dist/LiveGoodsList/index.wxml +41 -19
  41. package/miniprogram_dist/LiveGoodsList/index.wxss +187 -19
  42. package/miniprogram_dist/PayModule/button/index.scss +45 -0
  43. package/miniprogram_dist/PayModule/button/index.wxss +46 -4
  44. package/miniprogram_dist/TeacherGoodsList/index.js +778 -585
  45. package/miniprogram_dist/TeacherGoodsList/index.scss +5 -2
  46. package/miniprogram_dist/TeacherGoodsList/index.wxml +42 -24
  47. package/miniprogram_dist/TeacherGoodsList/index.wxss +132 -14
  48. package/miniprogram_dist/common/api/liveGoodsList.js +10 -2
  49. package/miniprogram_dist/common/utils/index.js +14 -0
  50. package/miniprogram_dist/coupon/components/CouponItem/index.less +1 -0
  51. package/miniprogram_dist/coupon/components/CouponItem/index.scss +247 -0
  52. package/miniprogram_dist/coupon/components/CouponItem/index.wxss +677 -86
  53. package/miniprogram_dist/coupon/components/CouponSelect/index.scss +331 -0
  54. package/miniprogram_dist/coupon/components/CouponSelect/index.wxss +861 -59
  55. package/miniprogram_dist/coupon/index.scss +83 -0
  56. package/miniprogram_dist/coupon/index.wxss +171 -15
  57. package/package.json +2 -2
  58. package/src/ConfirmOrder/components/ConfirmOrderContent/index.scss +45 -0
  59. package/src/ConfirmOrder/components/ConfirmOrderContent/index.wxss +42 -1
  60. package/src/ConfirmOrder/components/GoodsInfo/index.scss +223 -0
  61. package/src/ConfirmOrder/components/GoodsInfo/index.wxss +552 -39
  62. package/src/ConfirmOrder/components/IntegralSelect/index.scss +91 -0
  63. package/src/ConfirmOrder/components/IntegralSelect/index.wxss +182 -14
  64. package/src/ConfirmOrder/components/Invoice/index.scss +61 -0
  65. package/src/ConfirmOrder/components/Invoice/index.wxss +75 -2
  66. package/src/ConfirmOrder/components/LeaveWord/index.scss +40 -0
  67. package/src/ConfirmOrder/components/LeaveWord/index.wxss +30 -2
  68. package/src/ConfirmOrder/components/PayBar/index.scss +62 -0
  69. package/src/ConfirmOrder/components/PayBar/index.wxss +87 -3
  70. package/src/ConfirmOrder/components/PayDetail/index.scss +41 -0
  71. package/src/ConfirmOrder/components/PayDetail/index.wxss +39 -3
  72. package/src/CouponList/components/CouponItem/index.css +1715 -1715
  73. package/src/CouponList/components/CouponItem/index.js +31 -22
  74. package/src/CouponList/components/CouponItem/index.min.css +1 -1
  75. package/src/CouponList/components/CouponItem/index.wxml +6 -2
  76. package/src/CouponList/components/CouponItem/index.wxss +1039 -85
  77. package/src/CouponList/couponColumn/index.js +5 -1
  78. package/src/CouponList/couponColumn/index.scss +118 -0
  79. package/src/CouponList/couponColumn/index.wxml +1 -0
  80. package/src/CouponList/couponColumn/index.wxss +236 -32
  81. package/src/CouponReceivePopup/index.js +75 -0
  82. package/src/CouponReceivePopup/index.json +6 -0
  83. package/src/CouponReceivePopup/index.scss +99 -0
  84. package/src/CouponReceivePopup/index.wxml +85 -0
  85. package/src/CouponReceivePopup/index.wxss +1 -0
  86. package/src/GoodsItem/index.js +7 -5
  87. package/src/GoodsItem/index.scss +45 -22
  88. package/src/GoodsItem/index.wxml +11 -11
  89. package/src/GoodsItem/index.wxs +18 -18
  90. package/src/GoodsItem/index.wxss +1331 -116
  91. package/src/GoodsRecommend/index.scss +162 -0
  92. package/src/GoodsRecommend/index.wxss +441 -33
  93. package/src/LiveGoodsList/Header/index.scss +79 -0
  94. package/src/LiveGoodsList/Header/index.wxss +156 -10
  95. package/src/LiveGoodsList/index.js +167 -25
  96. package/src/LiveGoodsList/index.scss +93 -0
  97. package/src/LiveGoodsList/index.wxml +41 -19
  98. package/src/LiveGoodsList/index.wxss +230 -50
  99. package/src/PayModule/button/index.scss +45 -0
  100. package/src/PayModule/button/index.wxss +50 -4
  101. package/src/TeacherGoodsList/index.js +778 -585
  102. package/src/TeacherGoodsList/index.scss +5 -2
  103. package/src/TeacherGoodsList/index.wxml +42 -24
  104. package/src/TeacherGoodsList/index.wxss +151 -14
  105. package/src/common/api/liveGoodsList.js +10 -2
  106. package/src/common/utils/index.js +14 -0
  107. package/src/coupon/components/CouponItem/index.less +1 -0
  108. package/src/coupon/components/CouponItem/index.scss +247 -0
  109. package/src/coupon/components/CouponItem/index.wxss +712 -86
  110. package/src/coupon/components/CouponSelect/index.scss +331 -0
  111. package/src/coupon/components/CouponSelect/index.wxss +910 -59
  112. package/src/coupon/index.scss +83 -0
  113. package/src/coupon/index.wxss +181 -15
  114. package/miniprogram_dist/GoodsItem/index.css +0 -1364
  115. package/miniprogram_dist/GoodsItem/index.less +0 -299
  116. package/miniprogram_dist/GoodsItem/index.min.css +0 -1
  117. package/miniprogram_dist/TeacherGoodsList/index.css +0 -187
  118. package/miniprogram_dist/TeacherGoodsList/index.min.css +0 -1
  119. package/src/GoodsItem/index.css +0 -1364
  120. package/src/GoodsItem/index.less +0 -299
  121. package/src/GoodsItem/index.min.css +0 -1
  122. package/src/TeacherGoodsList/index.css +0 -187
  123. package/src/TeacherGoodsList/index.min.css +0 -1
@@ -0,0 +1,91 @@
1
+ $deviceWidth: 750;
2
+ @function vmin($rpx) {
3
+ @return #{$rpx * 100 / $deviceWidth}vmin;
4
+ }
5
+
6
+ @mixin integral-select {
7
+ padding: 0 vmin(32);
8
+ background-color: #fff;
9
+
10
+ .integral-wrapper {
11
+ border-top: vmin(1) solid #eee;
12
+ display: flex;
13
+ align-items: center;
14
+ justify-content: space-between;
15
+ box-sizing: border-box;
16
+ background: #fff;
17
+ height: vmin(88);
18
+ .width16{
19
+ width:vmin(32);
20
+ }
21
+
22
+ .left-text {
23
+ display: flex;
24
+ flex-direction: row;
25
+ align-items: center;
26
+
27
+ .title {
28
+ font-size: vmin(28);
29
+ color: #333;
30
+ }
31
+
32
+ .tips-icon {
33
+ width: vmin(28);
34
+ height: vmin(28);
35
+ margin-left: vmin(8);
36
+ color: #999;
37
+ padding-top: vmin(2);
38
+ }
39
+ }
40
+
41
+ .right-text {
42
+ display: flex;
43
+ align-items: center;
44
+
45
+ .current {
46
+ font-size: vmin(28);
47
+ color: #999;
48
+ margin-right: vmin(16);
49
+ }
50
+
51
+ .discount {
52
+ font-size: vmin(28);
53
+ color: #ff8205;
54
+ margin-right: vmin(16);
55
+ }
56
+ }
57
+
58
+ .cannot-use {
59
+ font-size: vmin(28);
60
+ color: #c8c8c8;
61
+ }
62
+ }
63
+ }
64
+
65
+ .integral-select {
66
+ @include integral-select;
67
+ }
68
+ // 竖屏pad
69
+ @media screen and (min-width: 768px) and (orientation: portrait) {
70
+ $deviceWidth: 1536 !global;
71
+
72
+ .integral-select {
73
+ @include integral-select;
74
+ }
75
+ }
76
+ // PC 放大适配
77
+ @media screen and (min-height: 630px) and (orientation: landscape) {
78
+ $deviceWidth: 1260 !global;
79
+
80
+ .integral-select {
81
+ @include integral-select;
82
+ }
83
+ }
84
+ // 横屏pad
85
+ @media screen and (min-height: 768px) and (orientation: landscape) {
86
+ $deviceWidth: 1536 !global;
87
+
88
+ .integral-select {
89
+ @include integral-select;
90
+ }
91
+ }
@@ -1,18 +1,18 @@
1
1
  .integral-select {
2
- padding: 0 4.27vmin;
2
+ padding: 0 4.26667vmin;
3
3
  background-color: #fff;
4
4
  }
5
5
  .integral-select .integral-wrapper {
6
- border-top: 0.13vmin solid #eee;
6
+ border-top: 0.13333vmin solid #eee;
7
7
  display: flex;
8
8
  align-items: center;
9
9
  justify-content: space-between;
10
10
  box-sizing: border-box;
11
11
  background: #fff;
12
- height: 11.73vmin;
12
+ height: 11.73333vmin;
13
13
  }
14
14
  .integral-select .integral-wrapper .width16 {
15
- width: 4.27vmin;
15
+ width: 4.26667vmin;
16
16
  }
17
17
  .integral-select .integral-wrapper .left-text {
18
18
  display: flex;
@@ -20,31 +20,187 @@
20
20
  align-items: center;
21
21
  }
22
22
  .integral-select .integral-wrapper .left-text .title {
23
- font-size: 3.73vmin;
23
+ font-size: 3.73333vmin;
24
24
  color: #333;
25
25
  }
26
26
  .integral-select .integral-wrapper .left-text .tips-icon {
27
- width: 3.73vmin;
28
- height: 3.73vmin;
29
- margin-left: 1.07vmin;
27
+ width: 3.73333vmin;
28
+ height: 3.73333vmin;
29
+ margin-left: 1.06667vmin;
30
30
  color: #999;
31
- padding-top: 0.27vmin;
31
+ padding-top: 0.26667vmin;
32
32
  }
33
33
  .integral-select .integral-wrapper .right-text {
34
34
  display: flex;
35
35
  align-items: center;
36
36
  }
37
37
  .integral-select .integral-wrapper .right-text .current {
38
- font-size: 3.73vmin;
38
+ font-size: 3.73333vmin;
39
39
  color: #999;
40
- margin-right: 2.13vmin;
40
+ margin-right: 2.13333vmin;
41
41
  }
42
42
  .integral-select .integral-wrapper .right-text .discount {
43
- font-size: 3.73vmin;
43
+ font-size: 3.73333vmin;
44
44
  color: #ff8205;
45
- margin-right: 2.13vmin;
45
+ margin-right: 2.13333vmin;
46
46
  }
47
47
  .integral-select .integral-wrapper .cannot-use {
48
- font-size: 3.73vmin;
48
+ font-size: 3.73333vmin;
49
49
  color: #c8c8c8;
50
50
  }
51
+ @media screen and (min-width: 768px) and (orientation: portrait) {
52
+ .integral-select {
53
+ padding: 0 2.08333vmin;
54
+ background-color: #fff;
55
+ }
56
+ .integral-select .integral-wrapper {
57
+ border-top: 0.0651vmin solid #eee;
58
+ display: flex;
59
+ align-items: center;
60
+ justify-content: space-between;
61
+ box-sizing: border-box;
62
+ background: #fff;
63
+ height: 5.72917vmin;
64
+ }
65
+ .integral-select .integral-wrapper .width16 {
66
+ width: 2.08333vmin;
67
+ }
68
+ .integral-select .integral-wrapper .left-text {
69
+ display: flex;
70
+ flex-direction: row;
71
+ align-items: center;
72
+ }
73
+ .integral-select .integral-wrapper .left-text .title {
74
+ font-size: 1.82292vmin;
75
+ color: #333;
76
+ }
77
+ .integral-select .integral-wrapper .left-text .tips-icon {
78
+ width: 1.82292vmin;
79
+ height: 1.82292vmin;
80
+ margin-left: 0.52083vmin;
81
+ color: #999;
82
+ padding-top: 0.13021vmin;
83
+ }
84
+ .integral-select .integral-wrapper .right-text {
85
+ display: flex;
86
+ align-items: center;
87
+ }
88
+ .integral-select .integral-wrapper .right-text .current {
89
+ font-size: 1.82292vmin;
90
+ color: #999;
91
+ margin-right: 1.04167vmin;
92
+ }
93
+ .integral-select .integral-wrapper .right-text .discount {
94
+ font-size: 1.82292vmin;
95
+ color: #ff8205;
96
+ margin-right: 1.04167vmin;
97
+ }
98
+ .integral-select .integral-wrapper .cannot-use {
99
+ font-size: 1.82292vmin;
100
+ color: #c8c8c8;
101
+ }
102
+ }
103
+ @media screen and (min-height: 630px) and (orientation: landscape) {
104
+ .integral-select {
105
+ padding: 0 2.53968vmin;
106
+ background-color: #fff;
107
+ }
108
+ .integral-select .integral-wrapper {
109
+ border-top: 0.07937vmin solid #eee;
110
+ display: flex;
111
+ align-items: center;
112
+ justify-content: space-between;
113
+ box-sizing: border-box;
114
+ background: #fff;
115
+ height: 6.98413vmin;
116
+ }
117
+ .integral-select .integral-wrapper .width16 {
118
+ width: 2.53968vmin;
119
+ }
120
+ .integral-select .integral-wrapper .left-text {
121
+ display: flex;
122
+ flex-direction: row;
123
+ align-items: center;
124
+ }
125
+ .integral-select .integral-wrapper .left-text .title {
126
+ font-size: 2.22222vmin;
127
+ color: #333;
128
+ }
129
+ .integral-select .integral-wrapper .left-text .tips-icon {
130
+ width: 2.22222vmin;
131
+ height: 2.22222vmin;
132
+ margin-left: 0.63492vmin;
133
+ color: #999;
134
+ padding-top: 0.15873vmin;
135
+ }
136
+ .integral-select .integral-wrapper .right-text {
137
+ display: flex;
138
+ align-items: center;
139
+ }
140
+ .integral-select .integral-wrapper .right-text .current {
141
+ font-size: 2.22222vmin;
142
+ color: #999;
143
+ margin-right: 1.26984vmin;
144
+ }
145
+ .integral-select .integral-wrapper .right-text .discount {
146
+ font-size: 2.22222vmin;
147
+ color: #ff8205;
148
+ margin-right: 1.26984vmin;
149
+ }
150
+ .integral-select .integral-wrapper .cannot-use {
151
+ font-size: 2.22222vmin;
152
+ color: #c8c8c8;
153
+ }
154
+ }
155
+ @media screen and (min-height: 768px) and (orientation: landscape) {
156
+ .integral-select {
157
+ padding: 0 2.08333vmin;
158
+ background-color: #fff;
159
+ }
160
+ .integral-select .integral-wrapper {
161
+ border-top: 0.0651vmin solid #eee;
162
+ display: flex;
163
+ align-items: center;
164
+ justify-content: space-between;
165
+ box-sizing: border-box;
166
+ background: #fff;
167
+ height: 5.72917vmin;
168
+ }
169
+ .integral-select .integral-wrapper .width16 {
170
+ width: 2.08333vmin;
171
+ }
172
+ .integral-select .integral-wrapper .left-text {
173
+ display: flex;
174
+ flex-direction: row;
175
+ align-items: center;
176
+ }
177
+ .integral-select .integral-wrapper .left-text .title {
178
+ font-size: 1.82292vmin;
179
+ color: #333;
180
+ }
181
+ .integral-select .integral-wrapper .left-text .tips-icon {
182
+ width: 1.82292vmin;
183
+ height: 1.82292vmin;
184
+ margin-left: 0.52083vmin;
185
+ color: #999;
186
+ padding-top: 0.13021vmin;
187
+ }
188
+ .integral-select .integral-wrapper .right-text {
189
+ display: flex;
190
+ align-items: center;
191
+ }
192
+ .integral-select .integral-wrapper .right-text .current {
193
+ font-size: 1.82292vmin;
194
+ color: #999;
195
+ margin-right: 1.04167vmin;
196
+ }
197
+ .integral-select .integral-wrapper .right-text .discount {
198
+ font-size: 1.82292vmin;
199
+ color: #ff8205;
200
+ margin-right: 1.04167vmin;
201
+ }
202
+ .integral-select .integral-wrapper .cannot-use {
203
+ font-size: 1.82292vmin;
204
+ color: #c8c8c8;
205
+ }
206
+ }
@@ -0,0 +1,61 @@
1
+ $deviceWidth: 750;
2
+ @function vmin($rpx) {
3
+ @return #{$rpx * 100 / $deviceWidth}vmin;
4
+ }
5
+
6
+ @mixin invoice-show {
7
+ .invoice-title {
8
+ min-width: vmin(144);
9
+ flex-grow: 0;
10
+ }
11
+
12
+ .right-cont {
13
+ display: flex;
14
+ text-align: right;
15
+ align-items: center;
16
+ justify-content: flex-end;
17
+
18
+ .img-zhixiang {
19
+ width: vmin(32);
20
+ height: vmin(32);
21
+ }
22
+ }
23
+
24
+ .EC1 {
25
+ color: #333;
26
+ }
27
+
28
+ .EC4 {
29
+ color: #ccc;
30
+ }
31
+ }
32
+
33
+ .invoice-show {
34
+ @include invoice-show;
35
+ }
36
+ // 竖屏pad
37
+ @media screen and (min-width: 768px) and (orientation: portrait) {
38
+ $deviceWidth: 1536 !global;
39
+
40
+ .invoice-show {
41
+ @include invoice-show;
42
+ }
43
+ }
44
+
45
+ // PC 放大适配
46
+ @media screen and (min-height: 630px) and (orientation: landscape) {
47
+ $deviceWidth: 1260 !global;
48
+
49
+ .invoice-show {
50
+ @include invoice-show;
51
+ }
52
+ }
53
+
54
+ // 横屏pad
55
+ @media screen and (min-height: 768px) and (orientation: landscape) {
56
+ $deviceWidth: 1536 !global;
57
+
58
+ .invoice-show {
59
+ @include invoice-show;
60
+ }
61
+ }
@@ -9,8 +9,8 @@
9
9
  justify-content: flex-end;
10
10
  }
11
11
  .invoice-show .right-cont .img-zhixiang {
12
- width: 4.27vmin;
13
- height: 4.27vmin;
12
+ width: 4.26667vmin;
13
+ height: 4.26667vmin;
14
14
  }
15
15
  .invoice-show .EC1 {
16
16
  color: #333;
@@ -18,3 +18,69 @@
18
18
  .invoice-show .EC4 {
19
19
  color: #ccc;
20
20
  }
21
+ @media screen and (min-width: 768px) and (orientation: portrait) {
22
+ .invoice-show .invoice-title {
23
+ min-width: 9.375vmin;
24
+ flex-grow: 0;
25
+ }
26
+ .invoice-show .right-cont {
27
+ display: flex;
28
+ text-align: right;
29
+ align-items: center;
30
+ justify-content: flex-end;
31
+ }
32
+ .invoice-show .right-cont .img-zhixiang {
33
+ width: 2.08333vmin;
34
+ height: 2.08333vmin;
35
+ }
36
+ .invoice-show .EC1 {
37
+ color: #333;
38
+ }
39
+ .invoice-show .EC4 {
40
+ color: #ccc;
41
+ }
42
+ }
43
+ @media screen and (min-height: 630px) and (orientation: landscape) {
44
+ .invoice-show .invoice-title {
45
+ min-width: 11.42857vmin;
46
+ flex-grow: 0;
47
+ }
48
+ .invoice-show .right-cont {
49
+ display: flex;
50
+ text-align: right;
51
+ align-items: center;
52
+ justify-content: flex-end;
53
+ }
54
+ .invoice-show .right-cont .img-zhixiang {
55
+ width: 2.53968vmin;
56
+ height: 2.53968vmin;
57
+ }
58
+ .invoice-show .EC1 {
59
+ color: #333;
60
+ }
61
+ .invoice-show .EC4 {
62
+ color: #ccc;
63
+ }
64
+ }
65
+ @media screen and (min-height: 768px) and (orientation: landscape) {
66
+ .invoice-show .invoice-title {
67
+ min-width: 9.375vmin;
68
+ flex-grow: 0;
69
+ }
70
+ .invoice-show .right-cont {
71
+ display: flex;
72
+ text-align: right;
73
+ align-items: center;
74
+ justify-content: flex-end;
75
+ }
76
+ .invoice-show .right-cont .img-zhixiang {
77
+ width: 2.08333vmin;
78
+ height: 2.08333vmin;
79
+ }
80
+ .invoice-show .EC1 {
81
+ color: #333;
82
+ }
83
+ .invoice-show .EC4 {
84
+ color: #ccc;
85
+ }
86
+ }
@@ -0,0 +1,40 @@
1
+ $deviceWidth: 750;
2
+ @function vmin($rpx) {
3
+ @return #{$rpx * 100 / $deviceWidth}vmin;
4
+ }
5
+
6
+ @mixin leave-word {
7
+ margin-bottom: vmin(16);
8
+
9
+ .van-cell {
10
+ line-height: vmin(40);
11
+ }
12
+ }
13
+
14
+ .leave-word {
15
+ @include leave-word;
16
+ }
17
+ // 竖屏pad
18
+ @media screen and (min-width: 768px) and (orientation: portrait) {
19
+ $deviceWidth: 1536 !global;
20
+
21
+ .leave-word {
22
+ @include leave-word;
23
+ }
24
+ }
25
+ // PC 放大适配
26
+ @media screen and (min-height: 630px) and (orientation: landscape) {
27
+ $deviceWidth: 1260 !global;
28
+
29
+ .leave-word {
30
+ @include leave-word;
31
+ }
32
+ }
33
+ // 横屏pad
34
+ @media screen and (min-height: 768px) and (orientation: landscape) {
35
+ $deviceWidth: 1536 !global;
36
+
37
+ .leave-word {
38
+ @include leave-word;
39
+ }
40
+ }
@@ -1,6 +1,30 @@
1
1
  .leave-word {
2
- margin-bottom: 2.13vmin;
2
+ margin-bottom: 2.13333vmin;
3
3
  }
4
4
  .leave-word .van-cell {
5
- line-height: 5.33vmin;
5
+ line-height: 5.33333vmin;
6
+ }
7
+ @media screen and (min-width: 768px) and (orientation: portrait) {
8
+ .leave-word {
9
+ margin-bottom: 1.04167vmin;
10
+ }
11
+ .leave-word .van-cell {
12
+ line-height: 2.60417vmin;
13
+ }
14
+ }
15
+ @media screen and (min-height: 630px) and (orientation: landscape) {
16
+ .leave-word {
17
+ margin-bottom: 1.26984vmin;
18
+ }
19
+ .leave-word .van-cell {
20
+ line-height: 3.1746vmin;
21
+ }
22
+ }
23
+ @media screen and (min-height: 768px) and (orientation: landscape) {
24
+ .leave-word {
25
+ margin-bottom: 1.04167vmin;
26
+ }
27
+ .leave-word .van-cell {
28
+ line-height: 2.60417vmin;
29
+ }
6
30
  }
@@ -0,0 +1,62 @@
1
+ $deviceWidth: 750;
2
+ @function vmin($rpx) {
3
+ @return #{$rpx * 100 / $deviceWidth}vmin;
4
+ }
5
+
6
+ @mixin paybar {
7
+ bottom: 0;
8
+ background: #fff;
9
+ box-shadow: 0 0 vmin(16) 0 rgba(0, 0, 0, 0.08);
10
+ position: fixed;
11
+ width: 100%;
12
+
13
+ .pay-wrapper {
14
+ display: flex;
15
+ justify-content: space-between;
16
+ align-items: center;
17
+ box-sizing: border-box;
18
+ padding: 0 vmin(40);
19
+ height: vmin(112);
20
+
21
+ .pay-amount {
22
+ .pay-text {
23
+ font-weight: 500;
24
+ }
25
+
26
+ .pay-price-float,
27
+ .pay-price-int,
28
+ .pay-currency {
29
+ color: #ff5429;
30
+ font-weight: 500;
31
+ }
32
+ }
33
+ }
34
+ }
35
+
36
+ .paybar {
37
+ @include paybar;
38
+ }
39
+ // 竖屏pad
40
+ @media screen and (min-width: 768px) and (orientation: portrait) {
41
+ $deviceWidth: 1536 !global;
42
+
43
+ .paybar {
44
+ @include paybar;
45
+ }
46
+ }
47
+ // PC 放大适配
48
+ @media screen and (min-height: 630px) and (orientation: landscape) {
49
+ $deviceWidth: 1260 !global;
50
+
51
+ p.paybar {
52
+ @include paybar;
53
+ }
54
+ }
55
+ // 横屏pad
56
+ @media screen and (min-height: 768px) and (orientation: landscape) {
57
+ $deviceWidth: 1536 !global;
58
+
59
+ .paybar {
60
+ @include paybar;
61
+ }
62
+ }
@@ -1,7 +1,7 @@
1
1
  .paybar {
2
2
  bottom: 0;
3
3
  background: #fff;
4
- box-shadow: 0 0 2.13vmin 0 rgba(0, 0, 0, 0.08);
4
+ box-shadow: 0 0 2.13333vmin 0 rgba(0, 0, 0, 0.08);
5
5
  position: fixed;
6
6
  width: 100%;
7
7
  }
@@ -10,8 +10,8 @@
10
10
  justify-content: space-between;
11
11
  align-items: center;
12
12
  box-sizing: border-box;
13
- padding: 0 5.33vmin;
14
- height: 14.93vmin;
13
+ padding: 0 5.33333vmin;
14
+ height: 14.93333vmin;
15
15
  }
16
16
  .paybar .pay-wrapper .pay-amount .pay-text {
17
17
  font-weight: 500;
@@ -22,3 +22,81 @@
22
22
  color: #ff5429;
23
23
  font-weight: 500;
24
24
  }
25
+ @media screen and (min-width: 768px) and (orientation: portrait) {
26
+ .paybar {
27
+ bottom: 0;
28
+ background: #fff;
29
+ box-shadow: 0 0 1.04167vmin 0 rgba(0, 0, 0, 0.08);
30
+ position: fixed;
31
+ width: 100%;
32
+ }
33
+ .paybar .pay-wrapper {
34
+ display: flex;
35
+ justify-content: space-between;
36
+ align-items: center;
37
+ box-sizing: border-box;
38
+ padding: 0 2.60417vmin;
39
+ height: 7.29167vmin;
40
+ }
41
+ .paybar .pay-wrapper .pay-amount .pay-text {
42
+ font-weight: 500;
43
+ }
44
+ .paybar .pay-wrapper .pay-amount .pay-price-float,
45
+ .paybar .pay-wrapper .pay-amount .pay-price-int,
46
+ .paybar .pay-wrapper .pay-amount .pay-currency {
47
+ color: #ff5429;
48
+ font-weight: 500;
49
+ }
50
+ }
51
+ @media screen and (min-height: 630px) and (orientation: landscape) {
52
+ p.paybar {
53
+ bottom: 0;
54
+ background: #fff;
55
+ box-shadow: 0 0 1.26984vmin 0 rgba(0, 0, 0, 0.08);
56
+ position: fixed;
57
+ width: 100%;
58
+ }
59
+ p.paybar .pay-wrapper {
60
+ display: flex;
61
+ justify-content: space-between;
62
+ align-items: center;
63
+ box-sizing: border-box;
64
+ padding: 0 3.1746vmin;
65
+ height: 8.88889vmin;
66
+ }
67
+ p.paybar .pay-wrapper .pay-amount .pay-text {
68
+ font-weight: 500;
69
+ }
70
+ p.paybar .pay-wrapper .pay-amount .pay-price-float,
71
+ p.paybar .pay-wrapper .pay-amount .pay-price-int,
72
+ p.paybar .pay-wrapper .pay-amount .pay-currency {
73
+ color: #ff5429;
74
+ font-weight: 500;
75
+ }
76
+ }
77
+ @media screen and (min-height: 768px) and (orientation: landscape) {
78
+ .paybar {
79
+ bottom: 0;
80
+ background: #fff;
81
+ box-shadow: 0 0 1.04167vmin 0 rgba(0, 0, 0, 0.08);
82
+ position: fixed;
83
+ width: 100%;
84
+ }
85
+ .paybar .pay-wrapper {
86
+ display: flex;
87
+ justify-content: space-between;
88
+ align-items: center;
89
+ box-sizing: border-box;
90
+ padding: 0 2.60417vmin;
91
+ height: 7.29167vmin;
92
+ }
93
+ .paybar .pay-wrapper .pay-amount .pay-text {
94
+ font-weight: 500;
95
+ }
96
+ .paybar .pay-wrapper .pay-amount .pay-price-float,
97
+ .paybar .pay-wrapper .pay-amount .pay-price-int,
98
+ .paybar .pay-wrapper .pay-amount .pay-currency {
99
+ color: #ff5429;
100
+ font-weight: 500;
101
+ }
102
+ }