@carbon/type 10.13.0 → 10.15.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 (21) hide show
  1. package/es/index.js +57 -59
  2. package/lib/index.js +57 -59
  3. package/package.json +4 -4
  4. package/scss/_inlined/_reset.scss +1 -1
  5. package/scss/_inlined/_scale.scss +2 -2
  6. package/scss/_inlined/_styles.scss +58 -59
  7. package/scss/_inlined/font-face/_mono.scss +72 -72
  8. package/scss/_inlined/font-face/_sans-condensed.scss +42 -42
  9. package/scss/_inlined/font-face/_sans.scss +84 -84
  10. package/scss/_inlined/font-face/_serif.scss +72 -72
  11. package/scss/_reset.scss +1 -1
  12. package/scss/_scale.scss +2 -2
  13. package/scss/_styles.scss +58 -59
  14. package/scss/font-face/_mono.scss +72 -72
  15. package/scss/font-face/_sans-condensed.scss +42 -42
  16. package/scss/font-face/_sans.scss +84 -84
  17. package/scss/font-face/_serif.scss +72 -72
  18. package/src/__tests__/__snapshots__/styles-test.js.snap +31 -31
  19. package/src/__tests__/fluid-test.js +26 -26
  20. package/src/styles.js +57 -59
  21. package/umd/index.js +57 -59
package/umd/index.js CHANGED
@@ -250,117 +250,117 @@
250
250
  var caption01 = {
251
251
  fontSize: layout.rem(scale[0]),
252
252
  fontWeight: fontWeights.regular,
253
- lineHeight: layout.rem(16),
253
+ lineHeight: 1.34,
254
254
  letterSpacing: layout.px(0.32)
255
255
  };
256
256
  var label01 = {
257
257
  fontSize: layout.rem(scale[0]),
258
258
  fontWeight: fontWeights.regular,
259
- lineHeight: layout.rem(16),
259
+ lineHeight: 1.34,
260
260
  letterSpacing: layout.px(0.32)
261
261
  };
262
262
  var helperText01 = {
263
263
  fontSize: layout.rem(scale[0]),
264
- lineHeight: layout.rem(16),
264
+ lineHeight: 1.34,
265
265
  letterSpacing: layout.px(0.32)
266
266
  };
267
267
  var bodyShort01 = {
268
268
  fontSize: layout.rem(scale[1]),
269
269
  fontWeight: fontWeights.regular,
270
- lineHeight: layout.rem(18),
270
+ lineHeight: 1.29,
271
271
  letterSpacing: layout.px(0.16)
272
272
  };
273
273
  var bodyLong01 = {
274
274
  fontSize: layout.rem(scale[1]),
275
275
  fontWeight: fontWeights.regular,
276
- lineHeight: layout.rem(20),
276
+ lineHeight: 1.43,
277
277
  letterSpacing: layout.px(0.16)
278
278
  };
279
279
  var bodyShort02 = {
280
280
  fontSize: layout.rem(scale[2]),
281
281
  fontWeight: fontWeights.regular,
282
- lineHeight: layout.rem(22),
282
+ lineHeight: 1.375,
283
283
  letterSpacing: 0
284
284
  };
285
285
  var bodyLong02 = {
286
286
  fontSize: layout.rem(scale[2]),
287
287
  fontWeight: fontWeights.regular,
288
- lineHeight: layout.rem(24),
288
+ lineHeight: 1.5,
289
289
  letterSpacing: 0
290
290
  };
291
291
  var code01 = {
292
292
  fontFamily: fontFamilies.mono,
293
293
  fontSize: layout.rem(scale[0]),
294
294
  fontWeight: fontWeights.regular,
295
- lineHeight: layout.rem(16),
295
+ lineHeight: 1.34,
296
296
  letterSpacing: layout.px(0.32)
297
297
  };
298
298
  var code02 = {
299
299
  fontFamily: fontFamilies.mono,
300
300
  fontSize: layout.rem(scale[1]),
301
301
  fontWeight: fontWeights.regular,
302
- lineHeight: layout.rem(20),
302
+ lineHeight: 1.43,
303
303
  letterSpacing: layout.px(0.32)
304
304
  };
305
305
  var heading01 = {
306
306
  fontSize: layout.rem(scale[1]),
307
307
  fontWeight: fontWeights.semibold,
308
- lineHeight: layout.rem(18),
308
+ lineHeight: 1.29,
309
309
  letterSpacing: layout.px(0.16)
310
310
  };
