Commit c1ad09c9f241fb2cd9e06132a88f8ea596a17d5e
1 parent
cd0c59aa
商品界面优化
Showing
8 changed files
with
625 additions
and
519 deletions
components/diy_goodsGroup/diy_goodsGroup.wxml
... | ... | @@ -44,9 +44,9 @@ |
44 | 44 | <block wx:if="{{card_field}}"> |
45 | 45 | <!-- 等级价>0 --> |
46 | 46 | <block wx:if="{{item[card_field]>0}}"> |
47 | - <view class="money flex" > | |
47 | + <view class="money flex ai_and"> | |
48 | 48 | <!-- 办卡价 --> |
49 | - <view class="flex xc-wc "> | |
49 | + <view class="flex xc-wc ai_and"> | |
50 | 50 | <view class="fs24 wz_red">¥</view> |
51 | 51 | <view class="fs35 wz_red">{{filter.toFix(item[card_field],2)}}</view> |
52 | 52 | <view class="card_bg"><image src="{{url}}/miniapp/images/plus/dj_icon.png"></image><view class="card_name">{{card_name}}</view></view> |
... | ... | @@ -95,7 +95,7 @@ |
95 | 95 | </view> |
96 | 96 | <view class="flex" style="line-height: 28rpx;" > |
97 | 97 | <!-- 等级价 --> |
98 | - <view class="price flex"> | |
98 | + <view class="price flex ai_and"> | |
99 | 99 | <view class="fs22">¥</view> |
100 | 100 | <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view> |
101 | 101 | <view class="card_bg"> <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>{{g_filter.get_card_price(item,card_list,1)}}</view> |
... | ... | @@ -183,7 +183,7 @@ |
183 | 183 | <block wx:if="{{item[card_field]>0}}"> |
184 | 184 | <view class="money flex" > |
185 | 185 | <!-- 办卡价 --> |
186 | - <view class="flex xc-wc"> | |
186 | + <view class="flex xc-wc ai_and"> | |
187 | 187 | <view class="fs24 wz_red">¥</view> |
188 | 188 | <view class="fs35 wz_red">{{filter.toFix(item[card_field],2)}}</view> |
189 | 189 | <view class="card_bg"><image src="{{url}}/miniapp/images/plus/dj_icon.png"></image><view class="card_name">{{card_name}}</view></view> |
... | ... | @@ -232,7 +232,7 @@ |
232 | 232 | </view> |
233 | 233 | <view class="flex" style="line-height: 28rpx;" > |
234 | 234 | <!-- 等级价 --> |
235 | - <view class="price flex"> | |
235 | + <view class="price flex ai_and"> | |
236 | 236 | <view class="fs22">¥</view> |
237 | 237 | <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view> |
238 | 238 | <view class="card_bg"> <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>{{g_filter.get_card_price(item,card_list,1)}}</view> |
... | ... | @@ -319,7 +319,7 @@ |
319 | 319 | <block wx:if="{{item[card_field]>0}}"> |
320 | 320 | <view class="money flex" > |
321 | 321 | <!-- 办卡价 --> |
322 | - <view class="flex xc-wc"> | |
322 | + <view class="flex xc-wc ai_and"> | |
323 | 323 | <view class="fs24 wz_red">¥</view> |
324 | 324 | <view class="fs35 wz_red">{{filter.toFix(item[card_field],2)}}</view> |
325 | 325 | <view class="card_bg"><image src="{{url}}/miniapp/images/plus/dj_icon.png"></image><view class="card_name">{{card_name}}</view></view> |
... | ... | @@ -368,7 +368,7 @@ |
368 | 368 | </view> |
369 | 369 | <view class="flex" style="line-height: 28rpx;" > |
370 | 370 | <!-- 等级价 --> |
371 | - <view class="price flex"> | |
371 | + <view class="price flex ai_and"> | |
372 | 372 | <view class="fs22">¥</view> |
373 | 373 | <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view> |
374 | 374 | <view class="card_bg"> <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>{{g_filter.get_card_price(item,card_list,1)}}</view> |
... | ... | @@ -450,7 +450,7 @@ |
450 | 450 | <block wx:if="{{item[card_field]>0}}"> |
451 | 451 | <view class="money flex" > |
452 | 452 | <!-- 办卡价 --> |
453 | - <view class="flex xc-wc"> | |
453 | + <view class="flex xc-wc ai_and"> | |
454 | 454 | <view class="fs24 wz_red">¥</view> |
455 | 455 | <view class="fs35 wz_red">{{filter.toFix(item[card_field],2)}}</view> |
456 | 456 | <view class="card_bg"><image src="{{url}}/miniapp/images/plus/dj_icon.png"></image><view class="card_name">{{card_name}}</view></view> |
... | ... | @@ -499,7 +499,7 @@ |
499 | 499 | </view> |
500 | 500 | <view class="flex" style="line-height: 28rpx;" > |
501 | 501 | <!-- 等级价 --> |
502 | - <view class="price flex"> | |
502 | + <view class="price flex ai_and"> | |
503 | 503 | <view class="fs22">¥</view> |
504 | 504 | <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view> |
505 | 505 | <view class="card_bg"> <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>{{g_filter.get_card_price(item,card_list,1)}}</view> | ... | ... |
components/diy_goodsGroup/diy_goodsGroup.wxss
1 | 1 | /* pages/diy_zs/diy_zs.wxss */ |
2 | -.zwp_3{ margin-top: 10rpx} | |
3 | -.zs_goods{ | |
2 | + | |
3 | +.zwp_3 { | |
4 | + margin-top: 10rpx; | |
5 | +} | |
6 | + | |
7 | +.zs_goods { | |
4 | 8 | width: 700rpx; |
5 | 9 | border: 1rpx #ddd solid; |
6 | 10 | margin-bottom: 10rpx; |
7 | 11 | margin: 0 auto; |
8 | - | |
9 | 12 | } |
10 | -.s1_gk_a1{ | |
13 | + | |
14 | +.s1_gk_a1 { | |
11 | 15 | display: inline; |
12 | 16 | width: auto; |
13 | 17 | height: auto; |
14 | 18 | } |
15 | -.clear{ clear: both;} | |
16 | -.zs_top{ | |
19 | + | |
20 | +.clear { | |
21 | + clear: both; | |
22 | +} | |
23 | + | |
24 | +.zs_top { | |
17 | 25 | width: 100%; |
18 | 26 | min-height: 700rpx; |
19 | 27 | margin: 0 auto; |
20 | - margin-bottom:30rpx; | |
28 | + margin-bottom: 30rpx; | |
21 | 29 | display: flex; |
22 | 30 | } |
23 | 31 | |
... | ... | @@ -27,66 +35,62 @@ |
27 | 35 | margin: 1rpx auto; |
28 | 36 | } |
29 | 37 | |
30 | -.zs_center{ | |
31 | - width: 100%; | |
32 | - min-height: 200rpx; | |
33 | - font-size: 28rpx; | |
34 | - color: #333; | |
35 | - text-align: left; | |
36 | - margin-left: 25rpx; | |
37 | - padding: 0 10rpx; | |
38 | +.zs_center { | |
39 | + width: 100%; | |
40 | + min-height: 200rpx; | |
41 | + font-size: 28rpx; | |
42 | + color: #333; | |
43 | + text-align: left; | |
44 | + margin-left: 25rpx; | |
45 | + padding: 0 10rpx; | |
38 | 46 | } |
39 | 47 | |
40 | -.zs_wz1{ | |
48 | +.zs_wz1 { | |
41 | 49 | overflow: hidden; |
42 | - text-overflow: ellipsis; | |
43 | - margin-bottom:10rpx; | |
44 | - font-size:28rpx; | |
45 | - white-space: nowrap; | |
46 | - width: 640rpx | |
50 | + text-overflow: ellipsis; | |
51 | + margin-bottom: 10rpx; | |
52 | + font-size: 28rpx; | |
53 | + white-space: nowrap; | |
54 | + width: 640rpx; | |
47 | 55 | } |
48 | 56 | |
49 | - | |
50 | -.zs_wz2{ | |
57 | +.zs_wz2 { | |
51 | 58 | overflow: hidden; |
52 | - text-overflow: ellipsis; | |
53 | - margin-bottom:10rpx; | |
54 | -font-size:28rpx; | |
55 | - white-space: nowrap; | |
59 | + text-overflow: ellipsis; | |
60 | + margin-bottom: 10rpx; | |
61 | + font-size: 28rpx; | |
62 | + white-space: nowrap; | |
56 | 63 | } |
57 | 64 | |
58 | -.zs_wz3{ | |
65 | +.zs_wz3 { | |
59 | 66 | overflow: hidden; |
60 | - text-overflow: ellipsis; | |
61 | - margin-bottom:10rpx; | |
62 | -font-size:28rpx; | |
63 | - white-space: nowrap; | |
67 | + text-overflow: ellipsis; | |
68 | + margin-bottom: 10rpx; | |
69 | + font-size: 28rpx; | |
70 | + white-space: nowrap; | |
64 | 71 | } |
65 | 72 | |
66 | -.zs_wz4{ | |
73 | +.zs_wz4 { | |
67 | 74 | overflow: hidden; |
68 | - text-overflow: ellipsis; | |
69 | - margin-bottom:10rpx; | |
70 | -font-size:28rpx; | |
71 | - white-space: nowrap; | |
75 | + text-overflow: ellipsis; | |
76 | + margin-bottom: 10rpx; | |
77 | + font-size: 28rpx; | |
78 | + white-space: nowrap; | |
72 | 79 | } |
73 | 80 | |
74 | -.zs_wz5{ | |
81 | +.zs_wz5 { | |
75 | 82 | overflow: hidden; |
76 | - text-overflow: ellipsis; | |
77 | - font-size:30rpx; | |
78 | - white-space: nowrap; | |
83 | + text-overflow: ellipsis; | |
84 | + font-size: 30rpx; | |
85 | + white-space: nowrap; | |
79 | 86 | } |
80 | 87 | |
81 | -.wz_red{ | |
82 | - | |
83 | - color: #C4182E; | |
84 | - font-size: 32rpx; | |
88 | +.wz_red { | |
89 | + color: #c4182e; | |
90 | + font-size: 32rpx; | |
85 | 91 | } |
86 | 92 | |
87 | - | |
88 | - | |
89 | -.zs_t1{ | |
93 | +.zs_t1 { | |
90 | 94 | width: 56rpx; |
91 | 95 | height: 56rpx; |
92 | 96 | position: absolute; |
... | ... | @@ -94,8 +98,7 @@ font-size:28rpx; |
94 | 98 | top: 10rpx; |
95 | 99 | } |
96 | 100 | |
97 | - | |
98 | -.zs_t2{ | |
101 | +.zs_t2 { | |
99 | 102 | width: 56rpx; |
100 | 103 | height: 56rpx; |
101 | 104 | position: absolute; |
... | ... | @@ -103,7 +106,7 @@ font-size:28rpx; |
103 | 106 | top: 10rpx; |
104 | 107 | } |
105 | 108 | |
106 | -.zs_t3{ | |
109 | +.zs_t3 { | |
107 | 110 | width: 56rpx; |
108 | 111 | height: 56rpx; |
109 | 112 | position: absolute; |
... | ... | @@ -111,8 +114,7 @@ font-size:28rpx; |
111 | 114 | bottom: 10rpx; |
112 | 115 | } |
113 | 116 | |
114 | - | |
115 | -.zs_t4{ | |
117 | +.zs_t4 { | |
116 | 118 | width: 56rpx; |
117 | 119 | height: 56rpx; |
118 | 120 | position: absolute; |
... | ... | @@ -120,167 +122,157 @@ font-size:28rpx; |
120 | 122 | bottom: 10rpx; |
121 | 123 | } |
122 | 124 | |
123 | - | |
124 | - | |
125 | -.zs_goods_xiao_bottom{ | |
125 | +.zs_goods_xiao_bottom { | |
126 | 126 | width: 100%; |
127 | 127 | min-height: 300rpx; |
128 | - | |
129 | 128 | display: flex; |
130 | 129 | border-bottom: 2rpx #eee solid; |
131 | 130 | padding: 10rpx; |
132 | 131 | background-color: white; |
133 | - | |
134 | 132 | } |
135 | 133 | |
136 | -.zs_goods_xiao{ | |
134 | +.zs_goods_xiao { | |
137 | 135 | width: 100%; |
138 | 136 | min-height: 300rpx; |
139 | - | |
140 | 137 | display: flex; |
141 | 138 | /* border-bottom: 2rpx #eee solid; */ |
142 | 139 | padding: 10rpx; |
143 | 140 | background-color: white; |
144 | 141 | } |
145 | 142 | |
146 | -.zs_top_x{ | |
143 | +.zs_top_x { | |
147 | 144 | width: 400rpx; |
148 | 145 | height: 318rpx; |
149 | - margin-top: 20rpx; | |
146 | + margin-top: 20rpx; | |
150 | 147 | display: flex; |
151 | 148 | } |
152 | 149 | |
153 | 150 | .zs_t_img_x { |
154 | - width: 290rpx; | |
151 | + width: 290rpx; | |
155 | 152 | height: 290rpx; |
156 | 153 | margin-left: 20rpx; |
157 | - | |
158 | 154 | } |
159 | 155 | |
160 | -.zs_center_x{ | |
161 | - | |
156 | +.zs_center_x { | |
162 | 157 | width: 100%; |
163 | 158 | min-height: 200rpx; |
164 | 159 | font-size: 28rpx; |
165 | 160 | color: #333; |
166 | 161 | text-align: left; |
167 | 162 | margin-top: 30rpx; |
168 | - padding: 0 10rpx; | |
163 | + padding: 0 10rpx; | |
169 | 164 | } |
170 | 165 | |
171 | -.zs_wz1_x{ | |
166 | +.zs_wz1_x { | |
172 | 167 | overflow: hidden; |
173 | - text-overflow: ellipsis; | |
174 | - margin-bottom:10rpx; | |
175 | -font-size:28rpx; | |
176 | - white-space: nowrap; | |
177 | - width: 80%; | |
168 | + text-overflow: ellipsis; | |
169 | + margin-bottom: 10rpx; | |
170 | + font-size: 28rpx; | |
171 | + white-space: nowrap; | |
172 | + width: 80%; | |
178 | 173 | } |
179 | 174 | |
180 | - | |
181 | -.zs_wz2_x{ | |
175 | +.zs_wz2_x { | |
182 | 176 | overflow: hidden; |
183 | - text-overflow: ellipsis; | |
184 | - margin-bottom:10rpx; | |
185 | -font-size:28rpx; | |
186 | - white-space: nowrap; | |
177 | + text-overflow: ellipsis; | |
178 | + margin-bottom: 10rpx; | |
179 | + font-size: 28rpx; | |
180 | + white-space: nowrap; | |
187 | 181 | } |
188 | 182 | |
189 | -.zs_wz3_x{ | |
183 | +.zs_wz3_x { | |
190 | 184 | overflow: hidden; |
191 | - text-overflow: ellipsis; | |
192 | - margin-bottom:10rpx; | |
193 | -font-size:28rpx; | |
194 | - white-space: nowrap; | |
185 | + text-overflow: ellipsis; | |
186 | + margin-bottom: 10rpx; | |
187 | + font-size: 28rpx; | |
188 | + white-space: nowrap; | |
195 | 189 | } |
196 | 190 | |
197 | -.zs_wz4_x{ | |
191 | +.zs_wz4_x { | |
198 | 192 | overflow: hidden; |
199 | - text-overflow: ellipsis; | |
200 | - margin-bottom:10rpx; | |
201 | -font-size:28rpx; | |
202 | - white-space: nowrap; | |
193 | + text-overflow: ellipsis; | |
194 | + margin-bottom: 10rpx; | |
195 | + font-size: 28rpx; | |
196 | + white-space: nowrap; | |
203 | 197 | } |
204 | 198 | |
205 | -.zs_wz5_x{ | |
199 | +.zs_wz5_x { | |
206 | 200 | overflow: hidden; |
207 | - text-overflow: ellipsis; | |
208 | - font-size:30rpx; | |
209 | - white-space: nowrap; | |
201 | + text-overflow: ellipsis; | |
202 | + font-size: 30rpx; | |
203 | + white-space: nowrap; | |
210 | 204 | } |
211 | 205 | |
212 | -.wz_red{ | |
213 | - color: #C4182E; | |
214 | - font-size: 32rpx; | |
206 | +.wz_red { | |
207 | + color: #c4182e; | |
208 | + font-size: 32rpx; | |
215 | 209 | } |
216 | 210 | |
217 | -.del{ | |
218 | - font-size: 24rpx; | |
219 | - color: #999; | |
220 | - text-decoration: line-through; | |
221 | - margin-top: 8rpx; | |
211 | +.del { | |
212 | + font-size: 24rpx; | |
213 | + color: #999; | |
214 | + text-decoration: line-through; | |
215 | + margin-top: 8rpx; | |
222 | 216 | } |
223 | 217 | |
224 | -.zs_t1_x{ | |
218 | +.zs_t1_x { | |
225 | 219 | width: 56rpx; |
226 | 220 | height: 56rpx; |
227 | 221 | position: relative; |
228 | 222 | right: 62rpx; |
229 | -top: 6rpx; | |
223 | + top: 6rpx; | |
230 | 224 | } |
231 | 225 | |
232 | -.zs_t1_x1{ | |
233 | - width: 56rpx; | |
226 | +.zs_t1_x1 { | |
227 | + width: 56rpx; | |
234 | 228 | height: 56rpx; |
235 | 229 | position: relative; |
236 | 230 | right: 285rpx; |
237 | -top: 6rpx; | |
231 | + top: 6rpx; | |
238 | 232 | } |
239 | 233 | |
240 | -.zs_t1_x2{ | |
241 | - width: 56rpx; | |
234 | +.zs_t1_x2 { | |
235 | + width: 56rpx; | |
242 | 236 | height: 56rpx; |
243 | 237 | position: relative; |
244 | 238 | right: 56rpx; |
245 | -top: 234rpx; | |
239 | + top: 234rpx; | |
246 | 240 | } |
247 | 241 | |
248 | - | |
249 | -.zs_t1_x3{ | |
250 | - width: 56rpx; | |
242 | +.zs_t1_x3 { | |
243 | + width: 56rpx; | |
251 | 244 | height: 56rpx; |
252 | 245 | position: relative; |
253 | 246 | right: 288rpx; |
254 | -top: 234rpx; | |
247 | + top: 234rpx; | |
255 | 248 | } |
256 | 249 | |
257 | 250 | /*1列2个*/ |
258 | 251 | |
259 | -.zs_goods_ban{ | |
252 | +.zs_goods_ban { | |
260 | 253 | width: 100%; |
261 | 254 | min-height: 300rpx; |
262 | 255 | } |
263 | 256 | |
264 | -.zs_goods_wai_ban{ | |
257 | +.zs_goods_wai_ban { | |
265 | 258 | display: flex; |
266 | 259 | /* padding-left: 2rpx; */ |
267 | 260 | margin-bottom: 12rpx; |
268 | 261 | width: 48.5%; |
269 | 262 | float: left; |
270 | 263 | background: #fff; |
271 | - margin-left: 1% | |
264 | + margin-left: 1%; | |
272 | 265 | } |
273 | 266 | |
274 | - | |
275 | -.zs_goods_2l{ | |
267 | +.zs_goods_2l { | |
276 | 268 | width: 94%; |
277 | 269 | min-height: 300rpx; |
278 | 270 | /* border: 2rpx #ddd solid; */ |
279 | 271 | margin: 0 auto; |
280 | - padding: 2rpx; | |
272 | + padding: 2rpx; | |
281 | 273 | } |
282 | 274 | |
283 | -.zs_top_2l{ | |
275 | +.zs_top_2l { | |
284 | 276 | width: 340rpx; |
285 | 277 | height: 340rpx; |
286 | 278 | } |
... | ... | @@ -290,73 +282,70 @@ top: 234rpx; |
290 | 282 | border: none; |
291 | 283 | } |
292 | 284 | |
293 | - | |
294 | 285 | .zs_t_img_2l { |
295 | 286 | width: 100%; |
296 | 287 | height: 100%; |
297 | 288 | margin: 0 auto; |
298 | 289 | } |
299 | 290 | |
300 | -.zs_center_2l{ | |
291 | +.zs_center_2l { | |
301 | 292 | width: 100%; |
302 | 293 | min-height: 200rpx; |
303 | 294 | font-size: 28rpx; |
304 | 295 | color: #333; |
305 | 296 | text-align: left; |
306 | - padding: 0 10rpx; | |
297 | + padding: 0 10rpx; | |
307 | 298 | } |
308 | 299 | |
309 | -.zs_wz1_2l{ | |
300 | +.zs_wz1_2l { | |
310 | 301 | overflow: hidden; |
311 | 302 | text-overflow: ellipsis; |
312 | - margin-bottom:10rpx; | |
313 | - font-size:30rpx; | |
303 | + margin-bottom: 10rpx; | |
304 | + font-size: 30rpx; | |
314 | 305 | white-space: nowrap; |
315 | 306 | margin-top: 10rpx; |
316 | 307 | } |
317 | 308 | |
318 | - | |
319 | -.zs_wz2_2l{ | |
309 | +.zs_wz2_2l { | |
320 | 310 | overflow: hidden; |
321 | 311 | text-overflow: ellipsis; |
322 | - margin-bottom:10rpx; | |
323 | - font-size:30rpx; | |
312 | + margin-bottom: 10rpx; | |
313 | + font-size: 30rpx; | |
324 | 314 | white-space: nowrap; |
325 | 315 | margin-top: 10rpx; |
326 | 316 | height: 80rpx; |
327 | - line-height: 40rpx | |
317 | + line-height: 40rpx; | |
328 | 318 | } |
329 | 319 | |
330 | -.zs_wz3_2l{ | |
320 | +.zs_wz3_2l { | |
331 | 321 | overflow: hidden; |
332 | 322 | text-overflow: ellipsis; |
333 | - margin-bottom:10rpx; | |
334 | - font-size:30rpx; | |
323 | + margin-bottom: 10rpx; | |
324 | + font-size: 30rpx; | |
335 | 325 | white-space: nowrap; |
336 | 326 | margin-top: 10rpx; |
337 | 327 | } |
338 | 328 | |
339 | -.zs_wz4_2l{ | |
329 | +.zs_wz4_2l { | |
340 | 330 | overflow: hidden; |
341 | 331 | text-overflow: ellipsis; |
342 | - margin-bottom:10rpx; | |
343 | - font-size:30rpx; | |
332 | + margin-bottom: 10rpx; | |
333 | + font-size: 30rpx; | |
344 | 334 | white-space: nowrap; |
345 | 335 | margin-top: 10rpx; |
346 | 336 | } |
347 | 337 | |
348 | -.zs_wz5_2l{ | |
338 | +.zs_wz5_2l { | |
349 | 339 | overflow: hidden; |
350 | 340 | text-overflow: ellipsis; |
351 | - font-size:30rpx; | |
341 | + font-size: 30rpx; | |
352 | 342 | white-space: nowrap; |
353 | 343 | margin-top: 10rpx; |
354 | 344 | } |
355 | 345 | |
356 | - | |
357 | - | |
358 | 346 | /*---俩列图片位置---*/ |
359 | -.zs_t1_2l{ | |
347 | + | |
348 | +.zs_t1_2l { | |
360 | 349 | width: 56rpx; |
361 | 350 | height: 56rpx; |
362 | 351 | position: absolute; |
... | ... | @@ -364,7 +353,7 @@ top: 234rpx; |
364 | 353 | top: 10rpx; |
365 | 354 | } |
366 | 355 | |
367 | -.zs_t2_2l{ | |
356 | +.zs_t2_2l { | |
368 | 357 | width: 56rpx; |
369 | 358 | height: 56rpx; |
370 | 359 | position: absolute; |
... | ... | @@ -372,16 +361,15 @@ top: 234rpx; |
372 | 361 | top: 10rpx; |
373 | 362 | } |
374 | 363 | |
375 | -.zs_t3_2l{ | |
364 | +.zs_t3_2l { | |
376 | 365 | width: 56rpx; |
377 | 366 | height: 56rpx; |
378 | 367 | position: absolute; |
379 | - left: 0rpx; | |
368 | + left: 0rpx; | |
380 | 369 | bottom: 10rpx; |
381 | 370 | } |
382 | 371 | |
383 | - | |
384 | -.zs_t4_2l{ | |
372 | +.zs_t4_2l { | |
385 | 373 | width: 56rpx; |
386 | 374 | height: 56rpx; |
387 | 375 | position: absolute; |
... | ... | @@ -389,23 +377,22 @@ top: 234rpx; |
389 | 377 | bottom: 10rpx; |
390 | 378 | } |
391 | 379 | |
392 | - | |
393 | - | |
394 | 380 | /*一个3列*/ |
395 | -.zs_goods_wai_san{ | |
381 | + | |
382 | +.zs_goods_wai_san { | |
396 | 383 | width: 230rpx; |
397 | 384 | display: flex; |
398 | 385 | margin-left: 10rpx; |
399 | 386 | float: left; |
400 | 387 | margin-bottom: 8rpx; |
401 | - background-color:white; | |
388 | + background-color: white; | |
402 | 389 | } |
403 | 390 | |
404 | -.zs_goods_san{ | |
391 | +.zs_goods_san { | |
405 | 392 | width: 240rpx; |
406 | - | |
407 | 393 | } |
408 | -.zs_goods_3l{ | |
394 | + | |
395 | +.zs_goods_3l { | |
409 | 396 | width: 240rpx; |
410 | 397 | min-height: 300rpx; |
411 | 398 | border: 2rpx #ddd solid; |
... | ... | @@ -413,19 +400,19 @@ top: 234rpx; |
413 | 400 | padding: 2rpx; |
414 | 401 | } |
415 | 402 | |
416 | -.zs_top_3l{ | |
403 | +.zs_top_3l { | |
417 | 404 | width: 232rpx; |
418 | - height: 232rpx; | |
405 | + height: 232rpx; | |
419 | 406 | } |
420 | 407 | |
421 | 408 | .zs_t_img_3l { |
422 | - width:232rpx; | |
409 | + width: 232rpx; | |
423 | 410 | height: 232rpx; |
424 | 411 | margin: 0 auto; |
425 | 412 | background-color: bisque; |
426 | 413 | } |
427 | 414 | |
428 | -.zs_center_3l{ | |
415 | +.zs_center_3l { | |
429 | 416 | width: 100%; |
430 | 417 | min-height: 200rpx; |
431 | 418 | font-size: 28rpx; |
... | ... | @@ -434,52 +421,48 @@ top: 234rpx; |
434 | 421 | padding: 0 10rpx; |
435 | 422 | } |
436 | 423 | |
437 | -.zs_wz1_3l{ | |
438 | - | |
439 | - margin-bottom:10rpx; | |
440 | - font-size:30rpx; | |
424 | +.zs_wz1_3l { | |
425 | + margin-bottom: 10rpx; | |
426 | + font-size: 30rpx; | |
441 | 427 | height: 80rpx; |
442 | 428 | width: 220rpx; |
443 | - | |
444 | - overflow: hidden; | |
445 | - text-overflow: ellipsis; | |
446 | - display: -webkit-box; | |
447 | - -webkit-box-orient: vertical; | |
448 | - -webkit-line-clamp: 2; | |
429 | + overflow: hidden; | |
430 | + text-overflow: ellipsis; | |
431 | + display: -webkit-box; | |
432 | + -webkit-box-orient: vertical; | |
433 | + -webkit-line-clamp: 2; | |
449 | 434 | } |
450 | 435 | |
451 | - | |
452 | -.zs_wz2_3l{ | |
453 | - margin-bottom:10rpx; | |
454 | - font-size:30rpx; | |
436 | +.zs_wz2_3l { | |
437 | + margin-bottom: 10rpx; | |
438 | + font-size: 30rpx; | |
455 | 439 | display: flex; |
456 | 440 | } |
457 | 441 | |
458 | -.zs_wz3_3l{ | |
442 | +.zs_wz3_3l { | |
459 | 443 | overflow: hidden; |
460 | 444 | text-overflow: ellipsis; |
461 | - margin-bottom:10rpx; | |
462 | - font-size:30rpx; | |
445 | + margin-bottom: 10rpx; | |
446 | + font-size: 30rpx; | |
463 | 447 | white-space: nowrap; |
464 | 448 | } |
465 | 449 | |
466 | -.zs_wz4_3l{ | |
450 | +.zs_wz4_3l { | |
467 | 451 | overflow: hidden; |
468 | 452 | text-overflow: ellipsis; |
469 | - margin-bottom:10rpx; | |
470 | - font-size:30rpx; | |
453 | + margin-bottom: 10rpx; | |
454 | + font-size: 30rpx; | |
471 | 455 | white-space: nowrap; |
472 | 456 | } |
473 | 457 | |
474 | -.zs_wz5_3l{ | |
458 | +.zs_wz5_3l { | |
475 | 459 | overflow: hidden; |
476 | 460 | text-overflow: ellipsis; |
477 | - font-size:30rpx; | |
478 | - white-space: nowrap; | |
461 | + font-size: 30rpx; | |
462 | + white-space: nowrap; | |
479 | 463 | } |
480 | 464 | |
481 | - | |
482 | -.zs_t1_3l{ | |
465 | +.zs_t1_3l { | |
483 | 466 | width: 56rpx; |
484 | 467 | height: 56rpx; |
485 | 468 | position: absolute; |
... | ... | @@ -487,8 +470,7 @@ top: 234rpx; |
487 | 470 | top: 10rpx; |
488 | 471 | } |
489 | 472 | |
490 | - | |
491 | -.zs_t2_3l{ | |
473 | +.zs_t2_3l { | |
492 | 474 | width: 56rpx; |
493 | 475 | height: 56rpx; |
494 | 476 | position: absolute; |
... | ... | @@ -496,7 +478,7 @@ top: 234rpx; |
496 | 478 | top: 10rpx; |
497 | 479 | } |
498 | 480 | |
499 | -.zs_t3_3l{ | |
481 | +.zs_t3_3l { | |
500 | 482 | width: 56rpx; |
501 | 483 | height: 56rpx; |
502 | 484 | position: absolute; |
... | ... | @@ -504,8 +486,7 @@ top: 234rpx; |
504 | 486 | bottom: 10rpx; |
505 | 487 | } |
506 | 488 | |
507 | - | |
508 | -.zs_t4_3l{ | |
489 | +.zs_t4_3l { | |
509 | 490 | width: 56rpx; |
510 | 491 | height: 56rpx; |
511 | 492 | position: absolute; |
... | ... | @@ -513,27 +494,67 @@ top: 234rpx; |
513 | 494 | bottom: 10rpx; |
514 | 495 | } |
515 | 496 | |
516 | -.zs_goods_wai{ | |
497 | +.zs_goods_wai { | |
517 | 498 | background-color: white; |
518 | 499 | margin-top: 10rpx; |
519 | 500 | } |
520 | 501 | |
521 | -.rel{position: relative} | |
522 | -.flex{display: flex} | |
523 | -.fs24{font-size: 24rpx} | |
524 | -.fs35{font-size: 35rpx} | |
525 | -.xc-wc{ align-items: center; margin-top: -3rpx} | |
502 | +.rel { | |
503 | + position: relative; | |
504 | +} | |
505 | + | |
506 | +.flex { | |
507 | + display: flex; | |
508 | +} | |
509 | + | |
510 | +.fs24 { | |
511 | + font-size: 24rpx; | |
512 | +} | |
513 | + | |
514 | +.fs35 { | |
515 | + font-size: 35rpx; | |
516 | +} | |
517 | + | |
518 | +.xc-wc { | |
519 | + align-items: center; | |
520 | + margin-top: -3rpx; | |
521 | +} | |
526 | 522 | |
527 | -.price.xc-ash{ | |
523 | +.price.xc-ash { | |
528 | 524 | font-size: 24rpx; |
529 | 525 | color: #999; |
530 | 526 | text-decoration: line-through; |
531 | 527 | margin-top: 8rpx; |
532 | 528 | } |
533 | 529 | |
530 | +.line_th { | |
531 | + text-decoration: line-through; | |
532 | +} | |
534 | 533 | |
535 | -.line_th{ text-decoration: line-through} | |
536 | -.card_bg {display: flex; padding: 2rpx 10rpx;height: 28rpx; align-items: center; border-radius: 26rpx; font-size: 19rpx;line-height: 28rpx;max-width: 110rpx; | |
537 | - background: #333; color: #fff; justify-content: center; margin-left: 2rpx;} | |
538 | -.card_bg image{ width: 19rpx; height: 19rpx; margin-right: 1rpx;} | |
539 | -.card_bg .card_name{ max-width: 76rpx; width: auto;overflow: hidden; white-space:nowrap; } | |
540 | 534 | \ No newline at end of file |
535 | +.card_bg { | |
536 | + display: flex; | |
537 | + padding: 2rpx 10rpx; | |
538 | + height: 25rpx; | |
539 | + align-items: center; | |
540 | + border-radius: 26rpx; | |
541 | + font-size: 19rpx; | |
542 | + line-height: 25rpx; | |
543 | + max-width: 110rpx; | |
544 | + background: #333; | |
545 | + color: #fff; | |
546 | + justify-content: center; | |
547 | + margin-left: 8rpx; | |
548 | +} | |
549 | + | |
550 | +.card_bg image { | |
551 | + width: 19rpx; | |
552 | + height: 19rpx; | |
553 | + margin-right: 1rpx; | |
554 | +} | |
555 | + | |
556 | +.card_bg .card_name { | |
557 | + max-width: 76rpx; | |
558 | + width: auto; | |
559 | + overflow: hidden; | |
560 | + white-space: nowrap; | |
561 | +} | ... | ... |
components/goods_list/goods_list.wxml
... | ... | @@ -37,7 +37,7 @@ |
37 | 37 | <block wx:if="{{item[card_field]>0}}"> |
38 | 38 | <view class="money flex"> |
39 | 39 | <!-- 办卡价 --> |
40 | - <view class="flex xc-wc"> | |
40 | + <view class="flex xc-wc ai_and"> | |
41 | 41 | <view class="fs24">¥</view> |
42 | 42 | <view class="fs35">{{filter.toFix(item[card_field],2)}}</view> |
43 | 43 | <view class="card_bg"> |
... | ... | @@ -88,7 +88,7 @@ |
88 | 88 | </view> |
89 | 89 | <view class="flex" style="line-height: 28rpx;"> |
90 | 90 | <!-- 等级价 --> |
91 | - <view class="price flex"> | |
91 | + <view class="price flex ai_and"> | |
92 | 92 | <view class="fs22">¥</view> |
93 | 93 | <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view> |
94 | 94 | <view class="card_bg"> | ... | ... |
components/goods_list/goods_list.wxss
1 | 1 | .collects { |
2 | 2 | margin-top: 40rpx; |
3 | 3 | } |
4 | -.ib{ | |
5 | - display: inline-block; | |
6 | -} | |
7 | -.fs20{ | |
8 | - font-size: 20rpx; | |
9 | -} | |
10 | -.fs22{ | |
11 | - font-size: 22rpx; | |
12 | -} | |
13 | -.fs24{ | |
14 | - font-size: 24rpx; | |
15 | -} | |
16 | -.fs26{ | |
17 | - font-size: 26rpx; | |
4 | + | |
5 | +.ib { | |
6 | + display: inline-block; | |
18 | 7 | } |
19 | -.fs28{ | |
20 | - font-size: 28rpx; | |
8 | + | |
9 | +.fs20 { | |
10 | + font-size: 20rpx; | |
21 | 11 | } |
22 | -.fs35{ | |
23 | - font-size:35rpx; | |
12 | + | |
13 | +.fs22 { | |
14 | + font-size: 22rpx; | |
24 | 15 | } |
25 | 16 | |
17 | +.fs24 { | |
18 | + font-size: 24rpx; | |
19 | +} | |
26 | 20 | |
21 | +.fs26 { | |
22 | + font-size: 26rpx; | |
23 | +} | |
27 | 24 | |
28 | -.flex-center{ | |
29 | -display:flex; | |
30 | -justify-content:center; | |
31 | -align-items:center; | |
25 | +.fs28 { | |
26 | + font-size: 28rpx; | |
32 | 27 | } |
33 | -.xc-wc{ | |
34 | - color: #d60021; | |
35 | 28 | |
29 | +.fs35 { | |
30 | + font-size: 35rpx; | |
36 | 31 | } |
37 | 32 | |
33 | +.flex-center { | |
34 | + display: flex; | |
35 | + justify-content: center; | |
36 | + align-items: center; | |
37 | +} | |
38 | 38 | |
39 | +.xc-wc { | |
40 | + color: #d60021; | |
41 | +} | |
39 | 42 | |
40 | -.xc-ash{ | |
41 | -color: #b9b9b9; | |
43 | +.xc-ash { | |
44 | + color: #b9b9b9; | |
42 | 45 | } |
46 | + | |
43 | 47 | .choice_box .choice_list .choice_footer .price { |
44 | - color: #f23030; height: 10px | |
48 | + color: #f23030; | |
49 | + height: 10px; | |
50 | +} | |
51 | + | |
52 | +.flex { | |
53 | + display: flex; | |
45 | 54 | } |
46 | 55 | |
47 | -.flex{display: flex} | |
48 | 56 | .ellipsis-2 { |
49 | - overflow: hidden; | |
50 | - text-overflow: ellipsis; | |
51 | - display: -webkit-box; | |
52 | - -webkit-box-orient: vertical; | |
53 | - -webkit-line-clamp: 2; | |
54 | -} | |
55 | -.goods_name{ | |
56 | - height: 62rpx; | |
57 | + overflow: hidden; | |
58 | + text-overflow: ellipsis; | |
59 | + display: -webkit-box; | |
60 | + -webkit-box-orient: vertical; | |
61 | + -webkit-line-clamp: 2; | |
62 | +} | |
63 | + | |
64 | +.goods_name { | |
65 | + height: 62rpx; | |
57 | 66 | margin-top: 6rpx; |
58 | 67 | line-height: 30rpx; |
59 | - | |
60 | - | |
61 | 68 | } |
69 | + | |
62 | 70 | .hang { |
63 | 71 | width: 100%; |
64 | 72 | margin: auto; |
65 | 73 | padding-left: 21rpx; |
66 | 74 | } |
67 | 75 | |
68 | - | |
69 | 76 | .hang .collect { |
70 | 77 | width: 347rpx; |
71 | 78 | height: 520rpx; |
... | ... | @@ -91,15 +98,19 @@ color: #b9b9b9; |
91 | 98 | line-height: 28rpx; |
92 | 99 | align-items: baseline; |
93 | 100 | } |
94 | -.collect .money view{ | |
101 | + | |
102 | +.collect .money view { | |
95 | 103 | line-height: 28rpx; |
96 | 104 | } |
105 | + | |
97 | 106 | .collect .money .flex { |
98 | - font-weight: bold; | |
107 | + font-weight: bold; | |
99 | 108 | } |
100 | -.collect .money .flex .fs24{ | |
109 | + | |
110 | +.collect .money .flex .fs24 { | |
101 | 111 | padding-top: 5rpx; |
102 | 112 | } |
113 | + | |
103 | 114 | .collect .Discount { |
104 | 115 | width: 156rpx; |
105 | 116 | height: 28rpx; |
... | ... | @@ -150,12 +161,34 @@ color: #b9b9b9; |
150 | 161 | background-color: rgb(138, 138, 138); |
151 | 162 | } |
152 | 163 | |
153 | -.line_th{ text-decoration: line-through} | |
154 | -.card_bg {display: flex; padding: 2rpx 10rpx;height: 28rpx; align-items: center; border-radius: 26rpx; font-size: 19rpx;line-height: 28rpx;max-width: 110rpx; | |
155 | -background: #333; color: #fff; justify-content: center; margin-left: 2rpx;} | |
156 | -.card_bg image{ width: 19rpx; height: 19rpx; margin-right: 1rpx;}.card_bg .card_name{ | |
157 | - max-width: 76rpx; | |
158 | - width: auto; | |
159 | - overflow: hidden; | |
160 | - white-space:nowrap; | |
161 | -} | |
162 | 164 | \ No newline at end of file |
165 | +.line_th { | |
166 | + text-decoration: line-through; | |
167 | +} | |
168 | + | |
169 | +.card_bg { | |
170 | + display: flex; | |
171 | + padding: 2rpx 10rpx; | |
172 | + height: 25rpx; | |
173 | + align-items: center; | |
174 | + border-radius: 26rpx; | |
175 | + font-size: 19rpx; | |
176 | + line-height: 25rpx; | |
177 | + max-width: 110rpx; | |
178 | + background: #333; | |
179 | + color: #fff; | |
180 | + justify-content: center; | |
181 | + margin-left: 8rpx; | |
182 | +} | |
183 | + | |
184 | +.card_bg image { | |
185 | + width: 19rpx; | |
186 | + height: 19rpx; | |
187 | + margin-right: 1rpx; | |
188 | +} | |
189 | + | |
190 | +.card_bg .card_name { | |
191 | + max-width: 76rpx; | |
192 | + width: auto; | |
193 | + overflow: hidden; | |
194 | + white-space: nowrap; | |
195 | +} | ... | ... |
pages/goods/goodsList/goodsList.wxml
... | ... | @@ -53,7 +53,7 @@ |
53 | 53 | <block wx:if="{{card_field}}"> |
54 | 54 | <!-- 等级价>0 --> |
55 | 55 | <block wx:if="{{item[card_field]>0}}"> |
56 | - <view class="flex ai-center"> | |
56 | + <view class="flex ai_and"> | |
57 | 57 | <view class="price">¥{{item[card_field]}}</view> |
58 | 58 | <view class="card_bg"> |
59 | 59 | <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image> |
... | ... | @@ -80,7 +80,7 @@ |
80 | 80 | <view class="word-line xc-ash mk_price">¥{{item.market_price}}</view> |
81 | 81 | </view> |
82 | 82 | <view class="comment flex jc_sb"> |
83 | - <view class="flex"> | |
83 | + <view class="flex ai_and"> | |
84 | 84 | <view class="">¥{{g_filter.get_card_price(item,card_list,0)}}</view> |
85 | 85 | <view class="card_bg"> |
86 | 86 | <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image> | ... | ... |
pages/goods/goodsList/goodsList.wxss
1 | - .container { | |
2 | - color: #666; | |
1 | +.container { | |
2 | + color: #666; | |
3 | 3 | } |
4 | 4 | |
5 | 5 | .nav-item { |
6 | - float: left; | |
7 | - width: 30%; | |
8 | - height: 90rpx; | |
9 | - line-height: 90rpx; | |
10 | - display: flex; | |
11 | - align-items: center; | |
12 | - justify-content: center; | |
13 | - font-size: 32rpx; | |
14 | - border-bottom: 1px solid #dfefef; | |
15 | - background-color: #fff; | |
6 | + float: left; | |
7 | + width: 30%; | |
8 | + height: 90rpx; | |
9 | + line-height: 90rpx; | |
10 | + display: flex; | |
11 | + align-items: center; | |
12 | + justify-content: center; | |
13 | + font-size: 32rpx; | |
14 | + border-bottom: 1px solid #dfefef; | |
15 | + background-color: #fff; | |
16 | 16 | } |
17 | 17 | |
18 | 18 | .nav-item .ico-dg { |
19 | - width: 18rpx; | |
20 | - height: 12rpx; | |
21 | - margin-left: 10rpx; | |
22 | - line-height: 0; | |
19 | + width: 18rpx; | |
20 | + height: 12rpx; | |
21 | + margin-left: 10rpx; | |
22 | + line-height: 0; | |
23 | 23 | } |
24 | 24 | |
25 | 25 | .nav-item .ico-filter { |
26 | - width: 20rpx; | |
27 | - height: 20rpx; | |
28 | - margin-left: 10rpx; | |
29 | - line-height: 0; | |
26 | + width: 20rpx; | |
27 | + height: 20rpx; | |
28 | + margin-left: 10rpx; | |
29 | + line-height: 0; | |
30 | 30 | } |
31 | 31 | |
32 | 32 | .ico-dir { |
33 | - width: 16rpx; | |
34 | - height: 22rpx; | |
35 | - margin-left: 10rpx; | |
36 | - background-repeat: no-repeat; | |
37 | - background-size: cover; | |
38 | - background-position-x: 0; | |
33 | + width: 16rpx; | |
34 | + height: 22rpx; | |
35 | + margin-left: 10rpx; | |
36 | + background-repeat: no-repeat; | |
37 | + background-size: cover; | |
38 | + background-position-x: 0; | |
39 | 39 | } |
40 | 40 | |
41 | 41 | .ico-dir-dn { |
42 | - background-position-x: -16rpx; | |
42 | + background-position-x: -16rpx; | |
43 | 43 | } |
44 | 44 | |
45 | 45 | .ico-dir-up { |
46 | - background-position-x: -32rpx; | |
46 | + background-position-x: -32rpx; | |
47 | 47 | } |
48 | 48 | |
49 | 49 | .search { |
50 | - width: 10%; | |
50 | + width: 10%; | |
51 | 51 | } |
52 | 52 | |
53 | 53 | .search-img { |
54 | - width: 30rpx; | |
55 | - height: 30rpx; | |
54 | + width: 30rpx; | |
55 | + height: 30rpx; | |
56 | 56 | } |
57 | 57 | |
58 | 58 | .choice_list { |
59 | - background-color: #fff; | |
59 | + background-color: #fff; | |
60 | 60 | } |
61 | 61 | |
62 | 62 | .choice_item { |
63 | - position: relative; | |
64 | - width: 100%; | |
65 | - min-height: 200rpx; | |
66 | - padding: 10rpx 0; | |
67 | - border-bottom: 1px solid #dfefef; | |
68 | - font-size: 30rpx; | |
63 | + position: relative; | |
64 | + width: 100%; | |
65 | + min-height: 200rpx; | |
66 | + padding: 10rpx 0; | |
67 | + border-bottom: 1px solid #dfefef; | |
68 | + font-size: 30rpx; | |
69 | 69 | } |
70 | 70 | |
71 | 71 | .img-wrap { |
72 | - float: left; | |
73 | - width: 180rpx; | |
74 | - height: 180rpx; | |
75 | - padding: 0 10rpx 10rpx; | |
72 | + float: left; | |
73 | + width: 180rpx; | |
74 | + height: 180rpx; | |
75 | + padding: 0 10rpx 10rpx; | |
76 | 76 | } |
77 | 77 | |
78 | 78 | .img-wrap image { |
79 | - width: 100%; | |
80 | - height: 100%; | |
79 | + width: 100%; | |
80 | + height: 100%; | |
81 | 81 | } |
82 | 82 | |
83 | 83 | .item-cont .title { |
84 | - height: 72rpx; | |
85 | - margin: 16rpx 0; | |
86 | - padding-right: 10rpx; | |
87 | - line-height: 36rpx; | |
88 | - color: #333; | |
89 | - overflow: hidden; | |
84 | + height: 72rpx; | |
85 | + margin: 16rpx 0; | |
86 | + padding-right: 10rpx; | |
87 | + line-height: 36rpx; | |
88 | + color: #333; | |
89 | + overflow: hidden; | |
90 | 90 | } |
91 | 91 | |
92 | 92 | .price { |
93 | - display: inline-block; | |
94 | - color: #f23030; | |
95 | - line-height: 24rpx; | |
96 | - /* padding-bottom: 20rpx; */ | |
93 | + display: inline-block; | |
94 | + color: #f23030; | |
95 | + line-height: 24rpx; | |
96 | + /* padding-bottom: 20rpx; */ | |
97 | 97 | } |
98 | 98 | |
99 | 99 | .comment { |
100 | - font-size: 25rpx; | |
101 | - margin-top: 4rpx; | |
102 | - padding-right:30rpx | |
100 | + font-size: 25rpx; | |
101 | + margin-top: 4rpx; | |
102 | + padding-right: 30rpx; | |
103 | 103 | } |
104 | 104 | |
105 | 105 | .filter-modal { |
106 | - position: fixed; | |
107 | - left: 150rpx; | |
108 | - top: 0; | |
109 | - right: 0; | |
110 | - bottom: 0; | |
111 | - z-index: 20; | |
112 | - background-color: white; | |
113 | - overflow-x: hidden; | |
114 | - padding-bottom: 30rpx; | |
106 | + position: fixed; | |
107 | + left: 150rpx; | |
108 | + top: 0; | |
109 | + right: 0; | |
110 | + bottom: 0; | |
111 | + z-index: 20; | |
112 | + background-color: white; | |
113 | + overflow-x: hidden; | |
114 | + padding-bottom: 30rpx; | |
115 | 115 | } |
116 | 116 | |
117 | 117 | .filter-box { |
118 | - box-sizing: border-box; | |
119 | - width: 100%; | |
120 | - font-size: 28rpx; | |
121 | - padding: 20rpx; | |
118 | + box-sizing: border-box; | |
119 | + width: 100%; | |
120 | + font-size: 28rpx; | |
121 | + padding: 20rpx; | |
122 | 122 | } |
123 | 123 | |
124 | 124 | .filter-name { |
125 | - width: 100%; | |
126 | - padding: 20rpx 0; | |
127 | - word-break: keep-all; | |
128 | - white-space: nowrap; | |
129 | - text-overflow: ellipsis; | |
130 | - overflow: hidden; | |
131 | - font-size: 30rpx; | |
125 | + width: 100%; | |
126 | + padding: 20rpx 0; | |
127 | + word-break: keep-all; | |
128 | + white-space: nowrap; | |
129 | + text-overflow: ellipsis; | |
130 | + overflow: hidden; | |
131 | + font-size: 30rpx; | |
132 | 132 | } |
133 | 133 | |
134 | 134 | .filter-items { |
135 | - width: 100%; | |
135 | + width: 100%; | |
136 | 136 | } |
137 | 137 | |
138 | 138 | .filter-item { |
139 | - float: left; | |
140 | - width: fit-content; | |
141 | - max-width: 500rpx; | |
142 | - word-break: keep-all; | |
143 | - white-space: nowrap; | |
144 | - text-overflow: ellipsis; | |
145 | - overflow: hidden; | |
146 | - padding: 10rpx; | |
147 | - border-radius: 10rpx; | |
148 | - border: 1rpx #ddd solid; | |
149 | - margin: 0 10rpx 10rpx 0; | |
150 | - background-color: #fdfdfd; | |
151 | - color: #666; | |
139 | + float: left; | |
140 | + width: fit-content; | |
141 | + max-width: 500rpx; | |
142 | + word-break: keep-all; | |
143 | + white-space: nowrap; | |
144 | + text-overflow: ellipsis; | |
145 | + overflow: hidden; | |
146 | + padding: 10rpx; | |
147 | + border-radius: 10rpx; | |
148 | + border: 1rpx #ddd solid; | |
149 | + margin: 0 10rpx 10rpx 0; | |
150 | + background-color: #fdfdfd; | |
151 | + color: #666; | |
152 | 152 | } |
153 | 153 | |
154 | 154 | .viewall-btn { |
155 | - margin-top: 20rpx; | |
156 | - width: 300rpx; | |
155 | + margin-top: 20rpx; | |
156 | + width: 300rpx; | |
157 | 157 | } |
158 | 158 | |
159 | -.card_bg {display: flex; max-width: 110rpx;height: 28rpx; align-items: center; border-radius: 26rpx; font-size: 19rpx; | |
160 | -background: #333; color: #fff; justify-content: center; margin-left: 3rpx; margin-top:7rpx; line-height: 28rpx; | |
161 | -padding: 2rpx 10rpx;width: auto; | |
159 | +.card_bg { | |
160 | + display: flex; | |
161 | + max-width: 110rpx; | |
162 | + height: 25rpx; | |
163 | + align-items: center; | |
164 | + border-radius: 26rpx; | |
165 | + font-size: 19rpx; | |
166 | + background: #333; | |
167 | + color: #fff; | |
168 | + justify-content: center; | |
169 | + margin-left: 8rpx; | |
170 | + margin-top: 7rpx; | |
171 | + line-height: 25rpx; | |
172 | + padding: 2rpx 10rpx; | |
173 | + width: auto; | |
174 | +} | |
175 | + | |
176 | +.card_bg .card_name { | |
177 | + max-width: 76rpx; | |
178 | + width: auto; | |
179 | + overflow: hidden; | |
180 | + white-space: nowrap; | |
181 | +} | |
162 | 182 | |
183 | +.card_bg image { | |
184 | + width: 19rpx; | |
185 | + height: 19rpx; | |
186 | + margin-right: 1rpx; | |
187 | + vertical-align: middle; | |
163 | 188 | } |
164 | -.card_bg .card_name{ | |
165 | - max-width: 76rpx; | |
166 | - width: auto; | |
167 | - overflow: hidden; | |
168 | - white-space:nowrap; | |
189 | + | |
190 | +.mk_price { | |
191 | + margin-left: 10rpx; | |
192 | + font-size: 25rpx; | |
193 | +} | |
194 | + | |
195 | +.item-cont { | |
196 | + line-height: 38rpx; | |
169 | 197 | } |
170 | -.card_bg image{ width: 19rpx; height: 19rpx; margin-right: 1rpx; vertical-align: middle} | |
171 | -.mk_price{margin-left: 10rpx; font-size: 25rpx;} | |
172 | -.item-cont{ line-height: 38rpx} | |
173 | 198 | \ No newline at end of file | ... | ... |
pages/goods/search/search.wxml
... | ... | @@ -50,7 +50,7 @@ |
50 | 50 | <block wx:if="{{card_field}}"> |
51 | 51 | <!-- 等级价>0 --> |
52 | 52 | <block wx:if="{{item[card_field]>0}}"> |
53 | - <view class="flex ai-center"> | |
53 | + <view class="flex ai_and"> | |
54 | 54 | <view class="price">¥{{item[card_field]}}</view> |
55 | 55 | <view class="card_bg"> |
56 | 56 | <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image> |
... | ... | @@ -77,7 +77,7 @@ |
77 | 77 | <view class="word-line xc-ash mk_price">¥{{item.market_price}}</view> |
78 | 78 | </view> |
79 | 79 | <view class="comment flex jc_sb"> |
80 | - <view class="flex"> | |
80 | + <view class="flex ai_and"> | |
81 | 81 | <view class="">¥{{g_filter.get_card_price(item,card_list,0)}}</view> |
82 | 82 | <view class="card_bg"> |
83 | 83 | <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image> | ... | ... |
pages/goods/search/search.wxss
1 | 1 | .container { |
2 | - color: #666; | |
2 | + color: #666; | |
3 | 3 | } |
4 | 4 | |
5 | 5 | .nav-item { |
6 | - float: left; | |
7 | - width: 30%; | |
8 | - height: 90rpx; | |
9 | - line-height: 90rpx; | |
10 | - display: flex; | |
11 | - align-items: center; | |
12 | - justify-content: center; | |
13 | - font-size: 32rpx; | |
14 | - border-bottom: 1px solid #dfefef; | |
15 | - background-color: #fff; | |
6 | + float: left; | |
7 | + width: 30%; | |
8 | + height: 90rpx; | |
9 | + line-height: 90rpx; | |
10 | + display: flex; | |
11 | + align-items: center; | |
12 | + justify-content: center; | |
13 | + font-size: 32rpx; | |
14 | + border-bottom: 1px solid #dfefef; | |
15 | + background-color: #fff; | |
16 | 16 | } |
17 | 17 | |
18 | 18 | .nav-item .ico-dg { |
19 | - width: 18rpx; | |
20 | - height: 12rpx; | |
21 | - margin-left: 10rpx; | |
22 | - line-height: 0; | |
19 | + width: 18rpx; | |
20 | + height: 12rpx; | |
21 | + margin-left: 10rpx; | |
22 | + line-height: 0; | |
23 | 23 | } |
24 | 24 | |
25 | 25 | .nav-item .ico-filter { |
26 | - width: 20rpx; | |
27 | - height: 20rpx; | |
28 | - margin-left: 10rpx; | |
29 | - line-height: 0; | |
26 | + width: 20rpx; | |
27 | + height: 20rpx; | |
28 | + margin-left: 10rpx; | |
29 | + line-height: 0; | |
30 | 30 | } |
31 | 31 | |
32 | 32 | .ico-dir { |
33 | - width: 16rpx; | |
34 | - height: 22rpx; | |
35 | - margin-left: 10rpx; | |
36 | - background-repeat: no-repeat; | |
37 | - background-size: cover; | |
38 | - background-position-x: 0; | |
33 | + width: 16rpx; | |
34 | + height: 22rpx; | |
35 | + margin-left: 10rpx; | |
36 | + background-repeat: no-repeat; | |
37 | + background-size: cover; | |
38 | + background-position-x: 0; | |
39 | 39 | } |
40 | 40 | |
41 | 41 | .ico-dir-dn { |
42 | - background-position-x: -16rpx; | |
42 | + background-position-x: -16rpx; | |
43 | 43 | } |
44 | 44 | |
45 | 45 | .ico-dir-up { |
46 | - background-position-x: -32rpx; | |
46 | + background-position-x: -32rpx; | |
47 | 47 | } |
48 | 48 | |
49 | 49 | .nav-search { |
50 | - width: 10%; | |
50 | + width: 10%; | |
51 | 51 | } |
52 | 52 | |
53 | 53 | .nav-item .search-img { |
54 | - width: 30rpx; | |
55 | - height: 30rpx; | |
54 | + width: 30rpx; | |
55 | + height: 30rpx; | |
56 | 56 | } |
57 | 57 | |
58 | 58 | .choice_list { |
59 | - background-color: #fff; | |
59 | + background-color: #fff; | |
60 | 60 | } |
61 | 61 | |
62 | 62 | .choice_item { |
63 | - position: relative; | |
64 | - width: 100%; | |
65 | - min-height: 200rpx; | |
66 | - padding: 10rpx 0; | |
67 | - border-bottom: 1px solid #dfefef; | |
68 | - font-size: 30rpx; | |
63 | + position: relative; | |
64 | + width: 100%; | |
65 | + min-height: 200rpx; | |
66 | + padding: 10rpx 0; | |
67 | + border-bottom: 1px solid #dfefef; | |
68 | + font-size: 30rpx; | |
69 | 69 | } |
70 | 70 | |
71 | 71 | .img-wrap { |
72 | - float: left; | |
73 | - width: 180rpx; | |
74 | - height: 180rpx; | |
75 | - padding: 0 10rpx 10rpx; | |
72 | + float: left; | |
73 | + width: 180rpx; | |
74 | + height: 180rpx; | |
75 | + padding: 0 10rpx 10rpx; | |
76 | 76 | } |
77 | 77 | |
78 | 78 | .img-wrap image { |
79 | - width: 100%; | |
80 | - height: 100%; | |
79 | + width: 100%; | |
80 | + height: 100%; | |
81 | 81 | } |
82 | 82 | |
83 | 83 | .item-cont .title { |
84 | - height: 72rpx; | |
85 | - margin: 16rpx 0; | |
86 | - padding-right: 10rpx; | |
87 | - line-height: 36rpx; | |
88 | - color: #333; | |
89 | - overflow: hidden; | |
84 | + height: 72rpx; | |
85 | + margin: 16rpx 0; | |
86 | + padding-right: 10rpx; | |
87 | + line-height: 36rpx; | |
88 | + color: #333; | |
89 | + overflow: hidden; | |
90 | 90 | } |
91 | 91 | |
92 | 92 | .price { |
93 | - display: inline-block; | |
94 | - color: #f23030; | |
95 | - line-height: 24rpx; | |
96 | - /* padding-bottom: 20rpx; */ | |
93 | + display: inline-block; | |
94 | + color: #f23030; | |
95 | + line-height: 24rpx; | |
96 | + /* padding-bottom: 20rpx; */ | |
97 | 97 | } |
98 | 98 | |
99 | 99 | .comment { |
100 | - font-size: 25rpx; | |
101 | - padding-right:30rpx; | |
102 | - margin-top:4rpx | |
103 | - | |
100 | + font-size: 25rpx; | |
101 | + padding-right: 30rpx; | |
102 | + margin-top: 4rpx; | |
104 | 103 | } |
105 | 104 | |
106 | 105 | .filter-modal { |
107 | - position: fixed; | |
108 | - left: 150rpx; | |
109 | - top: 0; | |
110 | - right: 0; | |
111 | - bottom: 0; | |
112 | - z-index: 20; | |
113 | - background-color: white; | |
114 | - overflow-x: hidden; | |
115 | - padding-bottom: 30rpx; | |
106 | + position: fixed; | |
107 | + left: 150rpx; | |
108 | + top: 0; | |
109 | + right: 0; | |
110 | + bottom: 0; | |
111 | + z-index: 20; | |
112 | + background-color: white; | |
113 | + overflow-x: hidden; | |
114 | + padding-bottom: 30rpx; | |
116 | 115 | } |
117 | 116 | |
118 | 117 | .filter-box { |
119 | - box-sizing: border-box; | |
120 | - width: 100%; | |
121 | - font-size: 28rpx; | |
122 | - padding: 20rpx; | |
118 | + box-sizing: border-box; | |
119 | + width: 100%; | |
120 | + font-size: 28rpx; | |
121 | + padding: 20rpx; | |
123 | 122 | } |
124 | 123 | |
125 | 124 | .filter-name { |
126 | - width: 100%; | |
127 | - padding: 20rpx 0; | |
128 | - word-break: keep-all; | |
129 | - white-space: nowrap; | |
130 | - text-overflow: ellipsis; | |
131 | - overflow: hidden; | |
132 | - font-size: 30rpx; | |
125 | + width: 100%; | |
126 | + padding: 20rpx 0; | |
127 | + word-break: keep-all; | |
128 | + white-space: nowrap; | |
129 | + text-overflow: ellipsis; | |
130 | + overflow: hidden; | |
131 | + font-size: 30rpx; | |
133 | 132 | } |
134 | 133 | |
135 | 134 | .filter-items { |
136 | - width: 100%; | |
135 | + width: 100%; | |
137 | 136 | } |
138 | 137 | |
139 | 138 | .filter-item { |
140 | - float: left; | |
141 | - width: fit-content; | |
142 | - max-width: 500rpx; | |
143 | - word-break: keep-all; | |
144 | - white-space: nowrap; | |
145 | - text-overflow: ellipsis; | |
146 | - overflow: hidden; | |
147 | - padding: 10rpx; | |
148 | - border-radius: 10rpx; | |
149 | - border: 1rpx #ddd solid; | |
150 | - margin: 0 10rpx 10rpx 0; | |
151 | - background-color: #fdfdfd; | |
152 | - color: #666; | |
139 | + float: left; | |
140 | + width: fit-content; | |
141 | + max-width: 500rpx; | |
142 | + word-break: keep-all; | |
143 | + white-space: nowrap; | |
144 | + text-overflow: ellipsis; | |
145 | + overflow: hidden; | |
146 | + padding: 10rpx; | |
147 | + border-radius: 10rpx; | |
148 | + border: 1rpx #ddd solid; | |
149 | + margin: 0 10rpx 10rpx 0; | |
150 | + background-color: #fdfdfd; | |
151 | + color: #666; | |
153 | 152 | } |
154 | 153 | |
155 | 154 | .viewall-btn { |
156 | - margin-top: 20rpx; | |
157 | - width: 300rpx; | |
155 | + margin-top: 20rpx; | |
156 | + width: 300rpx; | |
158 | 157 | } |
159 | 158 | |
160 | 159 | .search-modal { |
161 | - position: fixed; | |
162 | - top: 0; | |
163 | - right: 0; | |
164 | - left: 0; | |
165 | - bottom: 0; | |
166 | - z-index: 20; | |
167 | - background-color: white; | |
168 | - overflow-x: hidden; | |
169 | - padding: 80rpx 30rpx; | |
170 | - font-size: 30rpx; | |
171 | - color: #555555; | |
160 | + position: fixed; | |
161 | + top: 0; | |
162 | + right: 0; | |
163 | + left: 0; | |
164 | + bottom: 0; | |
165 | + z-index: 20; | |
166 | + background-color: white; | |
167 | + overflow-x: hidden; | |
168 | + padding: 80rpx 30rpx; | |
169 | + font-size: 30rpx; | |
170 | + color: #555; | |
172 | 171 | } |
173 | 172 | |
174 | 173 | .search-bar { |
175 | - width: 100%; | |
176 | - box-sizing: border-box; | |
174 | + width: 100%; | |
175 | + box-sizing: border-box; | |
177 | 176 | } |
178 | 177 | |
179 | 178 | .search-input { |
180 | - width: 80%; | |
181 | - float: left; | |
182 | - border: 1rpx solid #e0e0e0; | |
183 | - box-sizing: border-box; | |
184 | - height: 80rpx; | |
185 | - padding-left: 20rpx; | |
186 | - border-top-left-radius: 10rpx; | |
187 | - border-bottom-left-radius: 10rpx; | |
179 | + width: 80%; | |
180 | + float: left; | |
181 | + border: 1rpx solid #e0e0e0; | |
182 | + box-sizing: border-box; | |
183 | + height: 80rpx; | |
184 | + padding-left: 20rpx; | |
185 | + border-top-left-radius: 10rpx; | |
186 | + border-bottom-left-radius: 10rpx; | |
188 | 187 | } |
189 | 188 | |
190 | 189 | .search-btn { |
191 | - width: 20%; | |
192 | - height: 80rpx; | |
193 | - background-color: #f23030; | |
194 | - display: inline-block; | |
195 | - text-align: center; | |
196 | - border-top-right-radius: 10rpx; | |
197 | - border-bottom-right-radius: 10rpx; | |
190 | + width: 20%; | |
191 | + height: 80rpx; | |
192 | + background-color: #f23030; | |
193 | + display: inline-block; | |
194 | + text-align: center; | |
195 | + border-top-right-radius: 10rpx; | |
196 | + border-bottom-right-radius: 10rpx; | |
198 | 197 | } |
199 | 198 | |
200 | 199 | .search-btn .search-img { |
201 | - height: 45rpx; | |
202 | - width: 45rpx; | |
203 | - padding: 20rpx; | |
200 | + height: 45rpx; | |
201 | + width: 45rpx; | |
202 | + padding: 20rpx; | |
204 | 203 | } |
205 | 204 | |
206 | 205 | .search-hot { |
207 | - margin-top: 40rpx; | |
206 | + margin-top: 40rpx; | |
208 | 207 | } |
209 | 208 | |
210 | 209 | .hot-title { |
211 | - font-size: 35rpx; | |
212 | - color: black; | |
213 | - margin-bottom: 30rpx; | |
210 | + font-size: 35rpx; | |
211 | + color: black; | |
212 | + margin-bottom: 30rpx; | |
214 | 213 | } |
215 | 214 | |
216 | 215 | .hot-row { |
217 | - display: flex; | |
218 | - /*--justify-content: space-between---*/ | |
219 | - padding: 15rpx 10rpx; | |
216 | + display: flex; | |
217 | + /*--justify-content: space-between---*/ | |
218 | + padding: 15rpx 10rpx; | |
220 | 219 | } |
221 | 220 | |
222 | 221 | .hot-item { |
223 | - padding: 8rpx 8rpx; | |
224 | - border: 1rpx solid #e0e0e0; | |
225 | - border-radius: 10rpx; | |
226 | - font-size: 28rpx; | |
227 | - margin-left: 15rpx; | |
228 | -} | |
229 | - | |
230 | -.card_bg {display: flex; max-width: 110rpx;height: 28rpx; align-items: center; border-radius: 26rpx; font-size: 19rpx;padding: 2rpx 10rpx; | |
231 | -background: #333; color: #fff; justify-content: center; margin-left: 3rpx; margin-top:7rpx; line-height: 28rpx; width: auto} | |
232 | -.card_bg image{ width: 19rpx; height: 19rpx; margin-right: 1rpx; vertical-align: middle} | |
233 | -.card_bg .card_name{ | |
234 | - max-width: 76rpx; | |
235 | - width: auto; | |
236 | - overflow: hidden; | |
237 | - white-space:nowrap; | |
238 | -} | |
239 | -.mk_price{margin-left: 10rpx; font-size: 25rpx;} | |
240 | -.item-cont{ line-height: 38rpx} | |
222 | + padding: 8rpx 8rpx; | |
223 | + border: 1rpx solid #e0e0e0; | |
224 | + border-radius: 10rpx; | |
225 | + font-size: 28rpx; | |
226 | + margin-left: 15rpx; | |
227 | +} | |
228 | + | |
229 | +.card_bg { | |
230 | + display: flex; | |
231 | + max-width: 110rpx; | |
232 | + height: 25rpx; | |
233 | + align-items: center; | |
234 | + border-radius: 26rpx; | |
235 | + font-size: 19rpx; | |
236 | + padding: 2rpx 10rpx; | |
237 | + background: #333; | |
238 | + color: #fff; | |
239 | + justify-content: center; | |
240 | + margin-left: 8rpx; | |
241 | + margin-top: 7rpx; | |
242 | + line-height: 25rpx; | |
243 | + width: auto; | |
244 | +} | |
245 | + | |
246 | +.card_bg image { | |
247 | + width: 19rpx; | |
248 | + height: 19rpx; | |
249 | + margin-right: 1rpx; | |
250 | + vertical-align: middle; | |
251 | +} | |
252 | + | |
253 | +.card_bg .card_name { | |
254 | + max-width: 76rpx; | |
255 | + width: auto; | |
256 | + overflow: hidden; | |
257 | + white-space: nowrap; | |
258 | +} | |
259 | + | |
260 | +.mk_price { | |
261 | + margin-left: 10rpx; | |
262 | + font-size: 25rpx; | |
263 | +} | |
264 | + | |
265 | +.item-cont { | |
266 | + line-height: 38rpx; | |
267 | +} | ... | ... |