@tedi-design-system/core 2.0.0 → 2.2.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 (20) hide show
  1. package/_base.scss +3 -4
  2. package/_fonts.scss +10 -0
  3. package/_mixins.scss +4 -25
  4. package/_typography.scss +28 -29
  5. package/fonts/SpaceGrotesk-Light.woff +0 -0
  6. package/fonts/SpaceGrotesk-Light.woff2 +0 -0
  7. package/index.css +1 -1
  8. package/index.scss +2 -0
  9. package/package.json +5 -5
  10. package/variables/_base-variables-legacy.scss +110 -0
  11. package/variables/_base-variables.scss +231 -110
  12. package/variables/_color-variables.scss +6 -1111
  13. package/variables/_dimensional-variables-legacy.scss +1236 -0
  14. package/variables/_dimensional-variables.scss +1092 -1234
  15. package/variables/_font-variables.scss +5 -75
  16. package/variables/themes/default/color-variables__dark.scss +611 -0
  17. package/variables/themes/default/color-variables__default.scss +617 -0
  18. package/variables/themes/default/font-variables__default.scss +94 -0
  19. package/variables/themes/rit/color-variables__rit.scss +617 -0
  20. package/variables/themes/rit/font-variables__rit.scss +90 -0
package/index.scss CHANGED
@@ -1,8 +1,10 @@
1
1
  @use 'bootstrap-utility/breakpoints';
2
2
  @use 'bootstrap-utility/grid';
3
3
  @use 'variables/bootstrap-variables';
4
+ @use 'variables/base-variables-legacy';
4
5
  @use 'variables/base-variables';
5
6
  @use 'variables/color-variables';
7
+ @use 'variables/dimensional-variables-legacy';
6
8
  @use 'variables/dimensional-variables';
7
9
  @use 'variables/font-variables';
8
10
  @use 'variables/utility-variables';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tedi-design-system/core",
3
- "version": "2.0.0",
3
+ "version": "2.2.0",
4
4
  "main": "src/index.scss",
5
5
  "scripts": {
6
6
  "prepare": "husky",
@@ -20,16 +20,16 @@
20
20
  "node": ">=18.0.0"
21
21
  },
