@compsych-ui-components/shared 7.0.0 → 7.0.2

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 (11) hide show
  1. package/package.json +1 -1
  2. package/src/tokens/ref-tokens.js.map +1 -1
  3. package/src/tokens/refs.css +56 -56
  4. package/src/tokens/sys-tokens.js.map +1 -1
  5. package/src/tokens/sys.css +86 -86
  6. package/src/tokens/themes/absence-resources.css +84 -84
  7. package/src/tokens/themes/brand-b.css +56 -56
  8. package/src/tokens/themes/brand-c.css +56 -56
  9. package/src/tokens/themes/compsych.css +56 -56
  10. package/src/tokens/themes/crc.css +84 -84
  11. package/src/tokens/themes/gro.css +86 -86
package/src/tokens/themes/absence-resources.css CHANGED
@@ -77,145 +77,145 @@
77
77
  --transparent-secondary-pd-secondary-20: rgba(7, 92, 186, 0.08);
78
78
  --display-large-pd-font-family: 'google sans', sans-serif;
79
79
  --display-large-pd-font-weight: normal;
80
- --display-large-pd-font-size: 5rem;
81
- --display-large-pd-line-height: 5rem;
82
- --display-large-pd-tracking: -0.15rem;
80
+ --display-large-pd-font-size: 80px;
81
+ --display-large-pd-line-height: 80px;
82
+ --display-large-pd-tracking: -2px;
83
83
  --display-large-pd-font-weight-emphasized: 500;
84
84
  --display-medium-pd-font-family: 'google sans', sans-serif;
85
85
  --display-medium-pd-font-weight: normal;
86
- --display-medium-pd-font-size: 4.5rem;
87
- --display-medium-pd-line-height: 5rem;
88
- --display-medium-pd-tracking: -0.09rem;
86
+ --display-medium-pd-font-size: 72px;
87
+ --display-medium-pd-line-height: 80px;
88
+ --display-medium-pd-tracking: -1px;
89
89
  --display-medium-pd-font-weight-emphasized: 500;
90
90
  --display-small-pd-font-family: 'google sans', sans-serif;
91
91
  --display-small-pd-font-weight: normal;
92
- --display-small-pd-font-size: 4rem;
93
- --display-small-pd-line-height: 4.5rem;
94
- --display-small-pd-tracking: -0.04rem;
92
+ --display-small-pd-font-size: 64px;
93
+ --display-small-pd-line-height: 72px;
94
+ --display-small-pd-tracking: -1px;
95
95
  --display-small-pd-font-weight-emphasized: 500;
96
96
  --headline-large-pd-font-family: 'google sans', sans-serif;
97
97
  --headline-large-pd-font-weight: normal;
98
- --headline-large-pd-font-size: 3rem;
99
- --headline-large-pd-line-height: 3.5rem;
100
- --headline-large-pd-tracking: -0.03rem;
98
+ --headline-large-pd-font-size: 48px;
99
+ --headline-large-pd-line-height: 56px;
100
+ --headline-large-pd-tracking: 0px;
101
101
  --headline-large-pd-font-weight-emphasized: 500;
102
102
  --headline-medium-pd-font-family: 'google sans', sans-serif;
103
103
  --headline-medium-pd-font-weight: normal;
104
- --headline-medium-pd-font-size: 2.5rem;
105
- --headline-medium-pd-line-height: 3rem;
104
+ --headline-medium-pd-font-size: 40px;
105
+ --headline-medium-pd-line-height: 48px;
106
106
  --headline-medium-pd-tracking: 0;
107
107
  --headline-medium-pd-font-weight-emphasized: 500;
108
108
  --headline-small-pd-font-family: 'google sans', sans-serif;
109
109
  --headline-small-pd-font-weight: normal;
110
- --headline-small-pd-font-size: 2rem;
111
- --headline-small-pd-line-height: 2.5rem;
110
+ --headline-small-pd-font-size: 32px;
111
+ --headline-small-pd-line-height: 40px;
112
112
  --headline-small-pd-tracking: 0;
113
113
  --headline-small-pd-font-weight-emphasized: 500;
114
114
  --title-large-pd-font-family: 'google sans', sans-serif;
115
115
  --title-large-pd-font-weight: normal;