311
311
  var productiveHeading01 = heading01;
312
312
  var heading02 = {
313
313
  fontSize: layout.rem(scale[2]),
314
314
  fontWeight: fontWeights.semibold,
315
- lineHeight: layout.rem(22),
315
+ lineHeight: 1.375,
316
316
  letterSpacing: 0
317
317
  };
318
318
  var productiveHeading02 = heading02;
319
319
  var productiveHeading03 = {
320
320
  fontSize: layout.rem(scale[4]),
321
321
  fontWeight: fontWeights.regular,
322
- lineHeight: layout.rem(28),
322
+ lineHeight: 1.4,
323
323
  letterSpacing: 0
324
324
  };
325
325
  var productiveHeading04 = {
326
326
  fontSize: layout.rem(scale[6]),
327
327
  fontWeight: fontWeights.regular,
328
- lineHeight: layout.rem(36),
328
+ lineHeight: 1.29,
329
329
  letterSpacing: 0
330
330
  };
331
331
  var productiveHeading05 = {
332
332
  fontSize: layout.rem(scale[7]),
333
333
  fontWeight: fontWeights.regular,
334
- lineHeight: layout.rem(40),
334
+ lineHeight: 1.25,
335
335
  letterSpacing: 0
336
336
  };
337
337
  var productiveHeading06 = {
338
338
  fontSize: layout.rem(scale[9]),
339
339
  fontWeight: fontWeights.light,
340
- lineHeight: layout.rem(50),
340
+ lineHeight: 1.199,
341
341
  letterSpacing: 0
342
342
  };
343
343
  var productiveHeading07 = {
344
344
  fontSize: layout.rem(scale[11]),
345
345
  fontWeight: fontWeights.light,
346
- lineHeight: layout.rem(64),
346
+ lineHeight: 1.19,
347
347
  letterSpacing: 0
348
348
  };
349
349
  var expressiveHeading01 = _objectSpread2(_objectSpread2({}, heading01), {}, {
350
- lineHeight: layout.rem(20)
350
+ lineHeight: 1.25
351
351
  });
352
352
  var expressiveHeading02 = _objectSpread2(_objectSpread2({}, heading02), {}, {
353
- lineHeight: layout.rem(24)
353
+ lineHeight: 1.5
354
354
  });
