Authored by ccbikai

品牌一览页面样式转换

@@ -2,31 +2,32 @@ @@ -2,31 +2,32 @@
2 2
3 .newbrand-search { 3 .newbrand-search {
4 width: 93.75%; 4 width: 93.75%;
5 - height: 30px;  
6 - padding: 7px 3.125%; 5 + height: 60rem / $pxConvertRem;
  6 + padding: 14rem / $pxConvertRem 3.125%;
7 background-color: #f8f8f8; 7 background-color: #f8f8f8;
8 left: 0; 8 left: 0;
9 - top: 44px; 9 + top: 88rem / $pxConvertRem;
10 position: fixed; 10 position: fixed;
11 z-index: 2; 11 z-index: 2;
12 .search-box { 12 .search-box {
13 position: relative; 13 position: relative;
14 - height: 30px; 14 + height: 60rem / $pxConvertRem;
15 background-color: #FFF; 15 background-color: #FFF;
16 - border-radius: 15px;  
17 - padding: 0 16px 0 26px; 16 + border-radius: 30rem / $pxConvertRem;
  17 + padding: 0 32rem / $pxConvertRem 0 52rem / $pxConvertRem;
18 18
19 .search-input { 19 .search-input {
20 width: 100%; 20 width: 100%;
21 - height: 30px; 21 + height: 60rem / $pxConvertRem;
22 border: 0; 22 border: 0;
23 } 23 }
24 24
25 .search-icon { 25 .search-icon {
26 position: absolute; 26 position: absolute;
27 - font-size: 12px;  
28 - top: 16px;  
29 - left: 24px; 27 + font-size: 24rem / $pxConvertRem;
  28 + top: 20rem / $pxConvertRem;
  29 + left: 24rem / $pxConvertRem;
  30 + color: #bdbdbd;
30 } 31 }
31 32
32 } 33 }
@@ -62,12 +63,12 @@ @@ -62,12 +63,12 @@
62 color: #999999; 63 color: #999999;
63 font-weight: bold; 64 font-weight: bold;
64 position: relative; 65 position: relative;
65 -  
66 h2 { 66 h2 {
67 - width: 100%;  
68 - height: 25px;  
69 - line-height: 25px;  
70 - font-size: 17px; 67 + // width: 100%;
  68 + padding: 0 20rem / $pxConvertRem;
  69 + height: 50rem / $pxConvertRem;
  70 + line-height: 50rem / $pxConvertRem;
  71 + font-size: 34rem / $pxConvertRem;
71 border-top: 1px solid #e6e6e6; 72 border-top: 1px solid #e6e6e6;
72 background-color: #f4f4f4; 73 background-color: #f4f4f4;
73 } 74 }
@@ -75,18 +76,21 @@ @@ -75,18 +76,21 @@
75 76
76 p { 77 p {
77 cursor: pointer; 78 cursor: pointer;
78 - height: 25px;  
79 - padding-right: 10px; 79 + // height: 50rem / $pxConvertRem;
  80 + padding: 0 20rem / $pxConvertRem;
80 a { 81 a {
81 display: block; 82 display: block;
82 - font-size: 17px; 83 + padding-top: 10rem / $pxConvertRem;
  84 + height: 76rem / $pxConvertRem;
  85 + line-height: 76rem / $pxConvertRem;
  86 + font-size: 34rem / $pxConvertRem;
83 border-bottom: 1px solid #f3f3f3; 87 border-bottom: 1px solid #f3f3f3;
84 border-top: 1px solid #f9f9f9; 88 border-top: 1px solid #f9f9f9;
85 i { 89 i {
86 position: relative; 90 position: relative;
87 top: 1px; 91 top: 1px;
88 color: #ff0000; 92 color: #ff0000;
89 - padding-left: 16px; 93 + padding-left: 32rem / $pxConvertRem;
90 } 94 }
91 } 95 }
92 } 96 }
@@ -94,18 +98,18 @@ @@ -94,18 +98,18 @@
94 98
95 .right-bar { 99 .right-bar {
96 100
97 - width: 30px;  
98 - top: 120px !important; 101 + width: 60rem / $pxConvertRem;
  102 + top: 240rem / $pxConvertRem !important;
99 overflow: hidden; 103 overflow: hidden;
100 position: fixed; 104 position: fixed;
101 - right: 1px;  
102 - border-radius: 6px; 105 + right: 2rem / $pxConvertRem;
  106 + border-radius: 12rem / $pxConvertRem;
103 background: rgba(0,0,0,.8); 107 background: rgba(0,0,0,.8);
104 z-index: 2; 108 z-index: 2;
105 b { 109 b {
106 - height: 16px; 110 + height: 32rem / $pxConvertRem;
107 111
108 - line-height: 14px; 112 + line-height: 28rem / $pxConvertRem;
109 text-align: center; 113 text-align: center;
110 display: block; 114 display: block;
111 color: #999999; 115 color: #999999;
@@ -114,6 +118,6 @@ @@ -114,6 +118,6 @@
114 } 118 }
115 119
116 .con { 120 .con {
117 - padding-top: 5px; 121 + padding-top: 10rem / $pxConvertRem;
118 } 122 }
119 } 123 }
@@ -16,12 +16,13 @@ @@ -16,12 +16,13 @@
16 opacity: 0.5; 16 opacity: 0.5;
17 margin: 0 (9rem / $pxConvertRem); 17 margin: 0 (9rem / $pxConvertRem);
18 border-radius: 50%; 18 border-radius: 50%;
19 - }  
20 - span.swiper-pagination-bullet-active { 19 + &.swiper-pagination-bullet-active {
  20 + background: #fff;
21 opacity: 1; 21 opacity: 1;
22 } 22 }
23 } 23 }
24 } 24 }
  25 + }
25 } 26 }
26 27
27 .banner-swiper { 28 .banner-swiper {