116
- --title-large-pd-font-size: 1.75rem;
117
- --title-large-pd-line-height: 2.25rem;
116
+ --title-large-pd-font-size: 28px;
117
+ --title-large-pd-line-height: 36px;
118
118
  --title-large-pd-tracking: 0;
119
119
  --title-large-pd-font-weight-emphasized: 500;
120
120
  --title-medium-pd-font-family: 'google sans', sans-serif;
121
121
  --title-medium-pd-font-weight: normal;
122
- --title-medium-pd-font-size: 1.5rem;
123
- --title-medium-pd-line-height: 2rem;
122
+ --title-medium-pd-font-size: 24px;
123
+ --title-medium-pd-line-height: 32px;
124
124
  --title-medium-pd-tracking: 0;
125
125
  --title-medium-pd-font-weight-emphasized: 500;
126
126
  --title-small-pd-font-family: 'google sans', sans-serif;
127
127
  --title-small-pd-font-weight: normal;
128
- --title-small-pd-font-size: 1.25rem;
129
- --title-small-pd-line-height: 1.875rem;
128
+ --title-small-pd-font-size: 20px;
129
+ --title-small-pd-line-height: 30px;
130
130
  --title-small-pd-tracking: 0;
131
131
  --title-small-pd-font-weight-emphasized: 500;
132
132
  --body-large-pd-font-family: 'google sans', sans-serif;
133
133
  --body-large-pd-font-weight: normal;
134
- --body-large-pd-font-size: 1.25rem;
135
- --body-large-pd-line-height: 1.875rem;
134
+ --body-large-pd-font-size: 20px;
135
+ --body-large-pd-line-height: 30px;
136
136
  --body-large-pd-tracking: 0;
137
137
  --body-large-pd-font-weight-emphasized: 500;
138
138
  --body-medium-pd-font-family: 'google sans', sans-serif;
139
139
  --body-medium-pd-font-weight: normal;
140
- --body-medium-pd-font-size: 1rem;
141
- --body-medium-pd-line-height: 1.5rem;
140
+ --body-medium-pd-font-size: 16px;
141
+ --body-medium-pd-line-height: 24px;
142
142
  --body-medium-pd-tracking: 0;
143
143
  --body-medium-pd-font-weight-emphasized: 500;
144
144
  --body-small-pd-font-family: 'google sans', sans-serif;
145
145
  --body-small-pd-font-weight: normal;
146
- --body-small-pd-font-size: 0.875rem;
147
- --body-small-pd-line-height: 1.25rem;
146
+ --body-small-pd-font-size: 14px;
147
+ --body-small-pd-line-height: 20px;
148
148
  --body-small-pd-tracking: 0;
149
149
  --body-small-pd-font-weight-emphasized: 500;
150
150
  --label-large-pd-font-family: 'google sans', sans-serif;
151
151
  --label-large-pd-font-weight: normal;
152
- --label-large-pd-font-size: 1rem;
153
- --label-large-pd-line-height: 1.5rem;
152
+ --label-large-pd-font-size: 16px;
153
+ --label-large-pd-line-height: 24px;
154
154
  --label-large-pd-tracking: 0;
155
155
  --label-large-pd-font-weight-emphasized: 500;
156
156
  --label-medium-pd-font-family: 'google sans', sans-serif;
157
157
  --label-medium-pd-font-weight: normal;
158
- --label-medium-pd-font-size: 0.875rem;
159
- --label-medium-pd-line-height: 1.25rem;
158
+ --label-medium-pd-font-size: 14px;
159
+ --label-medium-pd-line-height: 20px;
160
160
  --label-medium-pd-tracking: 0;
161
161
  --label-medium-pd-font-weight-emphasized: 500;
162
162
  --label-small-pd-font-family: 'google sans', sans-serif;
163
163
  --label-small-pd-font-weight: normal;
164
- --label-small-pd-font-size: 0.75rem;
165
- --label-small-pd-line-height: 1.125rem;
164
+ --label-small-pd-font-size: 12px;
165
+ --label-small-pd-line-height: 18px;
166
166
  --label-small-pd-tracking: 0;
167
167
  --label-small-pd-font-weight-emphasized: 500;
168
168
  --spacing-margin-pd-margin-none: 0;
