s-material-react 2.2.42 → 2.2.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,10 +1,6 @@
1
- .placeOrder-chooseAddress {
2
- background: #fff;
3
- margin: 0 12px;
4
- padding-bottom: 8px;
5
- // height: 58px;
6
- border-bottom: 1px solid #dddddd;
1
+ $radius: 8px;
7
2
 
3
+ .placeOrder-chooseAddress {
8
4
  .group {
9
5
  display: flex;
10
6
  justify-content: space-between;
@@ -28,14 +24,19 @@
28
24
 
29
25
  .address-info {
30
26
  width: 100%;
31
- display: grid;
32
- grid-template-columns: 25px auto 50px;
27
+
28
+ .left {
29
+ display: flex;
30
+ align-items: center;
31
+ gap: 8px;
32
+ }
33
33
 
34
34
  .left-title {
35
35
  display: flex;
36
- font-size: 14px;
37
- margin: 10px 0 4px 0;
36
+ font-size: 12px;
38
37
  flex-basis: auto;
38
+ color: #333333;
39
+ margin-top: 10px;
39
40
  }
40
41
 
41
42
  .left-padding {
@@ -43,13 +44,18 @@
43
44
  }
44
45
 
45
46
  .left-title-default {
46
- background: #1a1922;
47
+ background: #34C0BC;
47
48
  font-size: 10px;
48
49
  color: #fff;
49
50
  padding: 2px 4px;
50
51
  margin-left: 5px;
51
52
  border-radius: 5px;
52
53
  }
54
+
55
+ .left-detail {
56
+ font-size: 16px;
57
+ margin-right: auto;
58
+ }
53
59
  }
54
60
 
55
61
  .arrow {
@@ -59,17 +65,94 @@
59
65
  }
60
66
  }
61
67
 
68
+ .orderListItem {
69
+ .shop-info-wrap {
70
+ display: flex;
71
+ align-items: center;
72
+ gap: 8px;
73
+ margin-bottom: 12px;
74
+ }
75
+
76
+ .good-name{
77
+ font-size: 14px;
78
+ color: #333;
79
+ }
80
+
81
+ .shop-info-price {
82
+ color: #FF2D1E;
83
+ font-size: 16px;
84
+ }
85
+
86
+ .shop-name {
87
+ font-size: 16px;
88
+ color: #333;
89
+ overflow: hidden;
90
+ text-overflow: ellipsis;
91
+ white-space: nowrap;
92
+ }
93
+
94
+ .card-item {
95
+ grid-template-columns: 100px 1fr;
96
+ margin-bottom: 0;
97
+ }
98
+
99
+ .card-item-img {
100
+ height: 100px;
101
+ width: 100px;
102
+ }
103
+ }
104
+
62
105
  .place-order-goods {
106
+ padding: 15px 15px 0;
63
107
  margin: 12px 12px 0;
108
+ border-radius: $radius $radius 0 0;
64
109
  background: #fff;
65
- border-bottom: 1px solid #dddddd;
110
+
111
+ .shop-info-wrap {
112
+ display: flex;
113
+ align-items: center;
114
+ gap: 8px;
115
+ margin-bottom: 12px;
116
+ }
117
+
118
+ .good-name{
119
+ font-size: 14px;
120
+ color: #333;
121
+ }
122
+
123
+ .shop-info-price {
124
+ color: #FF2D1E;
125
+ font-size: 16px;
126
+ }
127
+
128
+ .shop-name {
129
+ font-size: 16px;
130
+ color: #333;
131
+ overflow: hidden;
132
+ text-overflow: ellipsis;
133
+ white-space: nowrap;
134
+ }
135
+
136
+ .card-item {
137
+ grid-template-columns: 100px 1fr;
138
+ margin-bottom: 0;
139
+ }
140
+
141
+ .card-item-img {
142
+ height: 100px;
143
+ width: 100px;
144
+ }
66
145
  }
67
146
 
68
147
  .placeOrder-blcWrap {
69
148
  margin: 0 12px;
70
- padding: 12px 0;
149
+ padding: 15px 15px 0;
71
150
  background-color: #fff;
72
- border-bottom: 1px solid #dddddd;
151
+
152
+ &.price {
153
+ border-radius: $radius;
154
+ padding: 15px;
155
+ }
73
156
 
74
157
  .content {
75
158
  width: 240px;
@@ -95,12 +178,16 @@
95
178
  margin-bottom: 0;
96
179
  }
97
180
 
181
+ &.express {
182
+ font-size: 14px;
183
+ }
184
+
98
185
  .label {
99
186
  color: #333;
100
187
  }
101
188
 
102
189
  .value {
103
- color: #a7a7a7;
190
+ color: #333;
104
191
 
105
192
  .icon {
106
193
  width: 6px;
@@ -127,7 +214,12 @@
127
214
 
128
215
  .price {
129
216
  font-size: 14px;
130
- color: #333333;
217
+ color: #34C0BC;
218
+ }
219
+
220
+ .price-value {
221
+ font-size: 18px;
222
+ color: #FF2D1E;
131
223
  }
132
224
 
133
225
  .btn {
@@ -145,13 +237,13 @@
145
237
  .coupon-select {
146
238
  background-color: #ffffff;
147
239
  margin: 0 12px;
148
- padding: 12px 0;
240
+ padding: 15px;
149
241
  display: flex;
150
- justify-content: space-between;
242
+ align-items: center;
243
+ border-radius: 0 0 $radius $radius;
151
244
  //display: grid;
152
245
  //grid-template-columns: 52px 1fr;
153
246
  font-size: 14px;
154
- border-bottom: 1px solid #dddddd;
155
247
  .img-fields {
156
248
  width: 100px;
157
249
  height: 100px;
@@ -171,6 +263,16 @@
171
263
  }
172
264
  }
173
265
 
266
+ .pay-mode {
267
+ margin-top: 12px;
268
+ margin-bottom: 12px;
269
+ border-radius: $radius;
270
+ .info {
271
+ margin-left: auto;
272
+ margin-right: 10px;
273
+ }
274
+ }
275
+
174
276
  .info {
175
277
  display: flex;
176
278
  justify-content: space-between;
@@ -188,7 +290,6 @@
188
290
  }
189
291
 
190
292
  .placeOrderAddressTabs {
191
- background-color: #ffffff;
192
293
  margin: 0 12px;
193
294
  border-radius: 8px;
194
295
  overflow: hidden;
@@ -197,7 +298,6 @@
197
298
  display: flex;
198
299
  align-items: center;
199
300
  padding: 12px;
200
- border-bottom: 1px solid #dddddd;
201
301
 
202
302
  .delivery-label {
203
303
  font-size: 14px;
@@ -209,7 +309,7 @@
209
309
  .tabs {
210
310
  flex: 1;
211
311
  display: flex;
212
- height: 50px;
312
+ height: 42px;
213
313
  line-height: 50px;
214
314
 
215
315
  .tabsItem {
@@ -221,7 +321,7 @@
221
321
  text-align: center;
222
322
 
223
323
  &.active {
224
- color: #000000;
324
+ color: #34C0BC;
225
325
  font-weight: 500;
226
326
 
227
327
  .line {
@@ -231,8 +331,8 @@
231
331
 
232
332
  .line {
233
333
  width: 40px;
234
- height: 2px;
235
- background-color: #000000;
334
+ height: 3px;
335
+ background-color: #34C0BC;
236
336
  position: absolute;
237
337
  bottom: 0;
238
338
  left: 50%;
@@ -244,6 +344,8 @@
244
344
  }
245
345
 
246
346
  .content {
247
- width: 100%;
347
+ border-radius: 12px;
348
+ background: #fff;
349
+ padding: 15px 22px;
248
350
  }
249
351
  }