Sanakey
2021-01-31 53cc6f817625897935fb10c3845ad7be400f3036
提交 | 用户 | age
d98d05 1 @import "../template/goods-item/goods-item-template.wxss";
S 2 @import "../template/tabbar/tabbar-template.wxss";
3 @import "../template/authorize/authorize-template.wxss";
4 @import "../template/no-more/no-more-template.wxss";
5
6 /**index.wxss**/
7
8 page {
9   overflow-x: hidden;
10   background-color: #fff;
11 }
12 .icon-weizhi{
13   color: #333;
14   margin-left: 20rpx;
15 }
16 .search-bar {
17   display: flex;
18   flex-direction: row;
19   /* background-color: #229bc9; */
20   background-color: #fff;
21   position: fixed;
22   left: 0;
23   right: 0;
24   top: 0;
25   z-index: 100;
26 }
27
28 .area {
29   display: flex;
30   flex-direction: row;
31   width: 160rpx;
32   color: #fff;
33   line-height: 80rpx;
34   text-align: center;
35 }
36 .area .icon-xiangxiazhankai{
37   color:#333;
38 }
39 .area-text {
40   overflow: hidden;
41   text-overflow: ellipsis;
42   white-space: nowrap;
43   width: 120rpx;
44   color: #333;
45   /*margin-left: 10rpx;*/
46 }
47
48 .search-box {
49   flex: 1;
50 }
51
52 .search-input {
53   box-sizing: border-box;
54   height: 60rpx;
55   line-height: 60rpx;
56   background: #f1f1f1;
57   border-radius: 30rpx;
58   color: #333;
59   margin: 10rpx;
60   padding: 0 10rpx;
61 }
62
63 .search-input icon, .search-input text {
64   margin-left: 16rpx;
65   font-size: 26rpx;
66 }
67
68 .icon-saomiao {
69   font-size: 50rpx;
70   color: #333;
71 }
72
73 .scan {
74   display: flex;
75   flex-direction: column;
76   width: 100rpx;
77   text-align: center;
78   color: #333;
79 }
80
81 .search-text{
82   width: 80rpx;
83   color: #333;
84   line-height: 80rpx;
85   text-align: center;
86   font-size: 26rpx;
87 }
88 .has-header {
89   margin-top: 105rpx;
90   margin-left: 20rpx;
91   margin-right: 20rpx;
92 }
93
94
95 /*菜单导航  */
96
97 .index-menu {
98   padding: 20rpx 0;
99   background-color: #fff;
100   display: flex;
101   flex-direction: row;
102   flex-wrap: wrap;
103   justify-content: flex-start;
104 }
105
106 .index-menu-a {
107   display: flex;
108   flex-direction: column;
109   /* flex: 1; */
110   text-align: center;
111   padding: 10rpx 0;
112   width: 25%;
113 }
114
115 .index-menu-a image {
116   width: 90rpx;
117   height: 90rpx;
118 }
119
120 .index-imgbar {
121   padding: 20rpx;
122   /* width: 100%; */
123 }
124 .index-imgbar navigator + navigator{
125   margin-top: 20rpx;
126 }
127 .index-imgbar image{
128   border-radius: 10rpx;
129 }
130
131 /*活动图*/
132 .imgbar{
133   display: flex;
134   flex-direction: row;
135   width: 100%;
136   height: auto;
137   margin-bottom: 5px;
138 }
139 .imgbar-view{
140   width: 100%;
141 }
142 .imgbar-vertical{
143   width: 350rpx;
144   padding-right: 4rpx;
145   box-sizing:border-box;
146
147 }
148 /*.imgbar-left+.imgbar-right{*/
149 /*  padding-left: 2px;*/
150 /*}*/
151 .imgbar-horizon+.imgbar-vertical{
152   padding-left: 4rpx;
153   padding-right: 0;
154 }
155 .imgbar-horizon{
156   flex: 1;
157 }
158 .imgbar image{
159   /*height: auto;*/
160   display: block;
161 }
162
163 .imgbar-horizon image+image{
164   margin-top: 4rpx;
165 }
166 /*折叠菜单  */
167
168 .fl-row {
169   display: flex;
170   flex-direction: row;
171   margin: 20rpx 0 0 0;
172   /* justify-content: space-around;  */
173 }
174
175 .top-select .item {
176   flex: 1;
177   /* width: 100%;  */
178   text-align: center;
179   font-weight: bold;
180   line-height: 40rpx;
181   padding: 20rpx 0;
182 }
183
184 /* .top-select .item view{
185   display: flex;
186   flex-direction: row;
187   text-align: center;
188 }  */
189
190 .top-select .item text {
191   font-size: 30rpx;
192 }
193
194 .top-select .item .angle {
195   font-size: 30rpx;
196 }
197
198 /* .top-select .item+.item view::before {
199   content: "";
200   text-align: left;
201   border-left: 2rpx solid red;#525252
202 } */
203
204 .active {
205   background-color: #f1f1f1;
206 }
207
208 .active text {
209   color: #333;
210 }
211
212 .active .angle {
213   display: inline-block;
214   /* transition: rotateZ;
215   transform: rotateZ(180deg); *//* transform-origin: center 45%;  */
216   animation: 0.3s rotatestart forwards;
217 }
218
219 /*菜单子项  */
220
221 .show-list {
222   /* display: none;  */
223   background: #f1f1f1;
224   /* padding: 0 20rpx; */
225   /* padding-bottom: 20rpx; */
226   color: #333;
227 }
228
229 .show-list view {
230   display: inline-block;
231   font-size: 26rpx;
232   padding: 20rpx;
233   /* padding-bottom: 10rpx; */
234   /* color: #fff; */
235 }
236
237 .select {
238   color: #f72424;
239 }
240
241 .normal .item-container, .normal .items{
242   /* width: 700rpx; */
243 }
244 .normal-scroll .goods-item-img{
245   border-radius: 5px;
246 }
247 .normal-scroll .items{
248   text-align: left;
249   box-shadow:6rpx 6rpx 10rpx #f1f1f1;
250   /* border-radius: 5px; */
251 }
252 .normal .items{
253   display: flex;
254   flex-direction: column;
255   margin: 10rpx;
256 }
257 .normal .list-container {
258   /* height: 220rpx; */
259   display: flex;
260   flex-direction: row;
261   margin: 0 10rpx;
262   align-items: center;
263 }
264 /*商品列表  */
265
266 .goods-title::before {
267   content: " ";
268   padding-left: 10rpx;
269   border-left: 10rpx solid #c1c1c1;
270 }
271
272 .goods-title {
273   margin: 30rpx 20rpx 10rpx 20rpx;
274   font-size: 32rpx;
275   font-weight: bold;
276   color: #333;
277 }
278
279 .goods-titlePhoto{
280   width: 100%;
281 }
282
283 .goods-container {
284   padding: 20rpx;
285   display: flex;
286   flex-wrap: wrap;
287   justify-content: space-between;
288 }
289
290 .single-view-container {
291   /* float: left; */
292   margin: 10rpx 0;
293   position: relative;
294 }
295
296 .order-price{
297   background-color: #f72424;
298   color: #fff;
299   text-align: center;
300   margin: 10rpx 30rpx;
301   line-height: 50rpx;
302   border-radius: 25rpx;
303   font-size: 28rpx;
304 }
305 .order-price.bought{
306   background-color: #ccc;
307 }
308 /* cosmo */
309
310 .cosmo .cosmo-nav, .cosmo-nav image {
311   width: 100%;
312   height: 870rpx;
313   border-radius: 0;
314 }
315
316 .horizon {
317   height: 220rpx;
318   padding: 10rpx 0rpx;
319   /* width: 100%; */
320   position: absolute;
321   bottom: 0;
322   left: 0;
323   /* white-space: nowrap;
324   display: flex;
325   flex-direction: row; */
326 }
327
328 .cosmo .list-container {
329   height: 220rpx;
330   display: flex;
331   flex-direction: row;
332   margin: 0 5px;
333   align-items: center;
334 }
335
336 .cosmo .item-container, .cosmo .items {
337   width: 200rpx;
338   height: 200rpx;
339   min-width: 0;
340   position: relative;
341 }
342
343 .cosmo .hide-btn {
344   width: 100rpx;
345   height: 100rpx;
346 }
347
348 .cosmo .items {
349   text-align: center;
350 }
351
352 .cosmo .goods-item-img {
353   width: 160rpx;
354   height: 160rpx;
355   padding-bottom: 0;
356 }
357
358 .cosmo .goods-item-title {
359   font-size: 10px;
360   width: 160rpx;
361   padding: 0;
362   margin-bottom: 0;
363   overflow: hidden;
364   text-overflow: ellipsis;
365   white-space: nowrap;
366 }
367
368 /*  */
369 .union-list{
370   border-top: 1rpx solid #ddd;
371   border-bottom: 1rpx solid #ddd;
372   margin: 20rpx 10rpx;
373   /* max-height: 600rpx;
374   overflow: auto; */
375 }
376 .union-item {
377   display: flex;
378   flex-direction: row;
379   /* justify-content: space-between; */
380   line-height: 60rpx;
381   align-items: center;
382   padding: 25rpx;
383   background-color: #fff;
384   position: relative;
385 }
386 .union-item+.union-item {
387   border-top: 1rpx solid #ddd;
388 }
389 .union-list .item-img {
390   width: 150rpx;
391   height: 150rpx;
392   margin-right: 20rpx;
393 }
394
395 .union-list .item {
396   line-height: 50rpx;
397   flex: 1;
398   /*height: 150rpx;*/
399 }
400 .union-list .item-text{
401   max-width: 500rpx;
402 }
403 .union-list .item-title{
404   font-size: 32rpx;
405   font-weight: bold;
406 }
407 .union-list .selected{
408   color: #00b26a;
409 }
410
411 .union-list  .no-item{
412   height: 400rpx;
413 }
414 .clear-btn{
415   padding: 0;
416 }
417 .banner-item{
418   position: relative;
419 }
420 .video-play{
421   position: absolute;
422   left: 50%;
423   top: 50%;
424   transform: translate(-50%,-50%);
425   font-size: 48px;
426   color: #333;
427 }
428 /* .img-info{
429   position: absolute;
430   left: 50%;
431   top:50%;
432   transform: translate(-50%,-50%);
433   font-size: 36rpx;
434   padding: 12rpx 30rpx;
435   background-color: #333;
436   opacity: 0.8;
437   color: #fff;
438   border-radius: 40rpx;
439
440 } */