wxd / MShopWeApp

Commit 2f12c3456ab5fc124e8495a0ea1f6095e5fadac6

Authored by taiyuan
1 parent da7a2fae

分类列表风格二样式修改

Inline Side-by-side
Showing 2 changed files with 39 additions and 41 deletions
pages/goods/categoryList/categoryList.wxml
  View file @2f12c34
... ... @@ -122,9 +122,9 @@
122 122  
123 123  
124 124 <!-- 分类项目内容 22 -->
125   - <view class="flex project_height" style="margin-left:-10rpx;margin-bottom:120rpx; height: auto;" id="two_type">
  125 + <view class="flex project_height" style="height:100%;box-sizing:border-box;padding-bottom:100rpx;" id="two_type">
126 126 <!-- 分类项目的类型 -->
127   - <view class="project_type" style="background-color:#eee;height:88%;overflow-y:auto;position:fixed;left:0;z-index:99;top:126rpx;">
  127 + <view class="project_type" style="background-color:#eee;<!-- height:88%; -->overflow-y:auto;position:fixed;left:0;z-index:99;top:120rpx;">
128 128 <view class="project_type-frame" style="margin-bottom:120rpx;">
129 129 <view wx:if="{{is_show_gb}}" class="{{status_show == 1?'':''}}">
130 130 <!-- <view style="{{status_show == 1?'position: absolute;height: 52rpx;width: 6rpx;background-color: red;left: 0; margin-top: 24rpx;':''}}"></view> -->
... ... @@ -159,7 +159,7 @@
159 159  
160 160 </view>
161 161 <!-- 分类项目的内容 -->
162   - <view class="classify_content" style="margin-left:27%;margin-top:130rpx">
  162 + <view class="classify_content" style="padding-left:196rpx;">
163 163 <!-- 国家的样式 -->
164 164 <block wx:if="{{select_classify_on==223&&is_show_gb}}">
165 165 <view class="classify_name fs28 flex-space-between">
... ... @@ -297,7 +297,7 @@
297 297 <!-- 分类项目内容 -->
298 298 <view class="flex project_height" style="margin-left:-10rpx;">
299 299 <!-- 分类项目的类型 -->
300   - <view class="project_type" style="background-color:#eee;height:88%;overflow-y:auto;position:fixed;left:0;z-index:99;top:126rpx;" id="thress_type3">
  300 + <view class="project_type" style="background-color:#eee;height:88%;overflow-y:auto;position:fixed;left:0;z-index:99;top:120rpx;" id="thress_type3">
301 301 <view class="project_type-frame" style="margin-bottom:120rpx;">
302 302 <view wx:if="{{is_show_gb}}">
303 303 <view bindtap="click_classify" class="tab-bar-item {{select_classify_on==223 ? 'active' : ''}}" data-current="223" data-index="223" data-name="国家" wx:if="{{is_country}}">
... ... @@ -345,7 +345,7 @@
345 345 </view>
346 346 </view>
347 347 <!-- 分类项目的内容 -->
348   - <view class="classify_content" style="margin-left:27%;margin-top:130rpx">
  348 + <view class="classify_content" style="margin-left:27%;margin-top:120rpx">
349 349 <!-- 国家的样式 -->
350 350 <block wx:if="{{select_classify_on==223&&is_show_gb}}">
351 351 <view class="classify_name fs28 flex-space-between">
... ...
pages/goods/categoryList/categoryList.wxss
  View file @2f12c34
