@bonniernews/dn-design-system-web 31.0.1-beta.3 → 31.1.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.
Files changed (19) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/components/teaser-text-on-image/README.md +1 -2
  3. package/components/teaser-text-on-image/teaser-text-on-image.njk +4 -10
  4. package/foundations/variables/gradientsDnDark.scss +9 -9
  5. package/foundations/variables/gradientsDnLight.scss +9 -9
  6. package/foundations/variables/gradientsList.scss +1 -1
  7. package/foundations/variables/shadowsDnDark.scss +7 -7
  8. package/foundations/variables/shadowsDnLight.scss +7 -7
  9. package/foundations/variables/shadowsList.scss +1 -1
  10. package/foundations/variables/typographyList.scss +35 -35
  11. package/foundations/variables/typographyScreenExtraLarge.scss +249 -249
  12. package/foundations/variables/typographyScreenLarge.scss +249 -249
  13. package/foundations/variables/typographyScreenSmall.scss +249 -249
  14. package/package.json +1 -1
  15. package/variables/gradients-dark-mode.json +11 -11
  16. package/variables/gradients-light-mode.json +11 -11
  17. package/variables/gradients-list.json +1 -1
  18. package/variables/shadows-list.json +2 -2
  19. package/variables/typography-list.json +35 -35