169
- --spacing-margin-pd-margin-sm: 1rem;
170
- --spacing-margin-pd-margin-md: 1.5rem;
171
- --spacing-margin-pd-margin-lg: 2rem;
172
- --spacing-margin-pd-margin-xl: 2.5rem;
173
- --spacing-margin-pd-margin-2xl: 5rem;
174
- --spacing-spacer-pd-spacer-xs: 0.5rem;
175
- --spacing-spacer-pd-spacer-sm: 1rem;
176
- --spacing-spacer-pd-spacer-md: 1.5rem;
177
- --spacing-spacer-pd-spacer-lg: 2rem;
178
- --spacing-padding-pd-neg-padding-24: -1.5rem;
179
- --spacing-padding-pd-neg-padding-16: -1rem;
169
+ --spacing-margin-pd-margin-sm: 16px;
170
+ --spacing-margin-pd-margin-md: 24px;
171
+ --spacing-margin-pd-margin-lg: 32px;
172
+ --spacing-margin-pd-margin-xl: 40px;
173
+ --spacing-margin-pd-margin-2xl: 80px;
174
+ --spacing-spacer-pd-spacer-xs: 8px;
175
+ --spacing-spacer-pd-spacer-sm: 16px;
176
+ --spacing-spacer-pd-spacer-md: 24px;
177
+ --spacing-spacer-pd-spacer-lg: 32px;
178
+ --spacing-padding-pd-neg-padding-24: -24px;
179
+ --spacing-padding-pd-neg-padding-16: -16px;
180
180
  --spacing-padding-pd-padding-0: 0;
181
- --spacing-padding-pd-padding-2: 0.125rem;
182
- --spacing-padding-pd-padding-4: 0.25rem;
183
- --spacing-padding-pd-padding-6: 0.375rem;
184
- --spacing-padding-pd-padding-8: 0.5rem;
185
- --spacing-padding-pd-padding-12: 0.75rem;
186
- --spacing-padding-pd-padding-16: 1rem;
187
- --spacing-padding-pd-padding-20: 1.25rem;
188
- --spacing-padding-pd-padding-24: 1.5rem;
189
- --spacing-padding-pd-padding-32: 2rem;
190
- --spacing-padding-pd-padding-40: 2.5rem;
191
- --spacing-padding-pd-padding-48: 3rem;
192
- --spacing-padding-pd-padding-64: 4rem;
193
- --spacing-padding-pd-padding-72: 4.5rem;
194
- --spacing-padding-pd-padding-80: 5rem;
181
+ --spacing-padding-pd-padding-2: 2px;
182
+ --spacing-padding-pd-padding-4: 4px;
183
+ --spacing-padding-pd-padding-6: 6px;
184
+ --spacing-padding-pd-padding-8: 8px;
185
+ --spacing-padding-pd-padding-12: 12px;
186
+ --spacing-padding-pd-padding-16: 16px;
187
+ --spacing-padding-pd-padding-20: 20px;
188
+ --spacing-padding-pd-padding-24: 24px;
189
+ --spacing-padding-pd-padding-32: 32px;
190
+ --spacing-padding-pd-padding-40: 40px;
191
+ --spacing-padding-pd-padding-48: 48px;
192
+ --spacing-padding-pd-padding-64: 64px;
193
+ --spacing-padding-pd-padding-72: 72px;
194
+ --spacing-padding-pd-padding-80: 80px;
195
195
  --border-radius-pd-radius-none: 0;
