@bonniernews/dn-design-system-web 32.5.0 → 32.5.1

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