@woosmap/ui 4.24.0 → 4.26.0
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.
- package/package.json +1 -1
- package/src/components/Demo/skeletondemo.styl +290 -290
- package/src/components/UseCase/UseCase.js +1 -0
- package/src/components/UseCase/UseCase.stories.js +13 -7
- package/src/components/UseCase/UseCase.styl +18 -8
- package/src/images/usecases/address-autocomplete.png +0 -0
- package/src/images/usecases/ecommerce-checkout.png +0 -0
- package/src/images/usecases/fleet-tracking.png +0 -0
- package/src/images/usecases/geocoding.png +0 -0
- package/src/images/usecases/indoor-mapping.png +0 -0
- package/src/images/usecases/product-locator.png +0 -0
- package/src/images/usecases/products.png +0 -0
- package/src/images/usecases/store-locator.png +0 -0
package/package.json
CHANGED
|
@@ -1,295 +1,295 @@
|
|
|
1
1
|
|
|
2
2
|
.demo
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
3
|
+
fullwh()
|
|
4
|
+
margin auto
|
|
5
|
+
color $secondary
|
|
6
|
+
line-height 2.2rem
|
|
7
|
+
.title
|
|
8
|
+
font-size $title3
|
|
9
|
+
pre
|
|
10
|
+
code
|
|
11
|
+
font-size $fontSizeDemo - .1
|
|
12
|
+
&__header
|
|
13
|
+
fullw()
|
|
14
|
+
position relative
|
|
15
|
+
&__content
|
|
16
|
+
fullw()
|
|
17
|
+
br()
|
|
18
|
+
font-size $fontSizeDemo
|
|
19
|
+
overflow hidden
|
|
20
|
+
position relative
|
|
21
|
+
// box-shadow 0 0 3rem rgba($logo2, .15)
|
|
22
|
+
box-shadow 0 .3rem 1rem rgba($secondary, .15)
|
|
23
|
+
.demo--merchant &
|
|
24
|
+
border .1rem solid $light
|
|
25
|
+
|
|
26
|
+
&__showcase
|
|
27
|
+
&__data
|
|
28
|
+
display flex
|
|
29
|
+
background-color $light
|
|
30
|
+
&__filters
|
|
31
|
+
border-right .1rem solid rgba($secondary, .1)
|
|
32
|
+
padding $demoPadding + .4 $demoPadding
|
|
33
|
+
width $demofilterWidth
|
|
34
|
+
background-color $light// rgba($logo2, .82)
|
|
35
|
+
padding-bottom 2.6rem
|
|
36
|
+
mbib(1.6)
|
|
37
|
+
.demo--localities--uk &
|
|
38
|
+
.demo--localities--fr &
|
|
39
|
+
border 0
|
|
40
|
+
width auto
|
|
41
|
+
flex-grow 1
|
|
42
|
+
&__data
|
|
43
|
+
max-height 45rem
|
|
44
|
+
border-top .1rem solid rgba($secondary, .1)
|
|
45
|
+
.demo--localities--uk &
|
|
46
|
+
.demo--localities--fr &
|
|
47
|
+
max-height unset
|
|
48
|
+
.demo--localities--uk &
|
|
49
|
+
height 54rem
|
|
50
|
+
.demo--localities--fr &
|
|
51
|
+
height 38rem
|
|
52
|
+
&__showcase
|
|
53
|
+
min-height 50rem
|
|
54
|
+
max-height 71rem
|
|
55
|
+
.demo--localities--uk &
|
|
56
|
+
.demo--localities--fr &
|
|
57
|
+
position relative
|
|
58
|
+
z-index 100
|
|
59
|
+
min-height unset
|
|
60
|
+
max-height unset
|
|
61
|
+
&__map
|
|
62
|
+
display flex
|
|
63
|
+
align-items center
|
|
64
|
+
justify-content center
|
|
65
|
+
flex-grow 1
|
|
66
|
+
background-color $light
|
|
67
|
+
.map
|
|
68
|
+
width 100%
|
|
69
|
+
height 100%
|
|
70
|
+
background-color $inputDemoBgColor
|
|
71
|
+
&__results
|
|
72
|
+
inputFont()
|
|
73
|
+
width $demofilterWidth
|
|
74
|
+
display flex
|
|
75
|
+
flex-direction column
|
|
76
|
+
border-right .1rem solid rgba($secondary, .1)
|
|
77
|
+
flex-shrink 0
|
|
78
|
+
&__header
|
|
79
|
+
display flex
|
|
80
|
+
align-items center
|
|
81
|
+
flex-shrink 0
|
|
82
|
+
font-size $fontSizeDemo - .1
|
|
83
|
+
padding 0 $demoPadding
|
|
84
|
+
height $footerDemoHeight
|
|
85
|
+
background-color $inputDemoBgColor
|
|
86
|
+
font-weight 600
|
|
87
|
+
&__content
|
|
88
|
+
font-weight 400
|
|
89
|
+
color $textColor
|
|
90
|
+
padding $demoPadding
|
|
91
|
+
background-color $light
|
|
92
|
+
overflow-y auto
|
|
93
|
+
&__code
|
|
94
|
+
inputFont()
|
|
95
|
+
width 100%
|
|
96
|
+
&__input-container
|
|
97
|
+
mbib(.6)
|
|
98
|
+
&--inline
|
|
99
|
+
.demo--localities--uk &
|
|
100
|
+
mbib(1.6)
|
|
101
|
+
&__label
|
|
102
|
+
inputFont()
|
|
103
|
+
font-size $inputFontSizeDemo
|
|
104
|
+
font-weight 600
|
|
105
|
+
margin-bottom .6rem
|
|
106
106
|
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
107
|
+
input
|
|
108
|
+
&:not([type=button]):not([type=checkbox]):not([type=radio]):not([type=textarea])
|
|
109
|
+
inputFont()
|
|
110
|
+
br($demoBr)
|
|
111
|
+
background-color $inputDemoBgColor !important
|
|
112
|
+
border-color $inputDemoBorderColor
|
|
113
|
+
font-size $inputFontSizeDemo !important
|
|
114
|
+
height $inputDemoHeight
|
|
115
|
+
padding 0 1rem 0 1rem
|
|
116
|
+
.mbi
|
|
117
|
+
mbi(.6)
|
|
118
|
+
.input
|
|
119
|
+
&__label
|
|
120
|
+
inputFont()
|
|
121
|
+
font-size $inputFontSizeDemo !important
|
|
122
|
+
.select
|
|
123
|
+
.asyncselect
|
|
124
|
+
&__control
|
|
125
|
+
inputFont()
|
|
126
|
+
font-size $inputFontSizeDemo !important
|
|
127
|
+
border-radius $demoBr !important
|
|
128
|
+
background-color $inputDemoBgColor !important
|
|
129
|
+
min-height $inputDemoHeight !important
|
|
130
|
+
height auto !important
|
|
131
|
+
&:not(.select__control--is-focused):not(.asyncselect__control--is-focused)
|
|
132
|
+
border-color $inputDemoBorderColor !important
|
|
133
|
+
.css-g1d714-ValueContainer
|
|
134
|
+
.css-tlfecz-indicatorContainer
|
|
135
|
+
padding 0
|
|
136
|
+
.css-g1d714-ValueContainer
|
|
137
|
+
height 100%
|
|
138
|
+
.css-tlfecz-indicatorContainer
|
|
139
|
+
cursor pointer
|
|
140
|
+
input
|
|
141
|
+
&:not([type=button]):not([type=checkbox]):not([type=radio]):not([type=textarea])
|
|
142
|
+
&.select
|
|
143
|
+
&.asyncselect
|
|
144
|
+
&__input
|
|
145
|
+
background-color unset !important
|
|
146
|
+
height auto !important
|
|
147
|
+
&__placeholder
|
|
148
|
+
color $inputDemoPlaceholderColor
|
|
149
|
+
&__dropdown-indicator
|
|
150
|
+
&__clear-indicator
|
|
151
|
+
padding 0
|
|
152
|
+
&__value-container
|
|
153
|
+
padding-left .6rem !important
|
|
154
|
+
&__indicator
|
|
155
|
+
padding-left .5rem !important
|
|
156
|
+
padding-right .5rem !important
|
|
157
|
+
svg
|
|
158
|
+
fill $activeColor
|
|
159
|
+
&__indicator-separator
|
|
160
|
+
background-color $activeColor
|
|
161
|
+
&__multi-value
|
|
162
|
+
background-color $activeColorDark !important
|
|
163
|
+
&__label
|
|
164
|
+
inputFont() !important
|
|
165
|
+
height 2.1rem
|
|
166
|
+
line-height 1.1rem
|
|
167
|
+
font-size $inputFontSizeDemo - .1 !important
|
|
168
|
+
&__remove
|
|
169
|
+
padding .2rem !important
|
|
170
|
+
|
|
171
|
+
.flag
|
|
172
|
+
width 1.6rem
|
|
173
|
+
height 1.1rem
|
|
174
|
+
&__option
|
|
175
|
+
padding .6rem
|
|
176
|
+
.flag
|
|
177
|
+
margin 0 .6rem 0 0
|
|
178
|
+
&--is-selected
|
|
179
|
+
color $light !important
|
|
180
|
+
background-color #819cb9 !important
|
|
181
|
+
&.select__option--is-focused
|
|
182
|
+
color $light !important
|
|
183
|
+
background-color #819cb9 !important
|
|
184
|
+
&--is-focused:not(.select__option--is-selected)
|
|
185
|
+
background-color #cddbeb !important
|
|
186
|
+
color $secondary !important
|
|
187
|
+
|
|
188
|
+
&__filters
|
|
189
|
+
.btn
|
|
190
|
+
br(.2)
|
|
191
|
+
font-size $inputFontSizeDemo !important
|
|
192
|
+
line-height 2.2rem
|
|
193
|
+
padding 0 .8rem
|
|
194
|
+
height $inputDemoHeight
|
|
195
|
+
inputFont()
|
|
196
|
+
border-color $inputDemoBorderColor
|
|
197
|
+
.active
|
|
198
|
+
&--primary
|
|
199
|
+
background-color $activeColor
|
|
200
|
+
border-color $activeColor
|
|
201
|
+
&--group
|
|
202
|
+
height 2.8rem
|
|
203
|
+
&-container
|
|
204
|
+
color $inputDemoBgColor
|
|
205
|
+
.btn
|
|
206
|
+
padding 0 .8rem
|
|
207
|
+
&:first-child
|
|
208
|
+
border-radius 2rem 0 0 2rem
|
|
209
|
+
&:last-child
|
|
210
|
+
border-radius 0 2rem 2rem 0
|
|
211
|
+
&--light
|
|
212
|
+
.btn.active
|
|
213
|
+
background-color $activeColorDark
|
|
214
|
+
border-color $activeColorDark
|
|
215
|
+
color $inputDemoBgColor
|
|
216
|
+
&:hover
|
|
217
|
+
background-color $activeColorDark
|
|
218
|
+
&.language
|
|
219
|
+
&.transportation
|
|
220
|
+
mbi(.6)
|
|
221
|
+
.btn
|
|
222
|
+
border-radius .3rem !important
|
|
223
|
+
border 0
|
|
224
|
+
height 2.2rem
|
|
225
|
+
padding .4rem
|
|
226
|
+
&.active
|
|
227
|
+
background-color $light
|
|
228
|
+
box-shadow 0 0 .1rem .1rem $activeColorDark
|
|
229
|
+
.flag
|
|
230
|
+
width 2.4rem
|
|
231
|
+
height 1.6rem
|
|
232
|
+
&.transportation
|
|
233
|
+
.btn
|
|
234
|
+
height 2.8rem
|
|
235
|
+
img
|
|
236
|
+
max-width 2.4rem
|
|
237
|
+
&__code
|
|
238
|
+
.tab
|
|
239
|
+
&__header
|
|
240
|
+
height $footerDemoHeight
|
|
241
|
+
background-color $inputDemoBgColor
|
|
242
|
+
&__content
|
|
243
|
+
padding $demoPadding
|
|
244
|
+
overflow auto
|
|
245
|
+
max-height 40rem
|
|
246
|
+
.demo--localities--uk &
|
|
247
|
+
max-height 49rem
|
|
248
|
+
.demo--localities--fr &
|
|
249
|
+
max-height 33rem
|
|
250
|
+
&--address
|
|
251
|
+
&--localitiesaddress
|
|
252
|
+
&__formcontainer
|
|
253
|
+
position relative
|
|
254
|
+
|
|
255
|
+
&--address
|
|
256
|
+
&__formcontainer
|
|
257
|
+
.input
|
|
258
|
+
&__label
|
|
259
|
+
margin-bottom .4rem
|
|
260
|
+
&__line
|
|
261
|
+
margin-bottom 1rem
|
|
262
|
+
&--localities--uk
|
|
263
|
+
&--localities--fr
|
|
264
|
+
&__formcontainer
|
|
265
|
+
mbib(1.6)
|
|
266
|
+
position relative
|
|
267
|
+
.input__label
|
|
268
|
+
font-weight 600
|
|
269
|
+
.overlay
|
|
270
|
+
position absolute
|
|
271
|
+
top 0
|
|
272
|
+
left 0
|
|
273
|
+
z-index 10
|
|
274
|
+
width 100%
|
|
275
|
+
height 100%
|
|
276
|
+
background-color $light70
|
|
277
277
|
@media screen and (max-width 769px)
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
278
|
+
.demo__showcase
|
|
279
|
+
max-height 100%
|
|
280
|
+
min-height auto
|
|
281
281
|
@media screen and (max-width 696px)
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
282
|
+
.demo
|
|
283
|
+
&__data
|
|
284
|
+
&__showcase
|
|
285
|
+
flex-direction column
|
|
286
|
+
max-height 100%
|
|
287
|
+
&__results
|
|
288
|
+
&__filters
|
|
289
|
+
width auto
|
|
290
|
+
border-bottom .1rem solid rgba($secondary, .1)
|
|
291
|
+
border-right 0
|
|
292
|
+
&__map
|
|
293
|
+
height 32rem
|
|
294
|
+
.demo--merchant &
|
|
295
|
+
height auto
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import UseCase from './UseCase';
|
|
3
3
|
import Icon from '../Icon/Icon';
|
|
4
|
+
import Button from '../Button/Button';
|
|
4
5
|
import { tr } from '../utils/locale';
|
|
5
6
|
|
|
6
7
|
const Story = {
|
|
@@ -12,11 +13,17 @@ export default Story;
|
|
|
12
13
|
|
|
13
14
|
const Template = () => (
|
|
14
15
|
<div className="mbib flex-column">
|
|
15
|
-
<UseCase isSelectable useCaseStory="
|
|
16
|
+
<UseCase isSelectable useCaseStory="products">
|
|
16
17
|
<div className="use-case__header">Store Locator</div>
|
|
17
|
-
<div className="use-case__body">
|
|
18
|
+
<div className="use-case__body">
|
|
19
|
+
Help your visitors searching for your stores and increase your store footfall
|
|
20
|
+
</div>
|
|
18
21
|
<div className="use-case__footer">
|
|
19
|
-
<
|
|
22
|
+
<div className="use-case__product-item ready">
|
|
23
|
+
<Icon icon="big-commerce" />
|
|
24
|
+
<span className="use-case__product-item__name">{tr('BigCommerce ready')}</span>
|
|
25
|
+
</div>
|
|
26
|
+
<span className="title">Products :</span>
|
|
20
27
|
<UseCase.Footer
|
|
21
28
|
products={[
|
|
22
29
|
{ id: 'INDOOR', name: 'Indoor' },
|
|
@@ -27,10 +34,9 @@ const Template = () => (
|
|
|
27
34
|
{ id: 'ADDRESS', name: 'Address' },
|
|
28
35
|
]}
|
|
29
36
|
/>
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
</div>
|
|
37
|
+
</div>
|
|
38
|
+
<div className="use-case__cta">
|
|
39
|
+
<Button label={tr('Create a project')} />
|
|
34
40
|
</div>
|
|
35
41
|
</UseCase>
|
|
36
42
|
</div>
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
.use-case
|
|
2
2
|
box()
|
|
3
|
-
width
|
|
3
|
+
width 100%
|
|
4
|
+
max-width 96rem
|
|
5
|
+
margin 0 auto 4rem auto
|
|
4
6
|
transition .2s all
|
|
5
7
|
display flex
|
|
6
8
|
overflow hidden
|
|
@@ -16,12 +18,14 @@
|
|
|
16
18
|
&:hover
|
|
17
19
|
border .1rem solid $success2
|
|
18
20
|
&__image
|
|
19
|
-
min-
|
|
21
|
+
min-height 40rem
|
|
22
|
+
min-width 60rem
|
|
20
23
|
background-size cover
|
|
21
24
|
background-repeat no-repeat
|
|
22
25
|
background-position center
|
|
23
26
|
&__content
|
|
24
|
-
height
|
|
27
|
+
height auto
|
|
28
|
+
padding 3rem
|
|
25
29
|
padding 2rem 2.4rem
|
|
26
30
|
display flex
|
|
27
31
|
flex-direction column
|
|
@@ -49,16 +53,21 @@
|
|
|
49
53
|
&--indoorMapping
|
|
50
54
|
.use-case__image
|
|
51
55
|
background-image url('../../images/usecases/indoor-mapping.png')
|
|
56
|
+
&--products
|
|
57
|
+
.use-case__image
|
|
58
|
+
background-image url('../../images/usecases/products.png')
|
|
52
59
|
&__header
|
|
53
|
-
text-align center
|
|
54
60
|
font-size $title
|
|
61
|
+
font-weight 600
|
|
55
62
|
margin-bottom 2rem
|
|
56
63
|
&__body
|
|
57
|
-
|
|
64
|
+
font-size $title4
|
|
58
65
|
margin-bottom 2rem
|
|
59
66
|
&__footer
|
|
60
67
|
flex-grow 1
|
|
61
|
-
|
|
68
|
+
display flex
|
|
69
|
+
align-items flex-start
|
|
70
|
+
flex-direction column
|
|
62
71
|
&__cta
|
|
63
72
|
margin 2rem 0 0 0
|
|
64
73
|
&__product-item
|
|
@@ -74,9 +83,10 @@
|
|
|
74
83
|
font-weight 600
|
|
75
84
|
.title
|
|
76
85
|
margin-bottom 1rem
|
|
77
|
-
|
|
86
|
+
color $dark30
|
|
87
|
+
font-size $fontSizeSmall - .1
|
|
78
88
|
.ready
|
|
79
89
|
box()
|
|
80
90
|
background-color $light
|
|
81
91
|
padding .4rem 1rem
|
|
82
|
-
margin 0 0
|
|
92
|
+
margin 0 0 4rem 0
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|