196
- --border-radius-pd-radius-xs: 0.25rem;
197
- --border-radius-pd-radius-sm: 0.5rem;
198
- --border-radius-pd-radius-md: 0.75rem;
199
- --border-radius-pd-radius-lg: 1rem;
200
- --border-radius-pd-radius-lg-increased: 1.25rem;
201
- --border-radius-pd-radius-xl: 1.5rem;
202
- --border-radius-pd-radius-xl-increased: 2rem;
203
- --border-radius-pd-radius-full: 62.4375rem;
204
- --border-width-pd-stroke-thin: 0.0625rem;
205
- --border-width-pd-stroke-medium: 0.09375rem;
206
- --border-width-pd-stroke-thick: 0.125rem;
207
- --border-width-pd-stroke-heavier: 0.1875rem;
208
- --border-width-pd-stroke-bold: 0.25rem;
209
- --pd-size-xxs: 0.75rem;
210
- --pd-size-xs: 1rem;
211
- --pd-size-sm: 1.25rem;
212
- --pd-size-md: 1.5rem;
213
- --pd-size-lg: 2rem;
214
- --pd-size-xl: 3rem;
215
- --pd-hover: 0.5rem;
216
- --pd-focused: 0.75rem;
217
- --pd-pressed: 0.625rem;
218
- --pd-disabled-container: 3rem;
219
- --pd-disabled-content: 4rem;
220
- --pd-scrim: 0.625rem;
196
+ --border-radius-pd-radius-xs: 4px;
197
+ --border-radius-pd-radius-sm: 8px;
198
+ --border-radius-pd-radius-md: 12px;
199
+ --border-radius-pd-radius-lg: 16px;
200
+ --border-radius-pd-radius-lg-increased: 20px;
201
+ --border-radius-pd-radius-xl: 24px;
202
+ --border-radius-pd-radius-xl-increased: 32px;
203
+ --border-radius-pd-radius-full: 999px;
204
+ --border-width-pd-stroke-thin: 1px;
205
+ --border-width-pd-stroke-medium: 2px;
206
+ --border-width-pd-stroke-thick: 2px;
207
+ --border-width-pd-stroke-heavier: 3px;
208
+ --border-width-pd-stroke-bold: 4px;
209
+ --pd-size-xxs: 12px;
210
+ --pd-size-xs: 16px;
211
+ --pd-size-sm: 20px;
212
+ --pd-size-md: 24px;
213
+ --pd-size-lg: 32px;
214
+ --pd-size-xl: 48px;
215
+ --pd-hover: 8px;
216
+ --pd-focused: 12px;
217
+ --pd-pressed: 10px;
218
+ --pd-disabled-container: 48px;
219
+ --pd-disabled-content: 64px;
220
+ --pd-scrim: 10px;
221
221
  }
package/src/tokens/themes/brand-b.css CHANGED
@@ -193,66 +193,66 @@
193
193
  --font-title: inter tight;
194
194
  --font-body: inter tight;
195
195
  --font-label: ibm plex mono;
196
- --size-xs: 0.75rem;
197
- --size-sm: 0.875rem;
198
- --size-base: 1rem;
199
- --size-lg: 1.25rem;
200
- --size-xl: 1.5rem;
201
- --size-2xl: 1.75rem;
202
- --size-3xl: 2rem;
203
- --size-4xl: 2.5rem;
204
- --size-5xl: 3rem;
205
- --size-6xl: 4rem;
206
- --size-7xl: 4.5rem;
207
- --size-8xl: 5rem;
196
+ --size-xs: 12px;
197
+ --size-sm: 14px;
198
+ --size-base: 16px;
199
+ --size-lg: 20px;
200
+ --size-xl: 24px;
201
+ --size-2xl: 28px;
202
+ --size-3xl: 32px;
203
+ --size-4xl: 40px;
204
+ --size-5xl: 48px;
205
+ --size-6xl: 64px;
206
+ --size-7xl: 72px;
207
+ --size-8xl: 80px;
208
208
  --weight-400: regular;
209
209
  --weight-500: medium;
210
210
  --weight-600: semibold;
211
211
  --weight-700: bold;
212
212
  --spacing-0: 0;
213
- --spacing-100: 0.25rem;
214
- --spacing-150: 0.375rem;
215
- --spacing-200: 0.5rem;
216
- --spacing-300: 0.75rem;
217
- --spacing-400: 1rem;
218
- --spacing-500: 1.25rem;
219
- --spacing-600: 1.5rem;
220
- --spacing-800: 2rem;
221
- --spacing-1000: 2.5rem;
222
- --spacing-1200: 3rem;
223
- --spacing-1600: 4rem;
224
- --spacing-1800: 4.5rem;
225
- --spacing-2000: 5rem;
226
- --spacing--600: -1.5rem;
227
- --spacing--400: -1rem;
228
- --spacing--200: -0.5rem;
229
- --spacing--100: -0.25rem;
230
- --spacing-025: 0.0625rem;
231
- --spacing-050: 0.125rem;
232
- --border-width-thin: 0.0625rem;
233
- --border-width-medium: 0.09375rem;
234
- --border-width-thick: 0.125rem;
235
- --border-width-heavier: 0.1875rem;
236
- --border-width-bold: 0.25rem;
213
+ --spacing-100: 4px;
214
+ --spacing-150: 6px;
215
+ --spacing-200: 8px;
216
+ --spacing-300: 12px;
217
+ --spacing-400: 16px;
218
+ --spacing-500: 20px;
219
+ --spacing-600: 24px;
220
+ --spacing-800: 32px;
221
+ --spacing-1000: 40px;
222
+ --spacing-1200: 48px;
223
+ --spacing-1600: 64px;
224
+ --spacing-1800: 72px;
225
+ --spacing-2000: 80px;
226
+ --spacing--600: -24px;
227
+ --spacing--400: -16px;
228
+ --spacing--200: -8px;
229
+ --spacing--100: -4px;
230
+ --spacing-025: 1px;
231
+ --spacing-050: 2px;
232
+ --border-width-thin: 1px;
233
+ --border-width-medium: 2px;
234
+ --border-width-thick: 2px;
235
+ --border-width-heavier: 3px;
236
+ --border-width-bold: 4px;
237
237
  --border-radius-none: 0;