355
355
  var expressiveHeading03 = {
356
356
  fontSize: layout.rem(scale[4]),
357
357
  fontWeight: fontWeights.regular,
358
- lineHeight: '140%',
358
+ lineHeight: 1.4,
359
359
  letterSpacing: 0,
360
360
  breakpoints: {
361
361
  xlg: {
362
362
  fontSize: layout.rem(scale[4]),
363
- lineHeight: '125%'
363
+ lineHeight: 1.25
364
364
  },
365
365
  max: {
366
366
  fontSize: layout.rem(scale[5])
@@ -370,12 +370,12 @@
370
370
  var expressiveHeading04 = {
371
371
  fontSize: layout.rem(scale[6]),
372
372
  fontWeight: fontWeights.regular,
373
- lineHeight: '129%',
373
+ lineHeight: 1.29,
374
374
  letterSpacing: 0,
375
375
  breakpoints: {
376
376
  xlg: {
377
377
  fontSize: layout.rem(scale[6]),
378
- lineHeight: '125%'
378
+ lineHeight: 1.25
379
379
  },
380
380
  max: {
381
381
  fontSize: layout.rem(scale[7])
@@ -385,31 +385,30 @@
385
385
  var expressiveHeading05 = {
386
386
  fontSize: layout.rem(scale[7]),
387
387
  fontWeight: fontWeights.regular,
388
- lineHeight: '125%',
388
+ lineHeight: 1.25,
389
389
  letterSpacing: 0,
390
390
  breakpoints: {
391
391
  md: {
392
392
  fontSize: layout.rem(scale[8]),
393
393
  fontWeight: fontWeights.light,
394
- lineHeight: '122%',
394
+ lineHeight: 1.22,
395
395
  letterSpacing: 0
396
396
  },
397
397
  lg: {
398
398
  fontSize: layout.rem(scale[9]),
399
399
  fontWeight: fontWeights.light,
400
- lineHeight: '119%',
400
+ lineHeight: 1.19,
401
401
  letterSpacing: 0
402
402
  },
403
403
  xlg: {
404
404
  fontSize: layout.rem(scale[10]),
405
405
  fontWeight: fontWeights.light,
406
- lineHeight: '117%',
406
+ lineHeight: 1.17,
407
407
  letterSpacing: 0
408
408
  },
409
409
  max: {
410
410
  fontSize: layout.rem(scale[12]),
411
411
  fontWeight: fontWeights.light,
412
- lineHeight: layout.rem(70),
413
412
  letterSpacing: 0
414
413
  }
415
414
  }
@@ -417,31 +416,30 @@
417
416
  var expressiveHeading06 = {
418
417
  fontSize: layout.rem(scale[7]),
419
418
  fontWeight: fontWeights.semibold,
420
- lineHeight: '125%',
419
+ lineHeight: 1.25,
421
420
  letterSpacing: 0,
422
421
  breakpoints: {
423
422
  md: {
424
423
  fontSize: layout.rem(scale[8]),
425
424
  fontWeight: fontWeights.semibold,
426
- lineHeight: '122%',
425
+ lineHeight: 1.22,
427
426
  letterSpacing: 0
428
427
  },
429
428
  lg: {
430
429
  fontSize: layout.rem(scale[9]),
431
430
  fontWeight: fontWeights.semibold,
432
- lineHeight: '119%',
431
+ lineHeight: 1.19,
433
432
  letterSpacing: 0
434
433
  },
435
434
  xlg: {
436
435
  fontSize: layout.rem(scale[10]),
437
436
  fontWeight: fontWeights.semibold,
438
- lineHeight: '117%',
437
+ lineHeight: 1.17,
439
438
  letterSpacing: 0
440
439
  },
441
440
  max: {
442
441
  fontSize: layout.rem(scale[12]),
443
442
  fontWeight: fontWeights.semibold,
444
- lineHeight: layout.rem(70),
445
443
  letterSpacing: 0
446
444
  }
447
445
  }
@@ -449,21 +447,21 @@
449
447
  var expressiveParagraph01 = {
450
448
  fontSize: layout.rem(scale[5]),
451
449
  fontWeight: fontWeights.light,
452
- lineHeight: '125%',
450
+ lineHeight: 1.25,
453
451
  letterSpacing: 0,
454
452
  lg: {
455
453
  fontSize: layout.rem(scale[6]),
456
- lineHeight: '129%'
454
+ lineHeight: 1.29
457
455
  },
458
456
  max: {
459
457
  fontSize: layout.rem(scale[7]),
460
- lineHeight: '125%'
458
+ lineHeight: 1.25
461
459
  }
462
460
  };
463
461
  var quotation01 = {
464
462
  fontSize: layout.rem(scale[4]),
465
463
  fontWeight: fontWeights.regular,
466
- lineHeight: '130%',
464
+ lineHeight: 1.3,
467
465
  letterSpacing: 0,
468
466
  breakpoints: {
469
467
  md: {
@@ -474,19 +472,19 @@
474
472
  lg: {
475
473
  fontSize: layout.rem(scale[5]),
476
474
  fontWeight: fontWeights.regular,
477
- lineHeight: '125%',
475
+ lineHeight: 1.25,
478
476
  letterSpacing: 0
479
477
  },
480
478
  xlg: {
481
479
  fontSize: layout.rem(scale[6]),
482
480
  fontWeight: fontWeights.regular,
483
- lineHeight: '129%',
481
+ lineHeight: 1.29,
484
482
  letterSpacing: 0
485
483
  },
486
484
  max: {
487
485
  fontSize: layout.rem(scale[7]),
488
486
  fontWeight: fontWeights.regular,
489
- lineHeight: '125%',
487
+ lineHeight: 1.25,
490
488
  letterSpacing: 0
491
489
  }
492
490
  }
@@ -494,20 +492,20 @@
494
492
  var quotation02 = {
495
493
  fontSize: layout.rem(scale[7]),
496
494
  fontWeight: fontWeights.light,
497
- lineHeight: '125%',
495
+ lineHeight: 1.25,
498
496
  letterSpacing: 0,
499
497
  breakpoints: {
500
498
  md: {
501
499
  fontSize: layout.rem(scale[8]),
502
- lineHeight: '122%'
500
+ lineHeight: 1.22
503
501
  },
504
502
  lg: {
505
503
  fontSize: layout.rem(scale[9]),
506
- lineHeight: '119%'
504
+ lineHeight: 1.19
507
505
  },
508
506
  xlg: {
509
507
  fontSize: layout.rem(scale[10]),
510
- lineHeight: '117%'
508
+ lineHeight: 1.17
511
509
  },
512
510
  max: {
513
511
  fontSize: layout.rem(scale[12])
@@ -517,7 +515,7 @@
517
515
  var display01 = {
518
516
  fontSize: layout.rem(scale[9]),
519
517
  fontWeight: fontWeights.light,
520
- lineHeight: '119%',
518
+ lineHeight: 1.19,
521
519
  letterSpacing: 0,
522
520
  breakpoints: {
523
521
  md: {
@@ -528,18 +526,18 @@
528
526
  },
529
527
  xlg: {
530
528
  fontSize: layout.rem(scale[12]),
531
- lineHeight: '117%'
529
+ lineHeight: 1.17
532
530
  },
533
531
  max: {
534
532
  fontSize: layout.rem(scale[14]),
535
- lineHeight: '113%'
533
+ lineHeight: 1.13
536
534
  }
537
535
  }
538
536
  };
539
537
  var display02 = {
540
538
  fontSize: layout.rem(scale[9]),
541
539
  fontWeight: fontWeights.semibold,
542
- lineHeight: '119%',
540
+ lineHeight: 1.19,
543
541
  letterSpacing: 0,
544
542
  breakpoints: {
545
543
  md: {
@@ -550,36 +548,36 @@
550
548
  },
551
549
  xlg: {
552
550
  fontSize: layout.rem(scale[12]),
553
- lineHeight: '116%'
551
+ lineHeight: 1.16
554
552
  },
555
553
  max: {
556
554
  fontSize: layout.rem(scale[14]),
557
- lineHeight: '113%'
555
+ lineHeight: 1.13
558
556
  }
559
557
  }
560
558
  };
561
559
  var display03 = {
562
560
  fontSize: layout.rem(scale[9]),
563
561
  fontWeight: fontWeights.light,
564
- lineHeight: '119%',
562
+ lineHeight: 1.19,
565
563
  letterSpacing: 0,
566
564
  breakpoints: {
567
565
  md: {
568
566
  fontSize: layout.rem(scale[13]),
569
- lineHeight: '115%'
567
+ lineHeight: 1.15
570
568
  },
571
569
  lg: {
572
570
  fontSize: layout.rem(scale[16]),
573
- lineHeight: '111%',
571
+ lineHeight: 1.11,
574
572
  letterSpacing: layout.px(-0.64)
575
573
  },
576
574
  xlg: {
577
575
  fontSize: layout.rem(scale[19]),
578
- lineHeight: '107%'
576
+ lineHeight: 1.07
579
577
  },
580
578
  max: {
581
579
  fontSize: layout.rem(scale[22]),
582
- lineHeight: '105%',
580
+ lineHeight: 1.05,
583
581
  letterSpacing: layout.px(-0.96)
584
582
  }
585
583
  }
@@ -587,26 +585,26 @@
587
585
  var display04 = {
588
586
  fontSize: layout.rem(scale[9]),
589
587
  fontWeight: fontWeights.semibold,
590
- lineHeight: '119%',
588
+ lineHeight: 1.19,
591
589
  letterSpacing: 0,
592
590
  breakpoints: {
593
591
  md: {
594
592
  fontSize: layout.rem(scale[13]),
595
- lineHeight: '115%'
593
+ lineHeight: 1.15
596
594
  },
597
595
  lg: {
598
596
  fontSize: layout.rem(scale[16]),
599
- lineHeight: '111%',
597
+ lineHeight: 1.11,
600
598
  letterSpacing: layout.px(-0.64)
601
599
  },
602
600
  xlg: {
603
601
  fontSize: layout.rem(scale[19]),
604
- lineHeight: '107%',
602
+ lineHeight: 1.07,
605
603
  letterSpacing: layout.px(-0.64)
606
604
  },
607
605
  max: {
608
606
  fontSize: layout.rem(scale[22]),
609
- lineHeight: '105%',
607
+ lineHeight: 1.05,
610
608
  letterSpacing: layout.px(-0.96)
611
609
  }
612
610
  }