@bonniernews/dn-design-system-web 12.0.0 → 13.0.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 (34) hide show
  1. package/CHANGELOG.md +29 -0
  2. package/components/buddy-menu/buddy-menu.scss +1 -1
  3. package/components/floating-button/floating-button.scss +1 -1
  4. package/components/icon-button/icon-button.scss +1 -1
  5. package/components/teaser-standard/teaser-standard.scss +2 -2
  6. package/foundations/helpers/typography.scss +33 -8
  7. package/foundations/icons/icon.njk +5 -0
  8. package/foundations/icons/sprite.njk +1 -1
  9. package/foundations/icons/sprite.svg +1 -1
  10. package/foundations/icons/svg/x.svg +3 -0
  11. package/foundations/typography/README.md +5 -2
  12. package/foundations/variables/deprecated/typographyTokensList.scss +78 -0
  13. package/foundations/variables/deprecated/typographyTokensScreenExtraLarge.scss +499 -0
  14. package/foundations/variables/deprecated/typographyTokensScreenLarge.scss +499 -0
  15. package/foundations/variables/deprecated/typographyTokensScreenSmall.scss +504 -0
  16. package/foundations/variables/opacity.scss +1 -1
  17. package/foundations/variables/shadowsDnDarkTokens.scss +14 -22
  18. package/foundations/variables/shadowsDnLightTokens.scss +14 -22
  19. package/foundations/variables/shadowsTokensList.scss +4 -5
  20. package/foundations/variables/typographyFontWeight.scss +4 -0
  21. package/foundations/variables/typographyLetterSpacing.scss +3 -0
  22. package/foundations/variables/typographyLineHeight.scss +4 -0
  23. package/foundations/variables/typographyTokensList.scss +0 -78
  24. package/foundations/variables/typographyTokensScreenExtraLarge.scss +3 -500
  25. package/foundations/variables/typographyTokensScreenLarge.scss +3 -500
  26. package/foundations/variables/typographyTokensScreenSmall.scss +3 -505
  27. package/package.json +1 -1
  28. package/tokens/deprecated-typography-list.json +80 -0
  29. package/tokens/icon-list.json +2 -1
  30. package/tokens/shadows-css-variables.json +4 -5
  31. package/tokens/typography-list.json +0 -78
  32. package/foundations/variables/typographyAddons.scss +0 -11
  33. package/tokens/spacing-component-list.json +0 -12
  34. package/tokens/spacing-layout-list.json +0 -17