238
- --border-radius-xs: 0.25rem;
239
- --border-radius-sm: 0.5rem;
240
- --border-radius-md: 0.75rem;
241
- --border-radius-lg: 1rem;
242
- --border-radius-lg-increased: 1.25rem;
243
- --border-radius-xl: 1.5rem;
244
- --border-radius-xl-increased: 2rem;
245
- --border-radius-full: 62.4375rem;
246
- --xxs: 0.75rem;
247
- --xs: 1rem;
248
- --sm: 1.25rem;
249
- --md: 1.5rem;
250
- --lg: 2rem;
251
- --xl: 3rem;
252
- --hover: 0.625rem;
253
- --focused: 1rem;
254
- --pressed: 1.25rem;
255
- --disabled-container: 1.25rem;
256
- --disabled-content: 1.25rem;
257
- --scrim: 0.625rem;
238
+ --border-radius-xs: 4px;
239
+ --border-radius-sm: 8px;
240
+ --border-radius-md: 12px;
241
+ --border-radius-lg: 16px;
242
+ --border-radius-lg-increased: 20px;
243
+ --border-radius-xl: 24px;
244
+ --border-radius-xl-increased: 32px;
245
+ --border-radius-full: 999px;
246
+ --xxs: 12px;
247
+ --xs: 16px;
248
+ --sm: 20px;
249
+ --md: 24px;
250
+ --lg: 32px;
251
+ --xl: 48px;
252
+ --hover: 10px;
253
+ --focused: 16px;
254
+ --pressed: 20px;
255
+ --disabled-container: 20px;
256
+ --disabled-content: 20px;
257
+ --scrim: 10px;
258
258
  }
package/src/tokens/themes/brand-c.css CHANGED
@@ -193,66 +193,66 @@
193
193
  --font-title: dm sans;
194
194
  --font-body: dm sans;
195
195
  --font-label: dm mono;
196
- --size-xs: 0.75rem;
197
- --size-sm: 0.875rem;
198
- --size-base: 1rem;
199
- --size-lg: 1.25rem;
200
- --size-xl: 1.5rem;
201
- --size-2xl: 1.75rem;
202
- --size-3xl: 2rem;
203
- --size-4xl: 2.5rem;
204
- --size-5xl: 3rem;
205
- --size-6xl: 4rem;
206
- --size-7xl: 4.5rem;
207
- --size-8xl: 5rem;
196
+ --size-xs: 12px;
197
+ --size-sm: 14px;
198
+ --size-base: 16px;
199
+ --size-lg: 20px;
200
+ --size-xl: 24px;
201
+ --size-2xl: 28px;
202
+ --size-3xl: 32px;
203
+ --size-4xl: 40px;
204
+ --size-5xl: 48px;
205
+ --size-6xl: 64px;
206
+ --size-7xl: 72px;
207
+ --size-8xl: 80px;
208
208
  --weight-400: regular;
209
209
  --weight-500: medium;
210
210
  --weight-600: semibold;
211
211
  --weight-700: bold;
212
212
  --spacing-0: 0;