1 1 /*---nyf 2018-9-7---*/
2 2  
3   -page{height: 100%; background: #fff;}
  3 +page{height: 100%; background: #fff;padding-top:120rpx;box-sizing: border-box;}
4 4 .top_view{ width: 100%;background: #fff;}
5 5  
6 6 .swiper-tab{
... ... @@ -103,7 +103,7 @@ line-height: 50rpx;
103 103  
104 104 /*--国家--*/
105 105 .nation_box{ position: absolute;width: 260rpx; height: 160rpx; background-size: 100% 100%; background-repeat: no-repeat;
106   - top:110rpx;left: 50%; margin-left: -130rpx;z-index: 8; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAN8AAACACAYAAACLIbwOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MkVDREM1NjhCMDU3MTFFNjg3NEZDNzlCNDg1N0FGRjUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MkVDREM1NjlCMDU3MTFFNjg3NEZDNzlCNDg1N0FGRjUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyRUNEQzU2NkIwNTcxMUU2ODc0RkM3OUI0ODU3QUZGNSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyRUNEQzU2N0IwNTcxMUU2ODc0RkM3OUI0ODU3QUZGNSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlO56qEAAAFJSURBVHja7NfRCYAgFIbRDMd0Doe4a9ietxWUIjDOeZYefvhIS2aOA/jcaQIQH4gPEB+IDxAfiA8QH2ynzhyKiGYqWNN7vx7HN/MhYO2H5doJ3nwgPkB8ID5AfCA+QHwgPkB8ID5AfCA+EJ8JQHwgPkB8ID5AfCA+QHwgPkB8ID5AfCA+EB8gPhAfID4QHyA+EB8gPhAfID4QHyA+EB+IDxAfiA8QH4gPEB+IDxAfiA8QH4gPEB+ID8QHiA/EB4gPxAeID8QHiA/EB4gPxAeID8QH4gPEB+IDxAfiA8QH4gPEB+IDxAfiA8QH4gPxAeID8QHiA/EB4gPxAeID8QHiA/EB4gPxgfgA8YH4APGB+ADxgfgA8YH4APGB+ADxgfhAfID4QHyA+OB/6uzBiGjmgveUzBxmANdOEB8gPhAfID4QHyA+2MotwAD/ZBI/EDK5cgAAAABJRU5ErkJggg==");}
  106 + top:110rpx;left: 50%; /* margin-left: -130rpx; */z-index: 8; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAN8AAACACAYAAACLIbwOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MkVDREM1NjhCMDU3MTFFNjg3NEZDNzlCNDg1N0FGRjUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MkVDREM1NjlCMDU3MTFFNjg3NEZDNzlCNDg1N0FGRjUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyRUNEQzU2NkIwNTcxMUU2ODc0RkM3OUI0ODU3QUZGNSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyRUNEQzU2N0IwNTcxMUU2ODc0RkM3OUI0ODU3QUZGNSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlO56qEAAAFJSURBVHja7NfRCYAgFIbRDMd0Doe4a9ietxWUIjDOeZYefvhIS2aOA/jcaQIQH4gPEB+IDxAfiA8QH2ynzhyKiGYqWNN7vx7HN/MhYO2H5doJ3nwgPkB8ID5AfCA+QHwgPkB8ID5AfCA+EJ8JQHwgPkB8ID5AfCA+QHwgPkB8ID5AfCA+EB8gPhAfID4QHyA+EB8gPhAfID4QHyA+EB+IDxAfiA8QH4gPEB+IDxAfiA8QH4gPEB+ID8QHiA/EB4gPxAeID8QHiA/EB4gPxAeID8QH4gPEB+IDxAfiA8QH4gPEB+IDxAfiA8QH4gPxAeID8QHiA/EB4gPxAeID8QHiA/EB4gPxgfgA8YH4APGB+ADxgfgA8YH4APGB+ADxgfhAfID4QHyA+OB/6uzBiGjmgveUzBxmANdOEB8gPhAfID4QHyA+2MotwAD/ZBI/EDK5cgAAAABJRU5ErkJggg==");}
107 107  
108 108 .n_img{width: 100%; height: 375rpx;}
109 109 .nt_1{height:82rpx; line-height: 100rpx;}
... ... @@ -177,7 +177,7 @@ line-height: 50rpx;
177 177 height: 120rpx;
178 178 z-index: 10;
179 179 background: #fff;
180   - border-top: 4rpx solid #eee;
  180 + /* border-top: 4rpx solid #eee; */
181 181 border-bottom: 1rpx solid #eee;
182 182  
183 183 }
... ... @@ -212,13 +212,14 @@ margin-top: 8rpx;
212 212  
213 213 }
214 214 .project_type{
  215 + box-sizing: border-box;
215 216 width: 26%;
216 217 height: 100%;
  218 + padding-bottom: 100rpx;
217 219 border-right: 1rpx solid #eee;
218 220 white-space: nowrap;
219   -overflow: hidden;
220   -overflow-y: scroll;
221   -
  221 + overflow: hidden;
  222 + overflow-y: scroll;
222 223 }
223 224 .share_type{
224 225 margin: auto;
... ... @@ -301,20 +302,17 @@ width: 60%;
301 302  
302 303 }
303 304 .classify_content{
304   - width: 72%
  305 + width: 100%
305 306  
306 307 }
307   - .classify_content-frame{
308   - width: 90%;
309   - margin: auto;
310   - flex-wrap:wrap;
311   - max-height: 90%;
312   - overflow-y:scroll;
313   - overflow: hidden scroll;
314   - /* padding-bottom: 65rpx; */
315   -
316   -
317   - }
  308 + .classify_content-frame{
  309 + box-sizing: border-box;
  310 + width: 100%;
  311 + padding: 0 20rpx;
  312 + flex-wrap:wrap;
  313 + overflow-y:scroll;
  314 + padding-bottom: 118rpx;
  315 + }
318 316 .country_img-frame{
319 317 width: 48%;
320 318 height: 140rpx;
... ... @@ -331,12 +329,12 @@ width: 60%;
331 329  
332 330 }
333 331 .nation_box.box{
334   - top: 16%;
335   -width:80%;
336   -height:70%;
337   -left: 70.5%;
338   -overflow: hidden;
339   -
  332 + width:80%;
  333 + height:70%;
  334 + top: 50%;
  335 + left: 50%;
  336 + overflow: hidden;
  337 + transform: translate(-50%, -50%);
340 338 }
341 339 .nt_1.line-height{
342 340 line-height: 65rpx;
... ... @@ -363,10 +361,10 @@ line-height: 65rpx;
363 361 font-size: 24rpx;
364 362 }
365 363 .brand_img_frame{
366   - width: 45%;
  364 + width: 50%;
367 365 margin-top: 18rpx;
368   - margin-right: 15rpx;
369   - height: 160rpx;
  366 + /* margin-right: 15rpx; */
  367 + height: 160rpx;
370 368 }
371 369 .brand_img{
372 370 width:220rpx;
... ... @@ -375,13 +373,12 @@ line-height: 65rpx;
375 373 margin-top: 10rpx;
376 374  
377 375 }
378   - .type_img_frame{
379   - width: 30%;
  376 + .type_img_frame {
  377 + width: calc(100% / 3);
380 378 height: 140rpx;
381   - margin-top: 18rpx;
382   - margin-right: 15rpx;
383   -
384   -
  379 + margin-top: 20rpx;
  380 + margin-bottom: 20rpx;
  381 + /* margin-right: 15rpx; */
385 382 }
386 383  
387 384  
... ... @@ -504,7 +501,8 @@ margin: auto;
504 501 border-left: 8rpx solid #E41F19;
505 502 height: 50rpx;
506 503 left: 0;
507   - top:26rpx;
  504 + top:50%;
  505 + transform: translateY(-50%);
508 506 }
509 507  
510 508  
... ... @@ -519,8 +517,8 @@ margin: auto;
519 517 }
520 518  
521 519 page {
522   - overflow-x: hidden;
523   - padding-bottom: 40rpx;
  520 + /* overflow-x: hidden; */
  521 + /* padding-bottom: 40rpx; */
524 522 }
525 523  
526 524 /* 风格三商品列表样式引入 */
... ...