package/foundations/variables/deprecated/typographyTokensScreenExtraLarge.scss ADDED
@@ -0,0 +1,499 @@
1
+ $typographyTokensScreenExtraLarge: (
2
+ expressive-heading03regular: (
3
+ fontFamily: "DN Serif Display",
4
+ fontWeight: Regular,
5
+ fontSize: 36,
6
+ lineHeight: 1.1
7
+ ),
8
+ expressive-heading03semibold: (
9
+ fontFamily: "DN Serif Display",
10
+ fontWeight: SemiBold,
11
+ fontSize: 36,
12
+ lineHeight: 1.1
13
+ ),
14
+ expressive-heading03bold: (
15
+ fontFamily: "DN Serif Display",
16
+ fontWeight: Bold,
17
+ fontSize: 36,
18
+ lineHeight: 1.1
19
+ ),
20
+ expressive-heading03italicregular: (
21
+ fontSize: 36,
22
+ lineHeight: 1.1,
23
+ fontWeight: Regular,
24
+ fontFamily: "DN Serif Display",
25
+ fontStyle: italic
26
+ ),
27
+ expressive-heading03italicsemibold: (
28
+ fontSize: 36,
29
+ lineHeight: 1.1,
30
+ fontWeight: SemiBold,
31
+ fontFamily: "DN Serif Display",
32
+ fontStyle: italic
33
+ ),
34
+ expressive-heading03italicbold: (
35
+ fontSize: 36,
36
+ lineHeight: 1.1,
37
+ fontWeight: Bold,
38
+ fontFamily: "DN Serif Display",
39
+ fontStyle: italic
40
+ ),
41
+ expressive-heading04regular: (
42
+ fontFamily: "DN Serif Display",
43
+ fontWeight: Regular,
44
+ fontSize: 56,
45
+ lineHeight: 1.1
46
+ ),
47
+ expressive-heading04semibold: (
48
+ fontFamily: "DN Serif Display",
49
+ fontWeight: SemiBold,
50
+ fontSize: 56,
51
+ lineHeight: 1.1
52
+ ),
53
+ expressive-heading04bold: (
54
+ fontFamily: "DN Serif Display",
55
+ fontWeight: Bold,
56
+ fontSize: 56,
57
+ lineHeight: 1.1
58
+ ),
59
+ expressive-heading04italicregular: (
60
+ fontSize: 56,
61
+ lineHeight: 1.1,
62
+ fontWeight: Regular,
63
+ fontFamily: "DN Serif Display",
64
+ fontStyle: italic
65
+ ),
66
+ expressive-heading04italicsemibold: (
67
+ fontSize: 56,
68
+ lineHeight: 1.1,
69
+ fontWeight: SemiBold,
70
+ fontFamily: "DN Serif Display",
71
+ fontStyle: italic
72
+ ),
73
+ expressive-heading04italicbold: (
74
+ fontSize: 56,
75
+ lineHeight: 1.1,
76
+ fontWeight: Bold,
77
+ fontFamily: "DN Serif Display",
78
+ fontStyle: italic
79
+ ),
80
+ expressive-heading05regular: (
81
+ fontFamily: "DN Serif Display",
82
+ fontWeight: Regular,
83
+ lineHeight: 1.1,
84
+ fontSize: 80
85
+ ),
86
+ expressive-heading05semibold: (
87
+ fontFamily: "DN Serif Display",
88
+ fontWeight: SemiBold,
89
+ lineHeight: 1.1,
90
+ fontSize: 80
91
+ ),
92
+ expressive-heading05bold: (
93
+ fontFamily: "DN Serif Display",
94
+ fontWeight: Bold,
95
+ lineHeight: 1.1,
96
+ fontSize: 80
97
+ ),
98
+ expressive-heading05italicregular: (
99
+ fontFamily: "DN Serif Display",
100
+ fontWeight: Regular,
101
+ fontSize: 80,
102
+ lineHeight: 1.1,
103
+ fontStyle: italic
104
+ ),
105
+ expressive-heading05italicsemibold: (
106
+ fontFamily: "DN Serif Display",
107
+ fontWeight: SemiBold,
108
+ fontSize: 80,
109
+ lineHeight: 1.1,
110
+ fontStyle: italic
111
+ ),
112
+ expressive-heading05italicbold: (
113
+ fontFamily: "DN Serif Display",
114
+ fontWeight: Bold,
115
+ fontSize: 80,
116
+ lineHeight: 1.1,
117
+ fontStyle: italic
118
+ ),
119
+ expressive-heading01regular: (
120
+ fontFamily: "DN Serif Text",
121
+ fontWeight: Regular,
122
+ fontSize: 16,
123
+ lineHeight: 1.2
124
+ ),
125
+ expressive-heading01semibold: (
126
+ fontFamily: "DN Serif Text",
127
+ fontWeight: SemiBold,
128
+ fontSize: 16,
129
+ lineHeight: 1.2
130
+ ),
131
+ expressive-heading01bold: (
132
+ fontFamily: "DN Serif Text",
133
+ fontWeight: Bold,
134
+ fontSize: 16,
135
+ lineHeight: 1.2
136
+ ),
137
+ expressive-heading01italicregular: (
138
+ lineHeight: 1.2,
139
+ fontSize: 16,
140
+ fontFamily: "DN Serif Text",
141
+ fontWeight: Medium,
142
+ fontStyle: italic
143
+ ),
144
+ expressive-heading01italicsemibold: (
145
+ lineHeight: 1.2,
146
+ fontSize: 16,
147
+ fontFamily: "DN Serif Text",
148
+ fontWeight: SemiBold,
149
+ fontStyle: italic
150
+ ),
151
+ expressive-heading01italicbold: (
152
+ lineHeight: 1.2,
153
+ fontSize: 16,
154
+ fontFamily: "DN Serif Text",
155
+ fontWeight: Bold,
156
+ fontStyle: italic
157
+ ),
158
+ expressive-heading02regular: (
159
+ fontFamily: "DN Serif Headline",
160
+ fontWeight: Regular,
161
+ fontSize: 22,
162
+ lineHeight: 1.2,
163
+ paragraphSpacing: 16
164
+ ),
165
+ expressive-heading02semibold: (
166
+ fontFamily: "DN Serif Headline",
167
+ fontWeight: SemiBold,
168
+ fontSize: 22,
169
+ lineHeight: 1.2
170
+ ),
171
+ expressive-heading02bold: (
172
+ fontFamily: "DN Serif Headline",
173
+ fontWeight: Bold,
174
+ fontSize: 22,
175
+ lineHeight: 1.2
176
+ ),
177
+ expressive-heading02italicregular: (
178
+ fontSize: 22,
179
+ lineHeight: 1.2,
180
+ fontWeight: Regular,
181
+ fontFamily: "DN Serif Headline",
182
+ fontStyle: italic
183
+ ),
184
+ expressive-heading02italicsemibold: (
185
+ fontSize: 22,
186
+ lineHeight: 1.2,
187
+ fontWeight: SemiBold,
188
+ fontFamily: "DN Serif Headline",
189
+ fontStyle: italic
190
+ ),
191
+ expressive-heading02italicbold: (
192
+ fontSize: 22,
193
+ lineHeight: 1.2,
194
+ fontWeight: Bold,
195
+ fontFamily: "DN Serif Headline",
196
+ fontStyle: italic
197
+ ),
198
+ functional-heading03regular: (
199
+ fontFamily: "DN Sans",
200
+ fontWeight: Regular,
201
+ lineHeight: 1.2,
202
+ fontSize: 24
203
+ ),
204
+ functional-heading03semibold: (
205
+ fontFamily: "DN Sans",
206
+ fontWeight: SemiBold,
207
+ lineHeight: 1.2,
208
+ fontSize: 24
209
+ ),
210
+ functional-heading03bold: (
211
+ fontFamily: "DN Sans",
212
+ fontWeight: Bold,
213
+ lineHeight: 1.2,
214
+ fontSize: 24
215
+ ),
216
+ functional-heading01regular: (
217
+ fontFamily: "DN Sans",
218
+ fontWeight: Regular,
219
+ fontSize: 16,
220
+ lineHeight: 1.2
221
+ ),
222
+ functional-heading01semibold: (
223
+ fontFamily: "DN Sans",
224
+ fontWeight: SemiBold,
225
+ fontSize: 16,
226
+ lineHeight: 1.2
227
+ ),
228
+ functional-heading01bold: (
229
+ fontFamily: "DN Sans",
230
+ fontWeight: Bold,
231
+ fontSize: 16,
232
+ lineHeight: 1.2
233
+ ),
234
+ functional-heading02regular: (
235
+ fontFamily: "DN Sans",
236
+ fontSize: 20,
237
+ fontWeight: Regular,
238
+ lineHeight: 1.1
239
+ ),
240
+ functional-heading02semibold: (
241
+ fontFamily: "DN Sans",
242
+ fontSize: 20,
243
+ fontWeight: SemiBold,
244
+ lineHeight: 1.1
245
+ ),
246
+ functional-heading02bold: (
247
+ fontFamily: "DN Sans",
248
+ fontSize: 20,
249
+ fontWeight: Bold,
250
+ lineHeight: 1.1
251
+ ),
252
+ functional-heading04regular: (
253
+ fontFamily: "DN Sans",
254
+ fontWeight: Regular,
255
+ fontSize: 31,
256
+ lineHeight: 1.1
257
+ ),
258
+ functional-heading04semibold: (
259
+ fontFamily: "DN Sans",
260
+ fontWeight: SemiBold,
261
+ fontSize: 31,
262
+ lineHeight: 1.1
263
+ ),
264
+ functional-heading04bold: (
265
+ fontFamily: "DN Sans",
266
+ fontWeight: Bold,
267
+ fontSize: 31,
268
+ lineHeight: 1.1
269
+ ),
270
+ functional-heading05regular: (
271
+ fontFamily: "DN Sans",
272
+ fontWeight: Regular,
273
+ fontSize: 39,
274
+ lineHeight: 1.1
275
+ ),
276
+ functional-heading05semibold: (
277
+ fontFamily: "DN Sans",
278
+ fontWeight: SemiBold,
279
+ fontSize: 39,
280
+ lineHeight: 1.1
281
+ ),
282
+ functional-heading05bold: (
283
+ fontFamily: "DN Sans",
284
+ fontWeight: Bold,
285
+ fontSize: 39,
286
+ lineHeight: 1.1
287
+ ),
288
+ expressive-preamble01regular: (
289
+ fontFamily: "DN Serif Text",
290
+ fontWeight: Regular,
291
+ fontSize: 20,
292
+ lineHeight: 1.5
293
+ ),
294
+ expressive-preamble01semibold: (
295
+ fontFamily: "DN Serif Text",
296
+ fontWeight: SemiBold,
297
+ fontSize: 20,
298
+ lineHeight: 1.5
299
+ ),
300
+ expressive-preamble01bold: (
301
+ fontFamily: "DN Serif Text",
302
+ fontWeight: Bold,
303
+ fontSize: 20,
304
+ lineHeight: 1.5
305
+ ),
306
+ expressive-preamble01italicregular: (
307
+ fontFamily: "DN Serif Text",
308
+ fontWeight: Regular,
309
+ lineHeight: 1.5,
310
+ fontSize: 20,
311
+ fontStyle: italic
312
+ ),
313
+ expressive-preamble01italicsemibold: (
314
+ fontFamily: "DN Serif Text",
315
+ fontWeight: SemiBold,
316
+ lineHeight: 1.5,
317
+ fontSize: 20,
318
+ fontStyle: italic
319
+ ),
320
+ expressive-preamble01italicbold: (
321
+ fontFamily: "DN Serif Text",
322
+ fontWeight: Bold,
323
+ lineHeight: 1.5,
324
+ fontSize: 20,
325
+ fontStyle: italic
326
+ ),
327
+ expressive-body01regular: (
328
+ fontFamily: "DN Serif Text",
329
+ fontWeight: Regular,
330
+ fontSize: 16,
331
+ lineHeight: 1.5
332
+ ),
333
+ expressive-body01semibold: (
334
+ fontFamily: "DN Serif Text",
335
+ fontWeight: SemiBold,
336
+ fontSize: 16,
337
+ lineHeight: 1.5
338
+ ),
339
+ expressive-body01bold: (
340
+ fontFamily: "DN Serif Text",
341
+ fontWeight: Bold,
342
+ fontSize: 16,
343
+ lineHeight: 1.5
344
+ ),
345
+ expressive-body01italicregular: (
346
+ fontFamily: "DN Serif Text",
347
+ fontWeight: Regular,
348
+ lineHeight: 1.5,
349
+ fontSize: 16,
350
+ fontStyle: italic
351
+ ),
352
+ expressive-body01italicsemibold: (
353
+ fontFamily: "DN Serif Text",
354
+ fontWeight: SemiBold,
355
+ lineHeight: 1.5,
356
+ fontSize: 16,
357
+ fontStyle: italic
358
+ ),
359
+ expressive-body01italicbold: (
360
+ fontFamily: "DN Serif Text",
361
+ fontWeight: Bold,
362
+ lineHeight: 1.5,
363
+ fontSize: 16,
364
+ fontStyle: italic
365
+ ),
366
+ expressive-body02regular: (
367
+ fontFamily: "DN Serif Text",
368
+ fontWeight: Regular,
369
+ lineHeight: 1.5,
370
+ fontSize: 18
371
+ ),
372
+ expressive-body02semibold: (
373
+ fontFamily: "DN Serif Text",
374
+ fontWeight: SemiBold,
375
+ lineHeight: 1.5,
376
+ fontSize: 18
377
+ ),
378
+ expressive-body02bold: (
379
+ fontFamily: "DN Serif Text",
380
+ fontWeight: Bold,
381
+ lineHeight: 1.5,
382
+ fontSize: 18
383
+ ),
384
+ expressive-body02italicregular: (
385
+ fontFamily: "DN Serif Text",
386
+ fontWeight: Regular,
387
+ lineHeight: 1.5,
388
+ fontSize: 18,
389
+ fontStyle: italic
390
+ ),
391
+ expressive-body02italicsemibold: (
392
+ fontFamily: "DN Serif Text",
393
+ fontWeight: SemiBold,
394
+ lineHeight: 1.5,
395
+ fontSize: 18,
396
+ fontStyle: italic
397
+ ),
398
+ expressive-body02italicbold: (
399
+ fontFamily: "DN Serif Text",
400
+ fontWeight: Bold,
401
+ lineHeight: 1.5,
402
+ fontSize: 18,
403
+ fontStyle: italic
404
+ ),
405
+ functional-body01regular: (
406
+ fontFamily: "DN Sans",
407
+ fontWeight: Regular,
408
+ fontSize: 14,
409
+ letterSpacing: "",
410
+ lineHeight: 1.5,
411
+ paragraphSpacing: ""
412
+ ),
413
+ functional-body01semibold: (
414
+ fontFamily: "DN Sans",
415
+ fontWeight: SemiBold,
416
+ fontSize: 14,
417
+ letterSpacing: "",
418
+ lineHeight: 1.5
419
+ ),
420
+ functional-body01bold: (
421
+ fontFamily: "DN Sans",
422
+ fontWeight: Bold,
423
+ fontSize: 14,
424
+ letterSpacing: "",
425
+ lineHeight: 1.5
426
+ ),
427
+ functional-body02regular: (
428
+ fontFamily: "DN Sans",
429
+ fontWeight: Regular,
430
+ lineHeight: 1.5,
431
+ fontSize: 16
432
+ ),
433
+ functional-body02semibold: (
434
+ fontFamily: "DN Sans",
435
+ fontWeight: SemiBold,
436
+ lineHeight: 1.5,
437
+ fontSize: 16
438
+ ),
439
+ functional-body02bold: (
440
+ fontFamily: "DN Sans",
441
+ fontWeight: Bold,
442
+ lineHeight: 1.5,
443
+ fontSize: 16
444
+ ),
445
+ functional-body03regular: (
446
+ fontFamily: "DN Sans",
447
+ fontWeight: Regular,
448
+ lineHeight: 1.5,
449
+ fontSize: 20
450
+ ),
451
+ functional-body03semibold: (
452
+ fontFamily: "DN Sans",
453
+ fontWeight: SemiBold,
454
+ lineHeight: 1.5,
455
+ fontSize: 20
456
+ ),
457
+ functional-body03bold: (
458
+ fontFamily: "DN Sans",
459
+ fontWeight: Bold,
460
+ lineHeight: 1.5,
461
+ fontSize: 20
462
+ ),
463
+ functional-meta01regular: (
464
+ fontFamily: "DN Sans",
465
+ fontWeight: Regular,
466
+ fontSize: 10,
467
+ lineHeight: 1.5
468
+ ),
469
+ functional-meta01semibold: (
470
+ fontFamily: "DN Sans",
471
+ fontWeight: SemiBold,
472
+ fontSize: 10,
473
+ lineHeight: 1.5
474
+ ),
475
+ functional-meta01bold: (
476
+ fontFamily: "DN Sans",
477
+ fontWeight: Bold,
478
+ fontSize: 10,
479
+ lineHeight: 1.5
480
+ ),
481
+ functional-meta02regular: (
482
+ fontFamily: "DN Sans",
483
+ fontWeight: Regular,
484
+ lineHeight: 1.5,
485
+ fontSize: 12
486
+ ),
487
+ functional-meta02semibold: (
488
+ fontFamily: "DN Sans",
489
+ fontWeight: SemiBold,
490
+ lineHeight: 1.5,
491
+ fontSize: 12
492
+ ),
493
+ functional-meta02bold: (
494
+ fontFamily: "DN Sans",
495
+ fontWeight: Bold,
496
+ lineHeight: 1.5,
497
+ fontSize: 12
498
+ )
499
+ );