package/foundations/variables/typographyScreenSmall.scss CHANGED
@@ -1,387 +1,387 @@
1
1
  $typographyScreenSmall: (
2
- expressive-heading-xxs: (
3
- fontFamily: "DN Serif Headline",
4
- fontSize: 16,
5
- fontWeight: Bold,
6
- letterSpacing: 0,
7
- lineHeight: 1.2
8
- ),
9
- expressive-heading-xs: (
10
- fontFamily: "DN Serif Headline",
11
- fontSize: 18,
12
- fontWeight: Bold,
2
+ expressive-ingress-md: (
3
+ lineHeight: 1.5,
13
4
  letterSpacing: 0,
14
- lineHeight: 1.1
15
- ),
16
- expressive-heading-sm: (
17
5
  fontFamily: "DN Serif Headline",
18
6
  fontSize: 20,
19
- fontWeight: Bold,
20
- letterSpacing: 0,
21
- lineHeight: 1.1
7
+ fontWeight: SemiBold
22
8
  ),
23
- expressive-heading-md: (
24
- fontFamily: "DN Serif Headline",
25
- fontSize: 26,
26
- fontWeight: Bold,
9
+ expressive-body-sm: (
10
+ lineHeight: 1.5,
27
11
  letterSpacing: 0,
28
- lineHeight: 1.1
12
+ fontFamily: "DN Serif Text",
13
+ fontSize: 14,
14
+ fontWeight: Regular
29
15
  ),
30
- expressive-heading-lg: (
31
- fontFamily: "DN Serif Display",
32
- fontSize: 32,
33
- fontWeight: Bold,
16
+ expressive-body-lg: (
17
+ lineHeight: 1.5,
34
18
  letterSpacing: 0,
35
- lineHeight: 1.1
19
+ fontFamily: "DN Serif Text",
20
+ fontSize: 18,
21
+ fontWeight: Regular
36
22
  ),
37
23
  expressive-heading-xl: (
24
+ lineHeight: 1.1,
25
+ letterSpacing: 0,
38
26
  fontFamily: "DN Serif Display",
39
27
  fontSize: 36,
40
- fontWeight: Bold,
41
- letterSpacing: 0,
42
- lineHeight: 1.1
28
+ fontWeight: Bold
43
29
  ),
44
- expressive-body-sm: (
45
- fontFamily: "DN Serif Text",
46
- fontSize: 14,
47
- fontWeight: Regular,
30
+ expressive-heading-xs: (
31
+ lineHeight: 1.1,
48
32
  letterSpacing: 0,
49
- lineHeight: 1.5
33
+ fontFamily: "DN Serif Headline",
34
+ fontSize: 18,
35
+ fontWeight: Bold
50
36
  ),
51
- expressive-body-md: (
52
- fontFamily: "DN Serif Text",
53
- fontSize: 16,
54
- fontWeight: Regular,
37
+ expressive-heading-lg: (
38
+ lineHeight: 1.1,
55
39
  letterSpacing: 0,
56
- lineHeight: 1.5
40
+ fontFamily: "DN Serif Display",
41
+ fontSize: 32,
42
+ fontWeight: Bold
57
43
  ),
58
- expressive-body-lg: (
59
- fontFamily: "DN Serif Text",
60
- fontSize: 18,
61
- fontWeight: Regular,
44
+ expressive-heading-md: (
45
+ lineHeight: 1.1,
62
46
  letterSpacing: 0,
63
- lineHeight: 1.5
47
+ fontFamily: "DN Serif Headline",
48
+ fontSize: 26,
49
+ fontWeight: Bold
64
50
  ),
65
51
  expressive-ingress-sm: (
52
+ lineHeight: 1.5,
53
+ letterSpacing: 0,
66
54
  fontFamily: "DN Serif Text",
67
55
  fontSize: 18,
68
- fontWeight: SemiBold,
56
+ fontWeight: SemiBold
57
+ ),
58
+ expressive-heading-xxs: (
59
+ lineHeight: 1.2,
69
60
  letterSpacing: 0,
70
- lineHeight: 1.5
61
+ fontFamily: "DN Serif Headline",
62
+ fontSize: 16,
63
+ fontWeight: Bold
71
64
  ),
72
- expressive-ingress-md: (
65
+ expressive-heading-sm: (
66
+ lineHeight: 1.1,
67
+ letterSpacing: 0,
73
68
  fontFamily: "DN Serif Headline",
74
69
  fontSize: 20,
75
- fontWeight: SemiBold,
70
+ fontWeight: Bold
71
+ ),
72
+ expressive-body-md: (
73
+ lineHeight: 1.5,
76
74
  letterSpacing: 0,
77
- lineHeight: 1.5
75
+ fontFamily: "DN Serif Text",
76
+ fontSize: 16,
77
+ fontWeight: Regular
78
78
  ),
79
79
  functional-heading-xxs: (
80
+ lineHeight: 1.1,
81
+ letterSpacing: 0,
80
82
  fontFamily: "DN Sans",
81
83
  fontSize: 16,
82
- fontWeight: Bold,
83
- letterSpacing: 0,
84
- lineHeight: 1.1
84
+ fontWeight: Bold
85
85
  ),
86
- functional-heading-xs: (
87
- fontFamily: "DN Sans",
88
- fontSize: 18,
89
- fontWeight: Bold,
86
+ functional-heading-lg: (
87
+ lineHeight: 1.1,
90
88
  letterSpacing: 0,
91
- lineHeight: 1.1
92
- ),
93
- functional-heading-sm: (
94
89
  fontFamily: "DN Sans",
95
- fontSize: 20,
96
- fontWeight: Bold,
97
- letterSpacing: 0,
98
- lineHeight: 1.2
90
+ fontSize: 28,
91
+ fontWeight: Bold
99
92
  ),
100
- functional-heading-md: (
101
- fontFamily: "DN Sans",
102
- fontSize: 24,
103
- fontWeight: Bold,
93
+ functional-heading-xs: (
94
+ lineHeight: 1.1,
104
95
  letterSpacing: 0,
105
- lineHeight: 1.1
106
- ),
107
- functional-heading-lg: (
108
96
  fontFamily: "DN Sans",
109
- fontSize: 28,
110
- fontWeight: Bold,
111
- letterSpacing: 0,
112
- lineHeight: 1.1
97
+ fontSize: 18,
98
+ fontWeight: Bold
113
99
  ),
114
- functional-heading-xl: (
100
+ functional-meta-sm: (
101
+ lineHeight: 1.2,
102
+ letterSpacing: 0.2,
115
103
  fontFamily: "DN Sans",
116
- fontSize: 32,
117
- fontWeight: Bold,
118
- letterSpacing: 0,
119
- lineHeight: 1.1
104
+ fontSize: 10,
105
+ fontWeight: Regular
120
106
  ),
121
107
  functional-label-sm: (
108
+ lineHeight: 1.1,
109
+ letterSpacing: 0.5,
122
110
  fontFamily: "DN Sans",
123
111
  fontSize: 12,
124
- fontWeight: Bold,
125
- letterSpacing: 0.5,
126
- lineHeight: 1.1,
127
- textTransform: uppercase
112
+ textTransform: uppercase,
113
+ fontWeight: Bold
128
114
  ),
129
- functional-label-md: (
115
+ functional-meta-md: (
116
+ lineHeight: 1.2,
117
+ letterSpacing: 0,
130
118
  fontFamily: "DN Sans",
131
- fontSize: 16,
132
- fontWeight: Bold,
119
+ fontSize: 12,
120
+ fontWeight: Regular
121
+ ),
122
+ functional-heading-sm: (
123
+ lineHeight: 1.2,
133
124
  letterSpacing: 0,
134
- lineHeight: 1.1
125
+ fontFamily: "DN Sans",
126
+ fontSize: 20,
127
+ fontWeight: Bold
135
128
  ),
136
129
  functional-body-sm: (
130
+ lineHeight: 1.5,
131
+ letterSpacing: 0,
137
132
  fontFamily: "DN Sans",
138
133
  fontSize: 14,
139
- fontWeight: Regular,
134
+ fontWeight: Regular
135
+ ),
136
+ functional-ingress-md: (
137
+ lineHeight: 1.5,
140
138
  letterSpacing: 0,
141
- lineHeight: 1.5
139
+ fontFamily: "DN Sans",
140
+ fontSize: 20,
141
+ fontWeight: Bold
142
142
  ),
143
143
  functional-body-md: (
144
+ lineHeight: 1.5,
145
+ letterSpacing: 0,
144
146
  fontFamily: "DN Sans",
145
147
  fontSize: 16,
146
- fontWeight: Regular,
147
- letterSpacing: 0,
148
- lineHeight: 1.5
148
+ fontWeight: Regular
149
149
  ),
150
- functional-body-lg: (
151
- fontFamily: "DN Sans",
152
- fontSize: 18,
153
- fontWeight: Regular,
150
+ functional-heading-md: (
151
+ lineHeight: 1.1,
154
152
  letterSpacing: 0,
155
- lineHeight: 1.5
153
+ fontFamily: "DN Sans",
154
+ fontSize: 24,
155
+ fontWeight: Bold
156
156
  ),
157
- functional-meta-sm: (
157
+ functional-label-md: (
158
+ lineHeight: 1.1,
159
+ letterSpacing: 0,
158
160
  fontFamily: "DN Sans",
159
- fontSize: 10,
160
- fontWeight: Regular,
161
- letterSpacing: 0.2,
162
- lineHeight: 1.2
161
+ fontSize: 16,
162
+ fontWeight: Bold
163
163
  ),
164
- functional-meta-md: (
164
+ functional-heading-xl: (
165
+ lineHeight: 1.1,
166
+ letterSpacing: 0,
165
167
  fontFamily: "DN Sans",
166
- fontSize: 12,
167
- fontWeight: Regular,
168
+ fontSize: 32,
169
+ fontWeight: Bold
170
+ ),
171
+ functional-body-lg: (
172
+ lineHeight: 1.5,
168
173
  letterSpacing: 0,
169
- lineHeight: 1.2
174
+ fontFamily: "DN Sans",
175
+ fontSize: 18,
176
+ fontWeight: Regular
170
177
  ),
171
178
  functional-ingress-sm: (
179
+ lineHeight: 1.5,
180
+ letterSpacing: 0,
172
181
  fontFamily: "DN Sans",
173
182
  fontSize: 18,
174
- fontWeight: Bold,
183
+ fontWeight: Bold
184
+ ),
185
+ detail-teaser-large: (
186
+ lineHeight: 1.1,
175
187
  letterSpacing: 0,
176
- lineHeight: 1.5
188
+ fontFamily: "DN Serif Headline",
189
+ fontSize: 26,
190
+ fontWeight: Bold
177
191
  ),
178
- functional-ingress-md: (
192
+ detail-teaser-longlife: (
193
+ lineHeight: 1.2,
194
+ letterSpacing: 0,
179
195
  fontFamily: "DN Sans",
180
196
  fontSize: 20,
181
- fontWeight: Bold,
182
- letterSpacing: 0,
183
- lineHeight: 1.5
197
+ fontWeight: Bold
184
198
  ),
185
- detail-dropcap: (
186
- fontFamily: "DN Serif Display",
187
- fontSize: 52,
188
- fontWeight: Bold,
199
+ detail-teaser-centrerad: (
200
+ lineHeight: 1.1,
189
201
  letterSpacing: 0,
190
- lineHeight: 1
202
+ fontFamily: "DN Serif Display",
203
+ fontSize: 36,
204
+ fontWeight: ExtraBold
191
205
  ),
192
- detail-gameheader: (
193
- fontFamily: "DN Sans",
194
- fontSize: 28,
195
- fontWeight: Bold,
206
+ detail-teaser-standard: (
207
+ lineHeight: 1.2,
196
208
  letterSpacing: 0,
197
- lineHeight: 1.1
209
+ fontFamily: "DN Serif Headline",
210
+ fontSize: 20,
211
+ fontWeight: Bold
198
212
  ),
199
- detail-medryckare: (
200
- fontFamily: "DN Serif Text",
201
- fontSize: 16,
202
- fontWeight: Regular,
213
+ detail-teaser-large-compact: (
214
+ lineHeight: 1.2,
203
215
  letterSpacing: 0,
204
- lineHeight: 1.4
205
- ),
206
- detail-mellanrubrik: (
207
216
  fontFamily: "DN Serif Headline",
208
- fontSize: 22,
209
- fontWeight: Bold,
217
+ fontSize: 20,
218
+ fontWeight: Bold
219
+ ),
220
+ detail-teaser-baotaxl: (
221
+ lineHeight: 1.1,
210
222
  letterSpacing: 0,
211
- lineHeight: 1.2
223
+ fontFamily: "DN Serif Headline",
224
+ fontSize: 32,
225
+ fontWeight: Bold
212
226
  ),
213
- detail-direkt-header: (
227
+ detail-teaser-text-i-bild: (
228
+ lineHeight: 1.1,
229
+ letterSpacing: 0,
214
230
  fontFamily: "DN Serif Display",
215
231
  fontSize: 32,
216
- fontWeight: Regular,
217
- letterSpacing: 0,
218
- lineHeight: 1.1
232
+ fontWeight: Regular
219
233
  ),
220
- detail-teaser-standard: (
221
- fontFamily: "DN Serif Headline",
222
- fontSize: 20,
223
- fontWeight: Bold,
234
+ detail-teaser-large-opinion: (
235
+ lineHeight: 1.2,
224
236
  letterSpacing: 0,
225
- lineHeight: 1.2
226
- ),
227
- detail-teaser-standard-opinion: (
228
237
  fontFamily: "DN Serif Headline",
229
238
  fontSize: 22,
230
- fontWeight: Regular,
231
- letterSpacing: 0,
232
- lineHeight: 1.2,
233
- fontStyle: italic
239
+ fontStyle: italic,
240
+ fontWeight: Regular
234
241
  ),
235
- detail-teaser-standard-compact: (
236
- fontFamily: "DN Serif Headline",
237
- fontSize: 18,
238
- fontWeight: Bold,
242
+ detail-teaser-large-rightcol: (
243
+ lineHeight: 1.2,
239
244
  letterSpacing: 0,
240
- lineHeight: 1.2
245
+ fontFamily: "DN Serif Headline",
246
+ fontSize: 22,
247
+ fontWeight: Bold
241
248
  ),
242
249
  detail-teaser-standard-compact-opinion: (
250
+ lineHeight: 1.2,
251
+ letterSpacing: 0,
243
252
  fontFamily: "DN Serif Headline",
244
253
  fontSize: 18,
245
- fontWeight: Medium,
246
- letterSpacing: 0,
247
- lineHeight: 1.2,
248
- fontStyle: italic
254
+ fontStyle: italic,
255
+ fontWeight: Medium
249
256
  ),
250
- detail-teaser-large: (
251
- fontFamily: "DN Serif Headline",
252
- fontSize: 26,
253
- fontWeight: Bold,
257
+ detail-teaser-twin: (
258
+ lineHeight: 1.2,
254
259
  letterSpacing: 0,
255
- lineHeight: 1.1
256
- ),
257
- detail-teaser-large-compact: (
258
260
  fontFamily: "DN Serif Headline",
259
- fontSize: 20,
260
- fontWeight: Bold,
261
- letterSpacing: 0,
262
- lineHeight: 1.2
261
+ fontSize: 18,
262
+ fontWeight: Bold
263
263
  ),
264
- detail-teaser-storrubrik-opinion: (
264
+ detail-teaser-standard-opinion: (
265
+ lineHeight: 1.2,
266
+ letterSpacing: 0,
265
267
  fontFamily: "DN Serif Headline",
266
- fontSize: 26,
267
- fontWeight: Regular,
268
+ fontSize: 22,
269
+ fontStyle: italic,
270
+ fontWeight: Regular
271
+ ),
272
+ detail-teaser-tipsa: (
273
+ lineHeight: 1.2,
268
274
  letterSpacing: 0,
269
- lineHeight: 1.1,
270
- fontStyle: italic
275
+ fontFamily: "DN Serif Headline",
276
+ fontSize: 18,
277
+ fontWeight: Bold
271
278
  ),
272
279
  detail-teaser-storrubrik: (
280
+ lineHeight: 1.1,
281
+ letterSpacing: 0,
273
282
  fontFamily: "DN Serif Headline",
274
283
  fontSize: 26,
275
- fontWeight: Bold,
276
- letterSpacing: 0,
277
- lineHeight: 1.1
284
+ fontWeight: Bold
278
285
  ),
279
- detail-teaser-twin: (
280
- fontFamily: "DN Serif Headline",
281
- fontSize: 18,
282
- fontWeight: Bold,
286
+ detail-teaser-standard-compact: (
287
+ lineHeight: 1.2,
283
288
  letterSpacing: 0,
284
- lineHeight: 1.2
285
- ),
286
- detail-teaser-tipsa: (
287
289
  fontFamily: "DN Serif Headline",
288
290
  fontSize: 18,
289
- fontWeight: Bold,
290
- letterSpacing: 0,
291
- lineHeight: 1.2
292
- ),
293
- detail-teaser-baotaxl: (
294
- fontFamily: "DN Serif Headline",
295
- fontSize: 32,
296
- fontWeight: Bold,
297
- letterSpacing: 0,
298
- lineHeight: 1.1
291
+ fontWeight: Bold
299
292
  ),
300
- detail-teaser-longlife: (
301
- fontFamily: "DN Sans",
302
- fontSize: 20,
303
- fontWeight: Bold,
293
+ detail-teaser-storrubrik-opinion: (
294
+ lineHeight: 1.1,
304
295
  letterSpacing: 0,
305
- lineHeight: 1.2
296
+ fontFamily: "DN Serif Headline",
297
+ fontSize: 26,
298
+ fontStyle: italic,
299
+ fontWeight: Regular
306
300
  ),
307
- detail-teaser-centrerad: (
308
- fontFamily: "DN Serif Display",
309
- fontSize: 36,
310
- fontWeight: ExtraBold,
301
+ detail-medryckare: (
302
+ lineHeight: 1.4,
311
303
  letterSpacing: 0,
312
- lineHeight: 1.1
304
+ fontFamily: "DN Serif Text",
305
+ fontSize: 16,
306
+ fontWeight: Regular
313
307
  ),
314
- detail-teaser-large-opinion: (
315
- fontFamily: "DN Serif Headline",
316
- fontSize: 22,
317
- fontWeight: Regular,
318
- letterSpacing: 0,
308
+ detail-article-quote: (
319
309
  lineHeight: 1.2,
320
- fontStyle: italic
321
- ),
322
- detail-teaser-text-i-bild: (
323
- fontFamily: "DN Serif Display",
324
- fontSize: 32,
325
- fontWeight: Regular,
326
310
  letterSpacing: 0,
327
- lineHeight: 1.1
328
- ),
329
- detail-teaser-large-rightcol: (
330
311
  fontFamily: "DN Serif Headline",
331
- fontSize: 22,
332
- fontWeight: Bold,
333
- letterSpacing: 0,
334
- lineHeight: 1.2
312
+ fontSize: 20,
313
+ fontWeight: Bold
335
314
  ),
336
315
  detail-article-standard: (
337
- fontFamily: "DN Serif Headline",
338
- fontSize: 26,
339
- fontWeight: Bold,
316
+ lineHeight: 1.1,
340
317
  letterSpacing: 0,
341
- lineHeight: 1.1
342
- ),
343
- detail-article-opinion: (
344
318
  fontFamily: "DN Serif Headline",
345
319
  fontSize: 26,
346
- fontWeight: Regular,
320
+ fontWeight: Bold
321
+ ),
322
+ detail-article-direkt: (
323
+ lineHeight: 1.2,
347
324
  letterSpacing: 0,
348
- lineHeight: 1.1,
349
- fontStyle: italic
325
+ fontFamily: "DN Serif Headline",
326
+ fontSize: 20,
327
+ fontWeight: Bold
350
328
  ),
351
329
  detail-article-longread: (
330
+ lineHeight: 1.1,
331
+ letterSpacing: 0,
352
332
  fontFamily: "DN Serif Headline",
353
333
  fontSize: 32,
354
- fontWeight: Regular,
355
- letterSpacing: 0,
356
- lineHeight: 1.1
334
+ fontWeight: Regular
357
335
  ),
358
336
  detail-article-longread-premium: (
337
+ lineHeight: 1.1,
338
+ letterSpacing: 0,
359
339
  fontFamily: "DN Serif Display",
360
340
  fontSize: 32,
361
- fontWeight: Bold,
362
- letterSpacing: 0,
363
- lineHeight: 1.1
341
+ fontWeight: Bold
364
342
  ),
365
- detail-article-direkt: (
343
+ detail-article-direct-opinion: (
344
+ lineHeight: 1.2,
345
+ letterSpacing: 0,
366
346
  fontFamily: "DN Serif Headline",
367
347
  fontSize: 20,
368
- fontWeight: Bold,
348
+ fontStyle: italic,
349
+ fontWeight: Regular
350
+ ),
351
+ detail-article-opinion: (
352
+ lineHeight: 1.1,
369
353
  letterSpacing: 0,
370
- lineHeight: 1.2
354
+ fontFamily: "DN Serif Headline",
355
+ fontSize: 26,
356
+ fontStyle: italic,
357
+ fontWeight: Regular
371
358
  ),
372
- detail-article-direct-opinion: (
359
+ detail-mellanrubrik: (
360
+ lineHeight: 1.2,
361
+ letterSpacing: 0,
373
362
  fontFamily: "DN Serif Headline",
374
- fontSize: 20,
375
- fontWeight: Regular,
363
+ fontSize: 22,
364
+ fontWeight: Bold
365
+ ),
366
+ detail-direkt-header: (
367
+ lineHeight: 1.1,
376
368
  letterSpacing: 0,
377
- lineHeight: 1.2,
378
- fontStyle: italic
369
+ fontFamily: "DN Serif Display",
370
+ fontSize: 32,
371
+ fontWeight: Regular
379
372
  ),
380
- detail-article-quote: (
381
- fontFamily: "DN Serif Headline",
382
- fontSize: 20,
383
- fontWeight: Bold,
373
+ detail-gameheader: (
374
+ lineHeight: 1.1,
384
375
  letterSpacing: 0,
385
- lineHeight: 1.2
376
+ fontFamily: "DN Sans",
377
+ fontSize: 28,
378
+ fontWeight: Bold
379
+ ),
380
+ detail-dropcap: (
381
+ lineHeight: 1,
382
+ letterSpacing: 0,
383
+ fontFamily: "DN Serif Display",
384
+ fontSize: 52,
385
+ fontWeight: Bold
386
386
  )
387
387
  );
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bonniernews/dn-design-system-web",
3
- "version": "31.0.1-beta.3",
3
+ "version": "31.1.0",
4
4
  "description": "DN design system for web.",
5
5
  "type": "module",
6
6
  "homepage": "https://github.com/BonnierNews/dn-design-system/tree/main/web/src#readme",
package/variables/gradients-dark-mode.json CHANGED
@@ -1,35 +1,35 @@
1
1
  {
2
- "content-fade-left": {
2
+ "content-fade-up": {
3
3
  "type": "linear",
4
- "angle": 270,
4
+ "angle": "180",
5
5
  "stops": [
6
6
  {
7
- "color": "#171717",
7
+ "color": "rgba(23, 23, 23, 0)",
8
8
  "position": 0
9
9
  },
10
10
  {
11
- "color": "rgba(23, 23, 23, 0)",
11
+ "color": "#171717",
12
12
  "position": 1
13
13
  }
14
14
  ]
15
15
  },
16
- "content-fade-right": {
16
+ "content-fade-left": {
17
17
  "type": "linear",
18
- "angle": 270,
18
+ "angle": "270",
19
19
  "stops": [
20
20
  {
21
- "color": "rgba(23, 23, 23, 0)",
21
+ "color": "#171717",
22
22
  "position": 0
23
23
  },
24
24
  {
25
- "color": "#171717",
25
+ "color": "rgba(23, 23, 23, 0)",
26
26
  "position": 1
27
27
  }
28
28
  ]
29
29
  },
30
- "content-fade-up": {
30
+ "content-fade-right": {
31
31
  "type": "linear",
32
- "angle": 180,
32
+ "angle": "270",
33
33
  "stops": [
34
34
  {
35
35
  "color": "rgba(23, 23, 23, 0)",
@@ -43,7 +43,7 @@
43
43
  },
44
44
  "content-fade-down": {
45
45
  "type": "linear",
46
- "angle": 180,
46
+ "angle": "180",
47
47
  "stops": [
48
48
  {
49
49
  "color": "#171717",