@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/typographyTokensScreenLarge.scss ADDED
@@ -0,0 +1,499 @@
1
+ $typographyTokensScreenLarge: (
2
+ expressive-heading01regular: (
3
+ fontFamily: "DN Serif Text",
4
+ fontWeight: Regular,
5
+ fontSize: 16,
6
+ lineHeight: 1.2
7
+ ),
8
+ expressive-heading01semibold: (
9
+ fontFamily: "DN Serif Text",
10
+ fontWeight: SemiBold,
11
+ fontSize: 16,
12
+ lineHeight: 1.2
13
+ ),
14
+ expressive-heading01bold: (
15
+ fontFamily: "DN Serif Text",
16
+ fontWeight: Bold,
17
+ fontSize: 16,
18
+ lineHeight: 1.2
19
+ ),
20
+ expressive-heading01italicregular: (
21
+ lineHeight: 1.2,
22
+ fontSize: 16,
23
+ fontFamily: "DN Serif Text",
24
+ fontWeight: Medium,
25
+ fontStyle: italic
26
+ ),
27
+ expressive-heading01italicsemibold: (
28
+ lineHeight: 1.2,
29
+ fontSize: 16,
30
+ fontFamily: "DN Serif Text",
31
+ fontWeight: SemiBold,
32
+ fontStyle: italic
33
+ ),
34
+ expressive-heading01italicbold: (
35
+ lineHeight: 1.2,
36
+ fontSize: 16,
37
+ fontFamily: "DN Serif Text",
38
+ fontWeight: Bold,
39
+ fontStyle: italic
40
+ ),
41
+ expressive-heading02regular: (
42
+ fontFamily: "DN Serif Headline",
43
+ fontWeight: Regular,
44
+ fontSize: 22,
45
+ lineHeight: 1.2,
46
+ paragraphSpacing: 16
47
+ ),
48
+ expressive-heading02semibold: (
49
+ fontFamily: "DN Serif Headline",
50
+ fontWeight: SemiBold,
51
+ fontSize: 22,
52
+ lineHeight: 1.2
53
+ ),
54
+ expressive-heading02bold: (
55
+ fontFamily: "DN Serif Headline",
56
+ fontWeight: Bold,
57
+ fontSize: 22,
58
+ lineHeight: 1.2
59
+ ),
60
+ expressive-heading02italicregular: (
61
+ fontSize: 22,
62
+ lineHeight: 1.2,
63
+ fontWeight: Regular,
64
+ fontFamily: "DN Serif Headline",
65
+ fontStyle: italic
66
+ ),
67
+ expressive-heading02italicsemibold: (
68
+ fontSize: 22,
69
+ lineHeight: 1.2,
70
+ fontWeight: SemiBold,
71
+ fontFamily: "DN Serif Headline",
72
+ fontStyle: italic
73
+ ),
74
+ expressive-heading02italicbold: (
75
+ fontSize: 22,
76
+ lineHeight: 1.2,
77
+ fontWeight: Bold,
78
+ fontFamily: "DN Serif Headline",
79
+ fontStyle: italic
80
+ ),
81
+ expressive-heading03regular: (
82
+ fontFamily: "DN Serif Headline",
83
+ fontWeight: Regular,
84
+ fontSize: 26,
85
+ lineHeight: 1.1
86
+ ),
87
+ expressive-heading03semibold: (
88
+ fontFamily: "DN Serif Headline",
89
+ fontWeight: SemiBold,
90
+ fontSize: 26,
91
+ lineHeight: 1.1
92
+ ),
93
+ expressive-heading03bold: (
94
+ fontFamily: "DN Serif Headline",
95
+ fontWeight: Bold,
96
+ fontSize: 26,
97
+ lineHeight: 1.1
98
+ ),
99
+ expressive-heading03italicregular: (
100
+ fontSize: 26,
101
+ lineHeight: 1.1,
102
+ fontWeight: Regular,
103
+ fontFamily: "DN Serif Headline",
104
+ fontStyle: italic
105
+ ),
106
+ expressive-heading03italicsemibold: (
107
+ fontSize: 26,
108
+ lineHeight: 1.1,
109
+ fontWeight: SemiBold,
110
+ fontFamily: "DN Serif Headline",
111
+ fontStyle: italic
112
+ ),
113
+ expressive-heading03italicbold: (
114
+ fontSize: 26,
115
+ lineHeight: 1.1,
116
+ fontWeight: Bold,
117
+ fontFamily: "DN Serif Headline",
118
+ fontStyle: italic
119
+ ),
120
+ expressive-heading04regular: (
121
+ fontFamily: "DN Serif Display",
122
+ fontWeight: Regular,
123
+ fontSize: 40,
124
+ lineHeight: 1.1
125
+ ),
126
+ expressive-heading04semibold: (
127
+ fontFamily: "DN Serif Display",
128
+ fontWeight: SemiBold,
129
+ fontSize: 40,
130
+ lineHeight: 1.1
131
+ ),
132
+ expressive-heading04bold: (
133
+ fontFamily: "DN Serif Display",
134
+ fontWeight: Bold,
135
+ fontSize: 40,
136
+ lineHeight: 1.1
137
+ ),
138
+ expressive-heading04italicregular: (
139
+ fontSize: 40,
140
+ fontWeight: Regular,
141
+ fontFamily: "DN Serif Display",
142
+ lineHeight: 1.1,
143
+ fontStyle: italic
144
+ ),
145
+ expressive-heading04italicsemibold: (
146
+ fontSize: 40,
147
+ lineHeight: 1.1,
148
+ fontWeight: SemiBold,
149
+ fontFamily: "DN Serif Display",
150
+ fontStyle: italic
151
+ ),
152
+ expressive-heading04italicbold: (
153
+ fontSize: 40,
154
+ lineHeight: 1.1,
155
+ fontWeight: Bold,
156
+ fontFamily: "DN Serif Display",
157
+ fontStyle: italic
158
+ ),
159
+ expressive-heading05regular: (
160
+ fontFamily: "DN Serif Display",
161
+ fontWeight: Regular,
162
+ lineHeight: 1.1,
163
+ fontSize: 56
164
+ ),
165
+ expressive-heading05semibold: (
166
+ fontFamily: "DN Serif Display",
167
+ fontWeight: SemiBold,
168
+ lineHeight: 1.1,
169
+ fontSize: 56
170
+ ),
171
+ expressive-heading05bold: (
172
+ fontFamily: "DN Serif Display",
173
+ fontWeight: Bold,
174
+ lineHeight: 1.1,
175
+ fontSize: 56
176
+ ),
177
+ expressive-heading05italicregular: (
178
+ fontFamily: "DN Serif Display",
179
+ fontWeight: Regular,
180
+ fontSize: 56,
181
+ lineHeight: 1.1,
182
+ fontStyle: italic
183
+ ),
184
+ expressive-heading05italicsemibold: (
185
+ fontFamily: "DN Serif Display",
186
+ fontWeight: SemiBold,
187
+ fontSize: 56,
188
+ lineHeight: 1.1,
189
+ fontStyle: italic
190
+ ),
191
+ expressive-heading05italicbold: (
192
+ fontFamily: "DN Serif Display",
193
+ fontWeight: Bold,
194
+ fontSize: 56,
195
+ lineHeight: 1.1,
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
+ );