search/list brand adaption
Showing
5 changed files
with
47 additions
and
29 deletions
@@ -102,16 +102,20 @@ | @@ -102,16 +102,20 @@ | ||
102 | </div> | 102 | </div> |
103 | </div> | 103 | </div> |
104 | 104 | ||
105 | - <ul class="panel-body check-container clearfix"> | ||
106 | - {{# brandsShow}} | ||
107 | - <li class="attr" data-index="{{index}}" data-key="{{key}}"> | ||
108 | - <a href="{{href}}"> | ||
109 | - <span class="iconfont checkbox" data-id="{{id}}"></span> | ||
110 | - <span title="{{name}}">{{name}}</span> | ||
111 | - </a> | ||
112 | - </li> | ||
113 | - {{/ brandsShow}} | ||
114 | - </ul> | 105 | + <div class="panel-body"> |
106 | + <div class="ul-scroll"> | ||
107 | + <ul class="check-container clearfix"> | ||
108 | + {{# brandsShow}} | ||
109 | + <li class="attr" data-index="{{index}}" data-key="{{key}}"> | ||
110 | + <a href="{{href}}"> | ||
111 | + <span class="iconfont checkbox" data-id="{{id}}"></span> | ||
112 | + <span title="{{name}}">{{name}}</span> | ||
113 | + </a> | ||
114 | + </li> | ||
115 | + {{/ brandsShow}} | ||
116 | + </ul> | ||
117 | + </div> | ||
118 | + </div> | ||
115 | 119 | ||
116 | <div class="btns"> | 120 | <div class="btns"> |
117 | <button id="brand-multi-ok" class="multi-select-ok dis">确定</button> | 121 | <button id="brand-multi-ok" class="multi-select-ok dis">确定</button> |
@@ -14,16 +14,12 @@ | @@ -14,16 +14,12 @@ | ||
14 | 14 | ||
15 | .title { | 15 | .title { |
16 | float: left; | 16 | float: left; |
17 | - width: 90px; | 17 | + width: 75px; |
18 | line-height: 30px; | 18 | line-height: 30px; |
19 | } | 19 | } |
20 | 20 | ||
21 | .attr-content { | 21 | .attr-content { |
22 | - margin-left: 90px; | ||
23 | - | ||
24 | - .default { | ||
25 | - padding-right: 140px; | ||
26 | - } | 22 | + margin-left: 75px; |
27 | } | 23 | } |
28 | 24 | ||
29 | .multi-select { | 25 | .multi-select { |
@@ -120,16 +116,17 @@ | @@ -120,16 +116,17 @@ | ||
120 | } | 116 | } |
121 | 117 | ||
122 | .brand-more { | 118 | .brand-more { |
123 | - margin-right: 20px; | 119 | + margin-right: 10px; |
124 | cursor: pointer; | 120 | cursor: pointer; |
125 | } | 121 | } |
126 | 122 | ||
127 | .brands-index { | 123 | .brands-index { |
128 | float: left; | 124 | float: left; |
129 | line-height: 30px; | 125 | line-height: 30px; |
126 | + margin-right: 5px; | ||
130 | 127 | ||
131 | span { | 128 | span { |
132 | - margin: 0 5px; | 129 | + margin: 0 2px; |
133 | cursor: pointer; | 130 | cursor: pointer; |
134 | -moz-user-select: none; | 131 | -moz-user-select: none; |
135 | 132 | ||
@@ -145,7 +142,7 @@ | @@ -145,7 +142,7 @@ | ||
145 | line-height: 18px; | 142 | line-height: 18px; |
146 | border: 1px solid #b0b0b0; | 143 | border: 1px solid #b0b0b0; |
147 | margin-top: 5px; | 144 | margin-top: 5px; |
148 | - margin-left: 15px; | 145 | + margin-left: 10px; |
149 | 146 | ||
150 | input { | 147 | input { |
151 | float: left; | 148 | float: left; |
@@ -159,7 +156,7 @@ | @@ -159,7 +156,7 @@ | ||
159 | display: inline-block; | 156 | display: inline-block; |
160 | width: 55px; | 157 | width: 55px; |
161 | height: 18px; | 158 | height: 18px; |
162 | - background: #b0b0b0; | 159 | + background: #3a3a3a; |
163 | color: #fff; | 160 | color: #fff; |
164 | text-align: center; | 161 | text-align: center; |
165 | cursor: default; | 162 | cursor: default; |
@@ -168,10 +165,15 @@ | @@ -168,10 +165,15 @@ | ||
168 | 165 | ||
169 | .panel-body { | 166 | .panel-body { |
170 | padding: 15px 20px; | 167 | padding: 15px 20px; |
171 | - margin-top: 5px; | ||
172 | background: #f4f7f6; | 168 | background: #f4f7f6; |
173 | - min-height: 30px; | ||
174 | - border: 1px solid #000; | 169 | + margin-top: 5px; |
170 | + margin-left: 10px; | ||
171 | + | ||
172 | + .ul-scroll { | ||
173 | + overflow: auto; | ||
174 | + min-height: 30px; | ||
175 | + max-height: 150px; | ||
176 | + } | ||
175 | } | 177 | } |
176 | } | 178 | } |
177 | 179 | ||
@@ -300,4 +302,4 @@ | @@ -300,4 +302,4 @@ | ||
300 | .multi .checkbox { | 302 | .multi .checkbox { |
301 | display: inline; | 303 | display: inline; |
302 | } | 304 | } |
303 | -} | 305 | +} |
1 | -@import "search", "list", "new-sale", "filter-box", "sort-pager", "good", "latest-walk", "left-content", "no-result", "hot-rank"; | 1 | +@import "search", "list", "new-sale", "filter-box", "sort-pager", "good", "latest-walk", "left-content", "no-result", "hot-rank", "shop-entry"; |
2 | 2 | ||
3 | .product-page { | 3 | .product-page { |
4 | 4 | ||
@@ -44,6 +44,14 @@ | @@ -44,6 +44,14 @@ | ||
44 | height: 315px; | 44 | height: 315px; |
45 | } | 45 | } |
46 | } | 46 | } |
47 | + | ||
48 | + .panel-body .attr { | ||
49 | + width: 25%; | ||
50 | + } | ||
51 | + | ||
52 | + .filter-box .brand .attr-content { | ||
53 | + max-width: 730px; | ||
54 | + } | ||
47 | } | 55 | } |
48 | 56 | ||
49 | /*990px*/ | 57 | /*990px*/ |
@@ -74,5 +82,9 @@ | @@ -74,5 +82,9 @@ | ||
74 | height: 261px; | 82 | height: 261px; |
75 | } | 83 | } |
76 | } | 84 | } |
85 | + | ||
86 | + .filter-box .brand .attr-content { | ||
87 | + max-width: 570px; | ||
88 | + } | ||
77 | } | 89 | } |
78 | } | 90 | } |
@@ -5,7 +5,6 @@ | @@ -5,7 +5,6 @@ | ||
5 | */ | 5 | */ |
6 | 6 | ||
7 | .product-search-page { | 7 | .product-search-page { |
8 | - @import "shop-entry"; | ||
9 | .goods-container { | 8 | .goods-container { |
10 | height: auto; | 9 | height: auto; |
11 | padding: 25px 0 0 0; | 10 | padding: 25px 0 0 0; |
@@ -22,7 +21,6 @@ | @@ -22,7 +21,6 @@ | ||
22 | /*990px*/ | 21 | /*990px*/ |
23 | @media (max-width: 1180px) { | 22 | @media (max-width: 1180px) { |
24 | .product-search-page { | 23 | .product-search-page { |
25 | - | ||
26 | .goods-container { | 24 | .goods-container { |
27 | height: auto; | 25 | height: auto; |
28 | padding-top: 25px; | 26 | padding-top: 25px; |
@@ -42,5 +40,9 @@ | @@ -42,5 +40,9 @@ | ||
42 | height: 255px; | 40 | height: 255px; |
43 | } | 41 | } |
44 | } | 42 | } |
43 | + | ||
44 | + .filter-box .brand .attr-content { | ||
45 | + max-width: 750px; | ||
46 | + } | ||
45 | } | 47 | } |
46 | } | 48 | } |
-
Please register or login to post a comment