22
22
  "devDependencies": {
23
- "@commitlint/cli": "^19.8.1",
24
- "@commitlint/config-conventional": "^19.8.1",
23
+ "@commitlint/cli": "^20.1.0",
24
+ "@commitlint/config-conventional": "^20.0.0",
25
25
  "@semantic-release/changelog": "^6.0.3",
26
26
  "@semantic-release/commit-analyzer": "^13.0.0",
27
27
  "@semantic-release/git": "^10.0.1",
28
28
  "@semantic-release/npm": "^12.0.1",
29
29
  "husky": "^9.0.11",
30
- "lint-staged": "^16.1.6",
30
+ "lint-staged": "^16.2.4",
31
31
  "semantic-release": "^24.2.7",
32
- "typescript": "5.9.2",
32
+ "typescript": "5.9.3",
33
33
  "prettier": "^2.8.8",
34
34
  "replace-in-file": "^8.3.0",
35
35
  "sass": "^1.86.0",
package/variables/_base-variables-legacy.scss ADDED
@@ -0,0 +1,110 @@
1
+ :root {
2
+ --accent-100: var(--orange-100);
3
+ --accent-200: var(--orange-200);
4
+ --accent-300: var(--orange-300);
5
+ --accent-400: var(--orange-400);
6
+ --accent-500: var(--orange-500);
7
+ --accent-600: var(--orange-600);
8
+ --accent-700: var(--orange-700);
9
+ --accent-800: var(--orange-800);
10
+ --alpha-01: rgba(0 0 0 / 0%);
11
+ --alpha-10: rgba(0 0 0 / 10%);
12
+ --alpha-14: rgba(0 0 0 / 14%);
13
+ --alpha-20: rgba(0 0 0 / 20%);
14
+ --alpha-40: rgba(23 23 23 / 40%);
15
+ --alpha-80: rgba(34 35 43 / 80%);
16
+ --alpha-primary-08: rgba(0 90 163 / 8%);
17
+ --alpha-primary-20: rgba(0 90 163 / 20%);
18
+ --alpha-white-10: rgba(255 255 255 / 10%);
19
+ --alpha-white-14: rgba(255 255 255 / 14%);
20
+ --alpha-white-20: rgba(255 255 255 / 20%);
21
+ --alpha-white-30: rgba(255 255 255 / 30%);
22
+ --alpha-white-50: rgba(255 255 255 / 50%);
23
+ --alpha-white-80: rgba(255 255 255 / 80%);
24
+ --blue-100: #e7f0f6;
25
+ --blue-200: #d0e1ee;
26
+ --blue-300: #99bdda;
27
+ --blue-400: #4587bc;
28
+ --blue-500: #337bb5;
29
+ --blue-600: #005aa3;
30
+ --blue-700: #004277;
31
+ --blue-800: #003662;
32
+ --green-100: #eaf3ee;
33
+ --green-200: #d6e7dd;
34
+ --green-300: #accfba;
35
+ --green-400: #83b698;
36
+ --green-500: #599e75;
37
+ --green-600: #308653;
38
+ --green-700: #266b42;
39
+ --green-800: #1d5032;
40
+ --neutral-100: #fff;
41
+ --neutral-200: #f9f9f9;
42
+ --neutral-300: #f0f0f2;
43
+ --neutral-350: #e1e2e5;
44
+ --neutral-400: #d2d3d8;
45
+ --neutral-450: #9293a4;
46
+ --neutral-500: #838494;
47
+ --neutral-550: #737482;
48
+ --neutral-600: #5d6071;
49
+ --neutral-700: #4b4e62;
50
+ --neutral-750: #34394c;
51
+ --neutral-800: #262b3b;
52
+ --neutral-850: #151926;
53
+ --neutral-900: #000;
54
+ --orange-100: #fff2e6;
55
+ --orange-200: #ffe6cc;
56
+ --orange-300: #fc9;
57
+ --orange-400: #ffb366;
58
+ --orange-500: #f93;
59
+ --orange-600: #ff8000;
60
+ --orange-700: #994d00;
61
+ --orange-800: #630;
62
+ --primary-100: var(--blue-100);
63
+ --primary-200: var(--blue-200);
64
+ --primary-300: var(--blue-300);
65
+ --primary-400: var(--blue-400);
66
+ --primary-500: var(--blue-500);
67
+ --primary-600: var(--blue-600);
68
+ --primary-700: var(--blue-700);
69
+ --primary-800: var(--blue-800);
70
+ --red-100: #fbecec;
71
+ --red-200: #f7d8d8;
72
+ --red-300: #efb2b2;
73
+ --red-400: #e78b8b;
74
+ --red-500: #df6565;
75
+ --red-600: #d73e3e;
76
+ --red-700: #ac3232;
77
+ --red-800: #812525;
78
+ --yellow-100: #fff8e7;
79
+ --yellow-200: #fff0cf;
80
+ --yellow-300: #ffe1a0;
81
+ --yellow-400: #ffd370;
82
+ --yellow-500: #ffb511;
83
+ --yellow-600: #ba830d;
84
+ --yellow-700: #94690d;
85
+ --yellow-800: #664807;
86
+
87
+ // /* BASE FONTS */
88
+ --family-roboto: 'Roboto';
89
+ --size-00: 0.75rem; /* 12px */
90
+ --size-01: 0.875rem; /* 14px */
91
+ --size-02: 1rem; /* 16px */
92
+ --size-03: 1.125rem; /* 18px */
93
+ --size-04: 1.25rem; /* 20px */
94
+ --size-05: 1.375rem; /* 22px */
95
+ --size-06: 1.5rem; /* 24px */
96
+ --size-07: 1.75rem; /* 28px */
97
+ --size-08: 1.875rem; /* 30px */
98
+ --size-09: 2rem; /* 32px */
99
+ --line-height-01: 1.25rem; /* 20px */
100
+ --line-height-02: 1.3125rem; /* 21px */
101
+ --line-height-03: 1.5rem; /* 24px */
102
+ --line-height-04: 1.625rem; /* 26px */
103
+ --line-height-05: 1.75rem; /* 28px */
104
+ --line-height-06: 1.875rem; /* 30px */
105
+ --line-height-07: 2rem; /* 32px */
106
+ --line-height-08: 2.25rem; /* 36px */
107
+ --line-height-09: 2.625rem; /* 42px */
108
+ --line-height-10: 2.875rem; /* 46px */
109
+ --line-height-11: 3rem; /* 48px */
110
+ }
package/variables/_base-variables.scss CHANGED
@@ -1,89 +1,183 @@
1
1
  :root {
2
2
  /* 1.1 Base colors */
3
- --accent-100: var(--orange-100);
4
- --accent-200: var(--orange-200);
5
- --accent-300: var(--orange-300);
6
- --accent-400: var(--orange-400);
7
- --accent-500: var(--orange-500);
8
- --accent-600: var(--orange-600);
9
- --accent-700: var(--orange-700);
10
- --accent-800: var(--orange-800);
11
- --alpha-01: rgba(0 0 0 / 0%);
12
- --alpha-10: rgba(0 0 0 / 10%);
13
- --alpha-14: rgba(0 0 0 / 14%);
14
- --alpha-20: rgba(0 0 0 / 20%);
15
- --alpha-40: rgba(23 23 23 / 40%);
16
- --alpha-80: rgba(34 35 43 / 80%);
17
- --alpha-primary-08: rgba(0 90 163 / 8%);
18
- --alpha-primary-20: rgba(0 90 163 / 20%);
19
- --alpha-white-10: rgba(255 255 255 / 10%);
20
- --alpha-white-14: rgba(255 255 255 / 14%);
21
- --alpha-white-20: rgba(255 255 255 / 20%);
22
- --alpha-white-30: rgba(255 255 255 / 30%);
23
- --alpha-white-50: rgba(255 255 255 / 50%);
24
- --alpha-white-80: rgba(255 255 255 / 80%);
25
- --blue-100: #e7f0f6;
26
- --blue-200: #d0e1ee;
27
- --blue-300: #99bdda;
28
- --blue-400: #4587bc;
29
- --blue-500: #337bb5;
30
- --blue-600: #005aa3;
31
- --blue-700: #004277;
32
- --blue-800: #003662;
33
- --green-100: #eaf3ee;
34
- --green-200: #d6e7dd;
35
- --green-300: #accfba;
36
- --green-400: #83b698;
37
- --green-500: #599e75;
38
- --green-600: #308653;
39
- --green-700: #266b42;
40
- --green-800: #1d5032;
41
- --neutral-100: #fff;
42
- --neutral-200: #f9f9f9;
43
- --neutral-300: #f0f0f2;
44
- --neutral-350: #e1e2e5;
45
- --neutral-400: #d2d3d8;
46
- --neutral-450: #9293a4;
47
- --neutral-500: #838494;
48
- --neutral-550: #737482;
49
- --neutral-600: #5d6071;
50
- --neutral-700: #4b4e62;
51
- --neutral-750: #34394c;
52
- --neutral-800: #262b3b;
53
- --neutral-850: #151926;
54
- --neutral-900: #000;
55
- --orange-100: #fff2e6;
56
- --orange-200: #ffe6cc;
57
- --orange-300: #fc9;
58
- --orange-400: #ffb366;
59
- --orange-500: #f93;
60
- --orange-600: #ff8000;
61
- --orange-700: #994d00;
62
- --orange-800: #630;
63
- --primary-100: var(--blue-100);
64
- --primary-200: var(--blue-200);
65
- --primary-300: var(--blue-300);
66
- --primary-400: var(--blue-400);
67
- --primary-500: var(--blue-500);
68
- --primary-600: var(--blue-600);
69
- --primary-700: var(--blue-700);
70
- --primary-800: var(--blue-800);
71
- --red-100: #fbecec;
72
- --red-200: #f7d8d8;
73
- --red-300: #efb2b2;
74
- --red-400: #e78b8b;
75
- --red-500: #df6565;
76
- --red-600: #d73e3e;
77
- --red-700: #ac3232;
78
- --red-800: #812525;
79
- --yellow-100: #fff8e7;
80
- --yellow-200: #fff0cf;
81
- --yellow-300: #ffe1a0;
82
- --yellow-400: #ffd370;
83
- --yellow-500: #ffb511;
84
- --yellow-600: #ba830d;
85
- --yellow-700: #94690d;
86
- --yellow-800: #664807;
3
+ --rit-accent-100: #cdf4ab;
4
+ --rit-accent-200: #cdf4ab;
5
+ --rit-accent-300: #9ae957;
6
+ --rit-accent-400: #66de00;
7
+ --rit-accent-500: #1eb800;
8
+ --rit-accent-600: #008700;
9
+ --rit-accent-700: #008700;
10
+ --rit-accent-800: #008700;
11
+ --rit-accent-extra-1: #55199b;
12
+ --rit-accent-extra-10: #3ad8cc;
13
+ --rit-accent-extra-2: #f7664f;
14
+ --rit-accent-extra-3: #43c7f6;
15
+ --rit-accent-extra-4: #ad240f;
16
+ --rit-accent-extra-5: #9eb7d5;
17
+ --rit-accent-extra-6: #fdc0b7;
18
+ --rit-accent-extra-7: #008455;
19
+ --rit-accent-extra-8: #ffc832;
20
+ --rit-accent-extra-9: #003ca5;
21
+ --rit-alpha-01: #0000;
22
+ --rit-alpha-10: #0000001a;
23
+ --rit-alpha-14: #00000024;
24
+ --rit-alpha-20: #0003;
25
+ --rit-alpha-40: #17171766;
26
+ --rit-alpha-80: #22232bcc;
27
+ --rit-alpha-primary-08: #005aa314;
28
+ --rit-alpha-primary-20: #005aa333;
29
+ --rit-alpha-white-10: #ffffff1a;
30
+ --rit-alpha-white-14: #ffffff24;
31
+ --rit-alpha-white-20: #fff3;
32
+ --rit-alpha-white-30: #ffffff4d;
33
+ --rit-alpha-white-50: #ffffff80;
34
+ --rit-alpha-white-80: #fffc;
35
+ --rit-blue-100: #e7f0f6;
36
+ --rit-blue-200: #d0e1ee;
37
+ --rit-blue-300: #99bdda;
38
+ --rit-blue-400: #4587bc;
39
+ --rit-blue-500: #337bb5;
40
+ --rit-blue-600: #005aa3;
41
+ --rit-blue-700: #004277;
42
+ --rit-blue-800: #003662;
43
+ --rit-green-100: #eaf3ee;
44
+ --rit-green-200: #d6e7dd;
45
+ --rit-green-300: #accfba;
46
+ --rit-green-400: #83b698;
47
+ --rit-green-500: #599e75;
48
+ --rit-green-600: #308653;
49
+ --rit-green-700: #266b42;
50
+ --rit-green-800: #1d5032;
51
+ --rit-neutral-100: #fff;
52
+ --rit-neutral-200: #f9f9f9;
53
+ --rit-neutral-300: #f0f0f2;
54
+ --rit-neutral-350: #e1e2e5;
55
+ --rit-neutral-400: #d2d3d8;
56
+ --rit-neutral-450: #9293a4;
57
+ --rit-neutral-500: #838494;
58
+ --rit-neutral-550: #737482;
59
+ --rit-neutral-600: #5d6071;
60
+ --rit-neutral-700: #4b4e62;
61
+ --rit-neutral-750: #34394c;
62
+ --rit-neutral-800: #262b3b;
63
+ --rit-neutral-850: #151926;
64
+ --rit-neutral-900: #000;
65
+ --rit-orange-100: #fff2e6;
66
+ --rit-orange-200: #ffe6cc;
67
+ --rit-orange-300: #fc9;
68
+ --rit-orange-400: #ffb366;
69
+ --rit-orange-500: #f93;
70
+ --rit-orange-600: #e77400;
71
+ --rit-orange-700: #994d00;
72
+ --rit-orange-800: #630;
73
+ --rit-primary-100: #d2d2d2;
74
+ --rit-primary-200: #d2d2d2;
75
+ --rit-primary-300: #aaa;
76
+ --rit-primary-400: #828282;
77
+ --rit-primary-500: #5a5a5a;
78
+ --rit-primary-600: #000;
79
+ --rit-primary-700: #000;
80
+ --rit-primary-800: #000;
81
+ --rit-red-100: #fbecec;
82
+ --rit-red-200: #f7d8d8;
83
+ --rit-red-300: #efb2b2;
84
+ --rit-red-400: #e78b8b;
85
+ --rit-red-500: #df6565;
86
+ --rit-red-600: #d73e3e;
87
+ --rit-red-700: #ac3232;
88
+ --rit-red-800: #812525;
89
+ --rit-yellow-100: #fff8e7;
90
+ --rit-yellow-200: #fff0cf;
91
+ --rit-yellow-300: #ffe1a0;
92
+ --rit-yellow-400: #ffd370;
93
+ --rit-yellow-500: #ffb511;
94
+ --rit-yellow-600: #ba830d;
95
+ --rit-yellow-700: #94690d;
96
+ --rit-yellow-800: #664807;
97
+ --tedi-accent-100: var(--tedi-orange-100);
98
+ --tedi-accent-200: var(--tedi-orange-200);
99
+ --tedi-accent-300: var(--tedi-orange-300);
100
+ --tedi-accent-400: var(--tedi-orange-400);
101
+ --tedi-accent-500: var(--tedi-orange-500);
102
+ --tedi-accent-600: var(--tedi-orange-600);
103
+ --tedi-accent-700: var(--tedi-orange-700);
104
+ --tedi-accent-800: var(--tedi-orange-800);
105
+ --tedi-alpha-01: #0000;
106
+ --tedi-alpha-10: #0000001a;
107
+ --tedi-alpha-14: #00000024;
108
+ --tedi-alpha-20: #0003;
109
+ --tedi-alpha-40: #17171766;
110
+ --tedi-alpha-80: #22232bcc;
111
+ --tedi-alpha-primary-08: #005aa314;
112
+ --tedi-alpha-primary-20: #005aa333;
113
+ --tedi-alpha-white-10: #ffffff1a;
114
+ --tedi-alpha-white-14: #ffffff24;
115
+ --tedi-alpha-white-20: #fff3;
116
+ --tedi-alpha-white-30: #ffffff4d;
117
+ --tedi-alpha-white-50: #ffffff80;
118
+ --tedi-alpha-white-80: #fffc;
119
+ --tedi-blue-100: #e7f0f6;
120
+ --tedi-blue-200: #d0e1ee;
121
+ --tedi-blue-300: #99bdda;
122
+ --tedi-blue-400: #4587bc;
123
+ --tedi-blue-500: #337bb5;
124
+ --tedi-blue-600: #005aa3;
125
+ --tedi-blue-700: #004277;
126
+ --tedi-blue-800: #003662;
127
+ --tedi-green-100: #eaf3ee;
128
+ --tedi-green-200: #d6e7dd;
129
+ --tedi-green-300: #accfba;
130
+ --tedi-green-400: #83b698;
131
+ --tedi-green-500: #599e75;
132
+ --tedi-green-600: #308653;
133
+ --tedi-green-700: #266b42;
134
+ --tedi-green-800: #1d5032;
135
+ --tedi-neutral-100: #fff;
136
+ --tedi-neutral-200: #f9f9f9;
137
+ --tedi-neutral-300: #f0f0f2;
138
+ --tedi-neutral-350: #e1e2e5;
139
+ --tedi-neutral-400: #d2d3d8;
140
+ --tedi-neutral-450: #9293a4;
141
+ --tedi-neutral-500: #838494;
142
+ --tedi-neutral-550: #737482;
143
+ --tedi-neutral-600: #5d6071;
144
+ --tedi-neutral-700: #4b4e62;
145
+ --tedi-neutral-750: #34394c;
146
+ --tedi-neutral-800: #262b3b;
147
+ --tedi-neutral-850: #151926;
148
+ --tedi-neutral-900: #000;
149
+ --tedi-orange-100: #fff2e6;
150
+ --tedi-orange-200: #ffe6cc;
151
+ --tedi-orange-300: #fc9;
152
+ --tedi-orange-400: #ffb366;
153
+ --tedi-orange-500: #f93;
154
+ --tedi-orange-600: #e77400;
155
+ --tedi-orange-700: #994d00;
156
+ --tedi-orange-800: #630;
157
+ --tedi-primary-100: var(--tedi-blue-100);
158
+ --tedi-primary-200: var(--tedi-blue-200);
159
+ --tedi-primary-300: var(--tedi-blue-300);
160
+ --tedi-primary-400: var(--tedi-blue-400);
161
+ --tedi-primary-500: var(--tedi-blue-500);
162
+ --tedi-primary-600: var(--tedi-blue-600);
163
+ --tedi-primary-700: var(--tedi-blue-700);
164
+ --tedi-primary-800: var(--tedi-blue-800);
165
+ --tedi-red-100: #fbecec;
166
+ --tedi-red-200: #f7d8d8;
167
+ --tedi-red-300: #efb2b2;
168
+ --tedi-red-400: #e78b8b;
169
+ --tedi-red-500: #df6565;
170
+ --tedi-red-600: #d73e3e;
171
+ --tedi-red-700: #ac3232;
172
+ --tedi-red-800: #812525;
173
+ --tedi-yellow-100: #fff8e7;
174
+ --tedi-yellow-200: #fff0cf;
175
+ --tedi-yellow-300: #ffe1a0;
176
+ --tedi-yellow-400: #ffd370;
177
+ --tedi-yellow-500: #ffb511;
178
+ --tedi-yellow-600: #ba830d;
179
+ --tedi-yellow-700: #94690d;
180
+ --tedi-yellow-800: #664807;
87
181
 
88
182
  /* BASE DIMENSIONS */
89
183
  --dimensions-00: 0rem;
@@ -139,30 +233,57 @@
139
233
  --borders-03: 3px;
140
234
  --borders-04: 4px;
141
235
 
142
- /* BASE FONTS */
143
- --family-roboto: 'Roboto';
144
- --size-00: 0.75rem; /* 12px */
145
- --size-01: 0.875rem; /* 14px */
146
- --size-02: 1rem; /* 16px */
147
- --size-03: 1.125rem; /* 18px */
148
- --size-04: 1.25rem; /* 20px */
149
- --size-05: 1.375rem; /* 22px */
150
- --size-06: 1.5rem; /* 24px */
151
- --size-07: 1.75rem; /* 28px */
152
- --size-08: 1.875rem; /* 30px */
153
- --size-09: 2rem; /* 32px */
154
- --line-height-01: 1.25rem; /* 20px */
155
- --line-height-02: 1.3125rem; /* 21px */
156
- --line-height-03: 1.5rem; /* 24px */
157
- --line-height-04: 1.625rem; /* 26px */
158
- --line-height-05: 1.75rem; /* 28px */
159
- --line-height-06: 1.875rem; /* 30px */
160
- --line-height-07: 2rem; /* 32px */
161
- --line-height-08: 2.25rem; /* 36px */
162
- --line-height-09: 2.625rem; /* 42px */
163
- --line-height-10: 2.875rem; /* 46px */
164
- --line-height-11: 3rem; /* 48px */
165
- --weight-01: 300;
166
- --weight-02: 400;
167
- --weight-03: 700;
236
+ /* 3.1 BASE FONTS */
237
+ --tedi-size-01: 0.875rem;
238
+ --tedi-size-02: 1rem;
239
+ --tedi-size-03: 1.125rem;
240
+ --tedi-size-04: 1.25rem;
241
+ --tedi-size-06: 1.5rem;
242
+ --tedi-size-07: 1.75rem;
243
+ --tedi-size-08: 1.875rem;
244
+ --tedi-size-09: 2rem;
245
+ --tedi-size-05: 1.375rem;
246
+ --tedi-line-height-11: 3rem;
247
+ --tedi-line-height-09: 2.625rem;
248
+ --tedi-line-height-08: 2.25rem;
249
+ --tedi-line-height-06: 1.875rem;
250
+ --tedi-line-height-04: 1.625rem;
251
+ --tedi-line-height-03: 1.5rem;
252
+ --tedi-line-height-01: 1.25rem;
253
+ --tedi-line-height-07: 2rem;
254
+ --tedi-line-height-02: 1.3125rem;
255
+ --tedi-line-height-10: 2.875rem;
256
+ --tedi-weight-01: 300;
257
+ --tedi-weight-02: 400;
258
+ --tedi-weight-03: 700;
259
+ --tedi-family-roboto: 'Roboto';
260
+ --tedi-line-height-05: 1.75rem;
261
+ --tedi-size-00: 0.75rem;
262
+ --tedi-line-height-00: 1rem;
263
+ --rit-size-00: 0.75rem;
264
+ --rit-family-roboto: 'Space Grotesk';
265
+ --rit-line-height-00: 1rem;
266
+ --rit-line-height-01: 1.25rem;
267
+ --rit-line-height-02: 1.3125rem;
268
+ --rit-line-height-03: 1.5rem;
269
+ --rit-line-height-04: 1.625rem;
270
+ --rit-line-height-05: 1.75rem;
271
+ --rit-line-height-06: 1.875rem;
272
+ --rit-line-height-07: 2rem;
273
+ --rit-line-height-08: 2.25rem;
274
+ --rit-line-height-09: 2.625rem;
275
+ --rit-line-height-10: 2.875rem;
276
+ --rit-line-height-11: 3rem;
277
+ --rit-weight-01: 300;
278
+ --rit-weight-02: 400;
279
+ --rit-weight-03: 700;
280
+ --rit-size-01: 0.875rem;
281
+ --rit-size-02: 1rem;
282
+ --rit-size-03: 1.125rem;
283
+ --rit-size-04: 1.25rem;
284
+ --rit-size-05: 1.375rem;
285
+ --rit-size-06: 1.5rem;
286
+ --rit-size-07: 1.75rem;
287
+ --rit-size-08: 1.875rem;
288
+ --rit-size-09: 2rem;
168
289
  }