@ons/design-system 73.5.0 → 73.7.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.
@@ -2,7 +2,7 @@
2
2
  *::before,
3
3
  *::after {
4
4
  box-sizing: border-box;
5
- word-wrap: break-word;
5
+ overflow-wrap: break-word;
6
6
  }
7
7
 
8
8
  html {
@@ -3,7 +3,7 @@
3
3
  background-image: linear-gradient(var(--ons-color-highlight), var(--ons-color-highlight));
4
4
  background-position: bottom;
5
5
  background-repeat: no-repeat;
6
- background-size: 100% calc(var(--ons-line-height, 28px) - 4px);
6
+ background-size: 100% calc(var(--ons-line-height, 1.75rem) - 0.25rem);
7
7
  box-decoration-break: clone; // Firefox
8
8
  box-shadow: 0 4px 0 0 var(--ons-color-text-link-focus);
9
9
  font-style: normal;
@@ -10,7 +10,7 @@ $grid-bp: (
10
10
  '2xl': 1600px,
11
11
  ) !default;
12
12
 
13
- $grid-max-width: 64.625625rem !default;
13
+ $grid-max-width: 64.6256rem !default;
14
14
  $grid-max-1280: 79.9999rem !default;
15
15
  $grid-cols: 12 !default;
16
16
  $grid-cols-mobile: 4 !default;
@@ -12,63 +12,63 @@ $type-matrix: (
12
12
  small: 32px,
13
13
  large: 48px,
14
14
  weight: $font-weight-bold,
15
- line-height-mobile: 44px,
16
- line-height-desktop: 56px,
15
+ line-height-mobile: 2.75rem,
16
+ line-height-desktop: 3.5rem,
17
17
  ),
18
18
  ons-u-fs-2xl: (
19
19
  small: 28px,
20
20
  large: 36px,
21
21
  weight: $font-weight-bold,
22
- line-height-mobile: 40px,
23
- line-height-desktop: 48px,
22
+ line-height-mobile: 2.5rem,
23
+ line-height-desktop: 3rem,
24
24
  ),
25
25
  ons-u-fs-xl: (
26
26
  small: 26px,
27
27
  large: 30px,
28
28
  weight: $font-weight-bold,
29
- line-height-mobile: 36px,
30
- line-height-desktop: 40px,
29
+ line-height-mobile: 2.25rem,
30
+ line-height-desktop: 2.5rem,
31
31
  ),
32
32
  ons-u-fs-l: (
33
33
  small: 24px,
34
34
  large: 26px,
35
35
  weight: $font-weight-bold,
36
- line-height-mobile: 32px,
37
- line-height-desktop: 36px,
36
+ line-height-mobile: 2rem,
37
+ line-height-desktop: 2.25rem,
38
38
  ),
39
39
  ons-u-fs-m: (
40
40
  small: 20px,
41
41
  large: 22px,
42
42
  weight: $font-weight-bold,
43
- line-height-mobile: 28px,
44
- line-height-desktop: 32px,
43
+ line-height-mobile: 1.75rem,
44
+ line-height-desktop: 2rem,
45
45
  ),
46
46
  ons-u-fs-r--b: (
47
47
  small: 18px,
48
48
  large: 18px,
49
49
  weight: $font-weight-bold,
50
- line-height-mobile: 28px,
51
- line-height-desktop: 28px,
50
+ line-height-mobile: 1.75rem,
51
+ line-height-desktop: 1.75rem,
52
52
  ),
53
53
  ons-u-fs-r: (
54
54
  small: 18px,
55
55
  large: 18px,
56
56
  weight: $font-weight-regular,
57
- line-height-mobile: 28px,
58
- line-height-desktop: 28px,
57
+ line-height-mobile: 1.75rem,
58
+ line-height-desktop: 1.75rem,
59
59
  ),
60
60
  ons-u-fs-s--b: (
61
61
  small: 14px,
62
62
  large: 14px,
63
63
  weight: $font-weight-bold,
64
- line-height-mobile: 20px,
65
- line-height-desktop: 20px,
64
+ line-height-mobile: 1.25rem,
65
+ line-height-desktop: 1.25rem,
66
66
  ),
67
67
  ons-u-fs-s: (
68
68
  small: 14px,
69
69
  large: 14px,
70
70
  weight: $font-weight-regular,
71
- line-height-mobile: 20px,
72
- line-height-desktop: 20px,
71
+ line-height-mobile: 1.25rem,
72
+ line-height-desktop: 1.25rem,
73
73
  ),
74
74
  );