213
- --spacing-100: 0.25rem;
214
- --spacing-150: 0.375rem;
215
- --spacing-200: 0.5rem;
216
- --spacing-300: 0.75rem;
217
- --spacing-400: 1rem;
218
- --spacing-500: 1.25rem;
219
- --spacing-600: 1.5rem;
220
- --spacing-800: 2rem;
221
- --spacing-1000: 2.5rem;
222
- --spacing-1200: 3rem;
223
- --spacing-1600: 4rem;
224
- --spacing-1800: 4.5rem;
225
- --spacing-2000: 5rem;
226
- --spacing--600: -1.5rem;
227
- --spacing--400: -1rem;
228
- --spacing--200: -0.5rem;
229
- --spacing--100: -0.25rem;
230
- --spacing-025: 0.0625rem;
231
- --spacing-050: 0.125rem;
232
- --border-width-thin: 0.0625rem;
233
- --border-width-medium: 0.09375rem;
234
- --border-width-thick: 0.125rem;
235
- --border-width-heavier: 0.1875rem;
236
- --border-width-bold: 0.25rem;
213
+ --spacing-100: 4px;
214
+ --spacing-150: 6px;
215
+ --spacing-200: 8px;
216
+ --spacing-300: 12px;
217
+ --spacing-400: 16px;
218
+ --spacing-500: 20px;
219
+ --spacing-600: 24px;
220
+ --spacing-800: 32px;
221
+ --spacing-1000: 40px;
222
+ --spacing-1200: 48px;
223
+ --spacing-1600: 64px;
224
+ --spacing-1800: 72px;
225
+ --spacing-2000: 80px;
226
+ --spacing--600: -24px;
227
+ --spacing--400: -16px;
228
+ --spacing--200: -8px;
229
+ --spacing--100: -4px;
230
+ --spacing-025: 1px;
231
+ --spacing-050: 2px;
232
+ --border-width-thin: 1px;
233
+ --border-width-medium: 2px;
234
+ --border-width-thick: 2px;
235
+ --border-width-heavier: 3px;
236
+ --border-width-bold: 4px;
237
237
  --border-radius-none: 0;
238
- --border-radius-xs: 0.25rem;
239
- --border-radius-sm: 0.5rem;
240
- --border-radius-md: 0.75rem;
241
- --border-radius-lg: 1rem;
242
- --border-radius-lg-increased: 1.25rem;
243
- --border-radius-xl: 1.5rem;
244
- --border-radius-xl-increased: 2rem;
245
- --border-radius-full: 62.4375rem;
246
- --xxs: 0.75rem;
247
- --xs: 1rem;
248
- --sm: 1.25rem;
249
- --md: 1.5rem;
250
- --lg: 2rem;
251
- --xl: 3rem;
252
- --hover: 0.625rem;
253
- --focused: 1rem;
254
- --pressed: 1.25rem;
255
- --disabled-container: 1.25rem;
256
- --disabled-content: 1.25rem;
257
- --scrim: 0.625rem;
238
+ --border-radius-xs: 4px;
239
+ --border-radius-sm: 8px;
240
+ --border-radius-md: 12px;
241
+ --border-radius-lg: 16px;
242
+ --border-radius-lg-increased: 20px;
243
+ --border-radius-xl: 24px;
244
+ --border-radius-xl-increased: 32px;
245
+ --border-radius-full: 999px;
246
+ --xxs: 12px;
247
+ --xs: 16px;
248
+ --sm: 20px;
249
+ --md: 24px;
250
+ --lg: 32px;
251
+ --xl: 48px;
252
+ --hover: 10px;
253
+ --focused: 16px;
254
+ --pressed: 20px;
255
+ --disabled-container: 20px;
256
+ --disabled-content: 20px;
257
+ --scrim: 10px;
258
258
  }
package/src/tokens/themes/compsych.css CHANGED
@@ -193,66 +193,66 @@
193
193
  --font-title: google sans;
194
194
  --font-body: google sans;
195
195
  --font-label: google sans;
196
- --size-xs: 0.75rem;
197
- --size-sm: 0.875rem;
198
- --size-base: 1rem;
199
- --size-lg: 1.25rem;
200
- --size-xl: 1.5rem;
201
- --size-2xl: 1.75rem;
202
- --size-3xl: 2rem;
203
- --size-4xl: 2.5rem;
204
- --size-5xl: 3rem;
205
- --size-6xl: 4rem;
206
- --size-7xl: 4.5rem;
207
- --size-8xl: 5rem;
196
+ --size-xs: 12px;
197
+ --size-sm: 14px;
198
+ --size-base: 16px;
199
+ --size-lg: 20px;
200
+ --size-xl: 24px;
201
+ --size-2xl: 28px;
202
+ --size-3xl: 32px;
203
+ --size-4xl: 40px;
204
+ --size-5xl: 48px;
205
+ --size-6xl: 64px;
206
+ --size-7xl: 72px;
207
+ --size-8xl: 80px;
208
208
  --weight-400: regular;
