|
@@ -7,6 +7,7 @@ |
|
@@ -7,6 +7,7 @@ |
7
|
position: absolute;
|
7
|
position: absolute;
|
8
|
top: 50%;
|
8
|
top: 50%;
|
9
|
margin-top: -14rem / $pxConvertRem;
|
9
|
margin-top: -14rem / $pxConvertRem;
|
|
|
10
|
+ margin-left: 20rem / $pxConvertRem;
|
10
|
font-size: 28rem / $pxConvertRem;
|
11
|
font-size: 28rem / $pxConvertRem;
|
11
|
color: #f0f0f0;
|
12
|
color: #f0f0f0;
|
12
|
|
13
|
|
|
@@ -15,9 +16,40 @@ |
|
@@ -15,9 +16,40 @@ |
15
|
}
|
16
|
}
|
16
|
}
|
17
|
}
|
17
|
|
18
|
|
|
|
19
|
+ .few-tag{
|
|
|
20
|
+ width: 132rem / $pxConvertRem;
|
|
|
21
|
+ position: absolute;
|
|
|
22
|
+ left: 100rem / $pxConvertRem;
|
|
|
23
|
+ text-align: center;
|
|
|
24
|
+ top: 75%;
|
|
|
25
|
+ color: #fff;
|
|
|
26
|
+ }
|
|
|
27
|
+
|
|
|
28
|
+ .gift-tag {
|
|
|
29
|
+ background-color: #88BE51;
|
|
|
30
|
+ }
|
|
|
31
|
+
|
|
|
32
|
+ .plus-tag {
|
|
|
33
|
+ background-color: #FC1264;
|
|
|
34
|
+ }
|
|
|
35
|
+
|
|
|
36
|
+ .few-tag-expire {
|
|
|
37
|
+ position: absolute;
|
|
|
38
|
+ top: 40%;
|
|
|
39
|
+ left: 20rem / $pxConvertRem;
|
|
|
40
|
+ background-color: #7f7f7f;
|
|
|
41
|
+ display: inline-block;
|
|
|
42
|
+ color: #fff;
|
|
|
43
|
+ border-radius: 12rem / $pxConvertRem;
|
|
|
44
|
+ padding: 4rem / $pxConvertRem;
|
|
|
45
|
+ font-size: 20rem / $pxConvertRem;
|
|
|
46
|
+ width: 48rem / $pxConvertRem;
|
|
|
47
|
+ text-align: center;
|
|
|
48
|
+ }
|
|
|
49
|
+
|
18
|
.info {
|
50
|
.info {
|
19
|
float: left;
|
51
|
float: left;
|
20
|
- margin-left: 30rem / $pxConvertRem;
|
52
|
+ margin-left: 60rem / $pxConvertRem;
|
21
|
padding: 16rem / $pxConvertRem 0;
|
53
|
padding: 16rem / $pxConvertRem 0;
|
22
|
padding-right: 20rem / $pxConvertRem;
|
54
|
padding-right: 20rem / $pxConvertRem;
|
23
|
}
|
55
|
}
|
|
@@ -32,13 +64,18 @@ |
|
@@ -32,13 +64,18 @@ |
32
|
|
64
|
|
33
|
.deps {
|
65
|
.deps {
|
34
|
margin-left: 173rem / $pxConvertRem;
|
66
|
margin-left: 173rem / $pxConvertRem;
|
35
|
- padding-bottom: 60rem / $pxConvertRem;
|
67
|
+ padding-bottom: 72rem / $pxConvertRem;
|
36
|
border-bottom: 1px solid #e0e0e0;
|
68
|
border-bottom: 1px solid #e0e0e0;
|
|
|
69
|
+ width: 380rem / $pxConvertRem;
|
|
|
70
|
+ position: relative;
|
|
|
71
|
+ min-height: 140rem / $pxConvertRem;
|
37
|
}
|
72
|
}
|
38
|
|
73
|
|
39
|
.name {
|
74
|
.name {
|
40
|
font-size: 28rem / $pxConvertRem;
|
75
|
font-size: 28rem / $pxConvertRem;
|
41
|
color: #5a5a5a;
|
76
|
color: #5a5a5a;
|
|
|
77
|
+ width: 80%;
|
|
|
78
|
+ display: inline-block;
|
42
|
}
|
79
|
}
|
43
|
|
80
|
|
44
|
.row:nth-child(2) {
|
81
|
.row:nth-child(2) {
|
|
@@ -71,9 +108,13 @@ |
|
@@ -71,9 +108,13 @@ |
71
|
}
|
108
|
}
|
72
|
|
109
|
|
73
|
.count {
|
110
|
.count {
|
74
|
- font-size: 20rem / $pxConvertRem;
|
111
|
+ font-size: 32rem / $pxConvertRem;
|
75
|
color: #999;
|
112
|
color: #999;
|
76
|
- margin-left: 22rem / $pxConvertRem;
|
113
|
+ //margin-left: 22rem / $pxConvertRem;
|
|
|
114
|
+ display: inline-block;
|
|
|
115
|
+ width: 19%;
|
|
|
116
|
+ position: absolute;
|
|
|
117
|
+ text-align: center;
|
77
|
}
|
118
|
}
|
78
|
|
119
|
|
79
|
.sold-out, .low-stocks {
|
120
|
.sold-out, .low-stocks {
|
|
@@ -181,15 +222,15 @@ |
|
@@ -181,15 +222,15 @@ |
181
|
font-size: 40rem / $pxConvertRem;
|
222
|
font-size: 40rem / $pxConvertRem;
|
182
|
line-height: 60rem / $pxConvertRem;
|
223
|
line-height: 60rem / $pxConvertRem;
|
183
|
text-align: center;
|
224
|
text-align: center;
|
184
|
-
|
225
|
+
|
185
|
}
|
226
|
}
|
186
|
&:last-child {
|
227
|
&:last-child {
|
187
|
span{
|
228
|
span{
|
188
|
width: 168rem / $pxConvertRem;
|
229
|
width: 168rem / $pxConvertRem;
|
189
|
overflow: hidden;
|
230
|
overflow: hidden;
|
190
|
font-size: 48em / $pxConvertRem;
|
231
|
font-size: 48em / $pxConvertRem;
|
191
|
- text-overflow:ellipsis;
|
|
|
192
|
- white-space:nowrap;
|
232
|
+ text-overflow:ellipsis;
|
|
|
233
|
+ white-space:nowrap;
|
193
|
}
|
234
|
}
|
194
|
}
|
235
|
}
|
195
|
}
|
236
|
}
|
|
@@ -205,7 +246,6 @@ |
|
@@ -205,7 +246,6 @@ |
205
|
top: 20rem / $pxConvertRem;;
|
246
|
top: 20rem / $pxConvertRem;;
|
206
|
font-size: 52em / $pxConvertRem;
|
247
|
font-size: 52em / $pxConvertRem;
|
207
|
}
|
248
|
}
|
208
|
-
|
|
|
209
|
}
|
249
|
}
|
210
|
}
|
250
|
}
|
211
|
|
251
|
|