209
209
  --weight-500: medium;
210
210
  --weight-600: semibold;
211
211
  --weight-700: bold;
212
212
  --spacing-0: 0;
213
- --spacing-100: 0.25rem;
214
- --spacing-150: 0.375rem;
215
- --spacing-200: 0.5rem;
216
- --spacing-300: 0.75rem;
217
- --spacing-400: 1rem;
218
- --spacing-500: 1.25rem;
219
- --spacing-600: 1.5rem;
220
- --spacing-800: 2rem;
221
- --spacing-1000: 2.5rem;
222
- --spacing-1200: 3rem;
223
- --spacing-1600: 4rem;
224
- --spacing-1800: 4.5rem;
225
- --spacing-2000: 5rem;
226
- --spacing--600: -1.5rem;
227
- --spacing--400: -1rem;
228
- --spacing--200: -0.5rem;
229
- --spacing--100: -0.25rem;
230
- --spacing-025: 0.0625rem;
231
- --spacing-050: 0.125rem;
232
- --border-width-thin: 0.0625rem;
233
- --border-width-medium: 0.09375rem;
234
- --border-width-thick: 0.125rem;
235
- --border-width-heavier: 0.1875rem;
236
- --border-width-bold: 0.25rem;
213
+ --spacing-100: 4px;
214
+ --spacing-150: 6px;
215
+ --spacing-200: 8px;
216
+ --spacing-300: 12px;
217
+ --spacing-400: 16px;
218
+ --spacing-500: 20px;
219
+ --spacing-600: 24px;
220
+ --spacing-800: 32px;
221
+ --spacing-1000: 40px;
222
+ --spacing-1200: 48px;
223
+ --spacing-1600: 64px;
224
+ --spacing-1800: 72px;
225
+ --spacing-2000: 80px;
226
+ --spacing--600: -24px;
227
+ --spacing--400: -16px;
228
+ --spacing--200: -8px;
229
+ --spacing--100: -4px;
230
+ --spacing-025: 1px;
231
+ --spacing-050: 2px;
232
+ --border-width-thin: 1px;
233
+ --border-width-medium: 2px;
234
+ --border-width-thick: 2px;
235
+ --border-width-heavier: 3px;
236
+ --border-width-bold: 4px;
237
237
  --border-radius-none: 0;
238
- --border-radius-xs: 0.25rem;
239
- --border-radius-sm: 0.5rem;
240
- --border-radius-md: 0.75rem;
241
- --border-radius-lg: 1rem;
242
- --border-radius-lg-increased: 1.25rem;
243
- --border-radius-xl: 1.5rem;
244
- --border-radius-xl-increased: 2rem;
245
- --border-radius-full: 62.4375rem;
246
- --xxs: 0.75rem;
247
- --xs: 1rem;
248
- --sm: 1.25rem;
249
- --md: 1.5rem;
250
- --lg: 2rem;
251
- --xl: 3rem;
252
- --hover: 0.5rem;
253
- --focused: 0.75rem;
254
- --pressed: 0.625rem;
255
- --disabled-container: 3rem;
256
- --disabled-content: 4rem;
257
- --scrim: 0.625rem;
238
+ --border-radius-xs: 4px;
239
+ --border-radius-sm: 8px;
240
+ --border-radius-md: 12px;
241
+ --border-radius-lg: 16px;
242
+ --border-radius-lg-increased: 20px;
243
+ --border-radius-xl: 24px;
244
+ --border-radius-xl-increased: 32px;
245
+ --border-radius-full: 999px;
246
+ --xxs: 12px;
247
+ --xs: 16px;
248
+ --sm: 20px;
249
+ --md: 24px;
250
+ --lg: 32px;
251
+ --xl: 48px;
252
+ --hover: 8px;
253
+ --focused: 12px;
254
+ --pressed: 10px;
255
+ --disabled-container: 48px;
256
+ --disabled-content: 64px;
257
+ --scrim: 10px;
258
258
  }