@fremtind/jokul 5.0.0-next.3 → 5.0.0-next.5

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 (52) hide show
  1. package/build/build-stats.html +1 -1
  2. package/package.json +1 -1
  3. package/styles/base.css +362 -207
  4. package/styles/base.min.css +1 -1
  5. package/styles/components/countdown/countdown.css +2 -2
  6. package/styles/components/countdown/countdown.min.css +1 -1
  7. package/styles/components/feedback/feedback.css +2 -2
  8. package/styles/components/feedback/feedback.min.css +1 -1
  9. package/styles/components/file-input/file-input.css +9 -9
  10. package/styles/components/file-input/file-input.min.css +1 -1
  11. package/styles/components/input-group/input-group.css +2 -2
  12. package/styles/components/input-group/input-group.min.css +1 -1
  13. package/styles/components/loader/loader.css +6 -6
  14. package/styles/components/loader/loader.min.css +1 -1
  15. package/styles/components/loader/skeleton-loader.css +3 -3
  16. package/styles/components/loader/skeleton-loader.min.css +1 -1
  17. package/styles/components/message/message.css +2 -2
  18. package/styles/components/message/message.min.css +1 -1
  19. package/styles/components/progress-bar/progress-bar.css +1 -1
  20. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  21. package/styles/components/segmented-control/segmented-control.css +2 -2
  22. package/styles/components/segmented-control/segmented-control.min.css +1 -1
  23. package/styles/components/system-message/system-message.css +2 -2
  24. package/styles/components/system-message/system-message.min.css +1 -1
  25. package/styles/components/toast/toast.css +4 -4
  26. package/styles/components/toast/toast.min.css +1 -1
  27. package/styles/components.css +24 -24
  28. package/styles/components.min.css +1 -1
  29. package/styles/theme/_index.scss +4 -6
  30. package/styles/theme/_tokens.scss +3 -3
  31. package/styles/theme/brands/dnb/_fonts.scss +3 -3
  32. package/styles/theme/brands/dnb/_index.scss +2 -0
  33. package/styles/theme/brands/eika/_fonts.scss +3 -3
  34. package/styles/theme/brands/eika/_index.scss +2 -0
  35. package/styles/theme/brands/jokul/_fonts.scss +3 -3
  36. package/styles/theme/brands/jokul/_index.scss +2 -0
  37. package/styles/theme/brands/sparebank1/_fonts.scss +3 -3
  38. package/styles/theme/brands/sparebank1/_index.scss +2 -0
  39. package/build/cjs/core/tokens.cjs +0 -2
  40. package/build/cjs/core/tokens.cjs.map +0 -1
  41. package/build/cjs/core/tokens.d.cts +0 -593
  42. package/build/es/core/tokens.d.ts +0 -593
  43. package/build/es/core/tokens.js +0 -2
  44. package/build/es/core/tokens.js.map +0 -1
  45. package/styles/core/jkl/_tokens.scss +0 -59
  46. package/styles/core/jkl/legacy/_dynamic-colors.scss +0 -40
  47. package/styles/core/jkl/legacy/_tokens.scss +0 -742
  48. package/styles/core/theme/_color-tokens.scss +0 -73
  49. package/styles/core/theme/_legacy-color-tokens.scss +0 -81
  50. package/styles/core/theme/_legacy-tokens.scss +0 -279
  51. package/styles/core/theme/_spacing-tokens.scss +0 -33
  52. package/styles/core/theme/_tokens.scss +0 -33
@@ -1,742 +0,0 @@
1
-
2
- /**
3
- * Do not edit directly, this file was auto-generated.
4
- */
5
-
6
- $border-width-1: 0.0625rem !default;
7
- $border-width-2: 0.125rem !default;
8
- $border-width-3: 0.1875rem !default;
9
- $border-radius-none: 0 !default;
10
- $border-radius-xs: 0.25rem !default;
11
- $border-radius-s: 0.5rem !default;
12
- $border-radius-m: 0.75rem !default;
13
- $border-radius-l: 1rem !default;
14
- $border-radius-full: 9999px !default;
15
- $breakpoint-small: 0 !default;
16
- $breakpoint-medium: 680px !default;
17
- $breakpoint-large: 1200px !default;
18
- $breakpoint-xl: 1600px !default;
19
- $color-brand-snohvit: #F9F9F9 !default;
20
- $color-brand-varde: #E0DBD4 !default;
21
- $color-brand-granitt: #1B1917 !default;
22
- $color-brand-hvit: #FFFFFF !default;
23
- $color-brand-svart: #000000 !default;
24
- $color-brand-skifer: #313030 !default;
25
- $color-brand-fjellgra: #444141 !default;
26
- $color-brand-stein: #636060 !default;
27
- $color-brand-svaberg: #C8C5C3 !default;
28
- $color-brand-dis: #ECE9E5 !default;
29
- $color-brand-sand: #F4F2EF !default;
30
- $color-functional-info: #D3D3F6 !default;
31
- $color-functional-info-dark: #A9A9CA !default;
32
- $color-functional-success: #ACD3B5 !default;
33
- $color-functional-success-dark: #94B79B !default;
34
- $color-functional-warning: #EFDD9E !default;
35
- $color-functional-warning-dark: #DECC8D !default;
36
- $color-functional-error: #F6B3B3 !default;
37
- $color-functional-error-dark: #DE9E9E !default;
38
- $color-svart: #000 !default;
39
- $color-granitt: #1b1917 !default;
40
- $color-skifer: #313030 !default;
41
- $color-fjellgra: #444141 !default;
42
- $color-stein: #636060 !default;
43
- $color-svaberg: #c8c5c3 !default;
44
- $color-varde: #e0dbd4 !default;
45
- $color-dis: #ece9e5 !default;
46
- $color-sand: #f4f2ef !default;
47
- $color-snohvit: #f9f9f9 !default;
48
- $color-hvit: #fff !default;
49
- $color-suksess: #acd3b5 !default;
50
- $color-suksess-dark: #94b79b !default;
51
- $color-feil: #f6b3b3 !default;
52
- $color-feil-dark: #de9e9e !default;
53
- $color-info: #d3d3f6 !default;
54
- $color-info-dark: #a9a9ca !default;
55
- $color-advarsel: #efdd9e !default;
56
- $color-advarsel-dark: #decc8d !default;
57
- $motion-timing-energetic: 75ms !default;
58
- $motion-timing-snappy: 100ms !default;
59
- $motion-timing-productive: 150ms !default;
60
- $motion-timing-expressive: 250ms !default;
61
- $motion-timing-lazy: 400ms !default;
62
- $motion-easing-standard: ease !default;
63
- $motion-easing-entrance: ease-out !default;
64
- $motion-easing-exit: ease-in !default;
65
- $motion-easing-ease-in-bounce-out: cubic-bezier(0, 0, 0.375, 1.17) !default;
66
- $motion-easing-focus: cubic-bezier(0.6, 0.2, 0.35, 1) !default;
67
- $spacing-0: 0rem !default;
68
- $spacing-2: 0.125rem !default;
69
- $spacing-4: 0.25rem !default;
70
- $spacing-8: 0.5rem !default;
71
- $spacing-12: 0.75rem !default;
72
- $spacing-16: 1rem !default;
73
- $spacing-24: 1.5rem !default;
74
- $spacing-32: 2rem !default;
75
- $spacing-40: 2.5rem !default;
76
- $spacing-64: 4rem !default;
77
- $spacing-104: 6.5rem !default;
78
- $spacing-168: 10.5rem !default;
79
- $semantic-spacing-none: 0 !default;
80
- $semantic-spacing-2xs: 0.25rem !default;
81
- $semantic-spacing-xs: 0.5rem !default;
82
- $semantic-spacing-s: 1rem !default;
83
- $semantic-spacing-m: 1.5rem !default;
84
- $semantic-spacing-l: 2.5rem !default;
85
- $semantic-spacing-xl: 4rem !default;
86
- $semantic-spacing-2xl: 6.5rem !default;
87
- $icon-weight-normal: 300 !default;
88
- $icon-weight-bold: 400 !default;
89
- $typography-weight-normal: 400 !default;
90
- $typography-weight-bold: 700 !default;
91
- $typography-font-weight-normal: 400 !default;
92
- $typography-font-weight-bold: 700 !default;
93
- $typography-font-size-1: var(--jkl-font-size-1) !default;
94
- $typography-font-size-2: var(--jkl-font-size-2) !default;
95
- $typography-font-size-3: var(--jkl-font-size-3) !default;
96
- $typography-font-size-4: var(--jkl-font-size-4) !default;
97
- $typography-font-size-5: var(--jkl-font-size-5) !default;
98
- $typography-font-size-6: var(--jkl-font-size-6) !default;
99
- $typography-font-size-7: var(--jkl-font-size-7) !default;
100
- $typography-font-size-8: var(--jkl-font-size-8) !default;
101
- $typography-font-size-9: var(--jkl-font-size-9) !default;
102
- $typography-font-size-10: var(--jkl-font-size-10) !default;
103
- $typography-font-size-16: 1rem !default;
104
- $typography-font-size-18: 1.125rem !default;
105
- $typography-font-size-20: 1.25rem !default;
106
- $typography-font-size-21: 1.3125rem !default;
107
- $typography-font-size-23: 1.4375rem !default;
108
- $typography-font-size-25: 1.5625rem !default;
109
- $typography-font-size-26: 1.625rem !default;
110
- $typography-font-size-28: 1.75rem !default;
111
- $typography-font-size-30: 1.875rem !default;
112
- $typography-font-size-36: 2.25rem !default;
113
- $typography-font-size-44: 2.75rem !default;
114
- $typography-font-size-56: 3.5rem !default;
115
- $typography-line-height-24: 1.5rem !default;
116
- $typography-line-height-28: 1.75rem !default;
117
- $typography-line-height-32: 2rem !default;
118
- $typography-line-height-36: 2.25rem !default;
119
- $typography-line-height-40: 2.5rem !default;
120
- $typography-line-height-44: 2.75rem !default;
121
- $typography-line-height-52: 3.25rem !default;
122
- $typography-line-height-64: 4rem !default;
123
- $typography-line-height-flush: var(--jkl-line-height-flush) !default;
124
- $typography-line-height-tight: var(--jkl-line-height-tight) !default;
125
- $typography-line-height-relaxed: var(--jkl-line-height-relaxed) !default;
126
- $typography-style-title-small-font-size: var(--jkl-font-size-8) !default;
127
- $typography-style-title-small-line-height: var(--jkl-line-height-tight) !default;
128
- $typography-style-title-small-font-weight: 400 !default;
129
- $typography-style-title-base-font-size: var(--jkl-font-size-8) !default;
130
- $typography-style-title-base-line-height: var(--jkl-line-height-tight) !default;
131
- $typography-style-title-base-font-weight: 400 !default;
132
- $typography-style-title-small-small-font-size: var(--jkl-font-size-7) !default;
133
- $typography-style-title-small-small-line-height: var(--jkl-line-height-tight) !default;
134
- $typography-style-title-small-small-font-weight: 400 !default;
135
- $typography-style-title-small-base-font-size: var(--jkl-font-size-7) !default;
136
- $typography-style-title-small-base-line-height: var(--jkl-line-height-tight) !default;
137
- $typography-style-title-small-base-font-weight: 400 !default;
138
- $typography-style-heading-1-small-font-size: var(--jkl-font-size-8) !default;
139
- $typography-style-heading-1-small-line-height: var(--jkl-line-height-tight) !default;
140
- $typography-style-heading-1-small-font-weight: 400 !default;
141
- $typography-style-heading-1-base-font-size: var(--jkl-font-size-8) !default;
142
- $typography-style-heading-1-base-line-height: var(--jkl-line-height-tight) !default;
143
- $typography-style-heading-1-base-font-weight: 400 !default;
144
- $typography-style-heading-2-small-font-size: var(--jkl-font-size-7) !default;
145
- $typography-style-heading-2-small-line-height: var(--jkl-line-height-tight) !default;
146
- $typography-style-heading-2-small-font-weight: 400 !default;
147
- $typography-style-heading-2-base-font-size: var(--jkl-font-size-7) !default;
148
- $typography-style-heading-2-base-line-height: var(--jkl-line-height-tight) !default;
149
- $typography-style-heading-2-base-font-weight: 400 !default;
150
- $typography-style-heading-3-small-font-size: var(--jkl-font-size-6) !default;
151
- $typography-style-heading-3-small-line-height: var(--jkl-line-height-tight) !default;
152
- $typography-style-heading-3-small-font-weight: 700 !default;
153
- $typography-style-heading-3-base-font-size: var(--jkl-font-size-6) !default;
154
- $typography-style-heading-3-base-line-height: var(--jkl-line-height-tight) !default;
155
- $typography-style-heading-3-base-font-weight: 700 !default;
156
- $typography-style-heading-4-small-font-size: var(--jkl-font-size-5) !default;
157
- $typography-style-heading-4-small-line-height: var(--jkl-line-height-tight) !default;
158
- $typography-style-heading-4-small-font-weight: 700 !default;
159
- $typography-style-heading-4-base-font-size: var(--jkl-font-size-5) !default;
160
- $typography-style-heading-4-base-line-height: var(--jkl-line-height-tight) !default;
161
- $typography-style-heading-4-base-font-weight: 700 !default;
162
- $typography-style-heading-5-small-font-size: var(--jkl-font-size-4) !default;
163
- $typography-style-heading-5-small-line-height: var(--jkl-line-height-tight) !default;
164
- $typography-style-heading-5-small-font-weight: 700 !default;
165
- $typography-style-heading-5-base-font-size: var(--jkl-font-size-4) !default;
166
- $typography-style-heading-5-base-line-height: var(--jkl-line-height-tight) !default;
167
- $typography-style-heading-5-base-font-weight: 700 !default;
168
- $typography-style-paragraph-large-small-font-size: var(--jkl-font-size-5) !default;
169
- $typography-style-paragraph-large-small-line-height: var(--jkl-line-height-relaxed) !default;
170
- $typography-style-paragraph-large-small-font-weight: 400 !default;
171
- $typography-style-paragraph-large-base-font-size: var(--jkl-font-size-5) !default;
172
- $typography-style-paragraph-large-base-line-height: var(--jkl-line-height-relaxed) !default;
173
- $typography-style-paragraph-large-base-font-weight: 400 !default;
174
- $typography-style-paragraph-medium-small-font-size: var(--jkl-font-size-3) !default;
175
- $typography-style-paragraph-medium-small-line-height: var(--jkl-line-height-relaxed) !default;
176
- $typography-style-paragraph-medium-small-font-weight: 400 !default;
177
- $typography-style-paragraph-medium-base-font-size: var(--jkl-font-size-3) !default;
178
- $typography-style-paragraph-medium-base-line-height: var(--jkl-line-height-relaxed) !default;
179
- $typography-style-paragraph-medium-base-font-weight: 400 !default;
180
- $typography-style-paragraph-small-small-font-size: var(--jkl-font-size-2) !default;
181
- $typography-style-paragraph-small-small-line-height: var(--jkl-line-height-relaxed) !default;
182
- $typography-style-paragraph-small-small-font-weight: 400 !default;
183
- $typography-style-paragraph-small-base-font-size: var(--jkl-font-size-2) !default;
184
- $typography-style-paragraph-small-base-line-height: var(--jkl-line-height-relaxed) !default;
185
- $typography-style-paragraph-small-base-font-weight: 400 !default;
186
- $typography-style-text-large-small-font-size: var(--jkl-font-size-5) !default;
187
- $typography-style-text-large-small-line-height: var(--jkl-line-height-tight) !default;
188
- $typography-style-text-large-small-font-weight: 400 !default;
189
- $typography-style-text-large-base-font-size: var(--jkl-font-size-5) !default;
190
- $typography-style-text-large-base-line-height: var(--jkl-line-height-tight) !default;
191
- $typography-style-text-large-base-font-weight: 400 !default;
192
- $typography-style-text-medium-small-font-size: var(--jkl-font-size-3) !default;
193
- $typography-style-text-medium-small-line-height: var(--jkl-line-height-tight) !default;
194
- $typography-style-text-medium-small-font-weight: 400 !default;
195
- $typography-style-text-medium-base-font-size: var(--jkl-font-size-3) !default;
196
- $typography-style-text-medium-base-line-height: var(--jkl-line-height-tight) !default;
197
- $typography-style-text-medium-base-font-weight: 400 !default;
198
- $typography-style-text-small-small-font-size: var(--jkl-font-size-2) !default;
199
- $typography-style-text-small-small-line-height: var(--jkl-line-height-tight) !default;
200
- $typography-style-text-small-small-font-weight: 400 !default;
201
- $typography-style-text-small-base-font-size: var(--jkl-font-size-2) !default;
202
- $typography-style-text-small-base-line-height: var(--jkl-line-height-tight) !default;
203
- $typography-style-text-small-base-font-weight: 400 !default;
204
- $typography-style-text-micro-small-font-size: var(--jkl-font-size-1) !default;
205
- $typography-style-text-micro-small-line-height: var(--jkl-line-height-tight) !default;
206
- $typography-style-text-micro-small-font-weight: 400 !default;
207
- $typography-style-text-micro-base-font-size: var(--jkl-font-size-1) !default;
208
- $typography-style-text-micro-base-line-height: var(--jkl-line-height-tight) !default;
209
- $typography-style-text-micro-base-font-weight: 400 !default;
210
- $typography-style-body-small-font-size: 1.125rem !default;
211
- $typography-style-body-small-line-height: 1.75rem !default;
212
- $typography-style-body-small-font-weight: 400 !default;
213
- $typography-style-body-base-font-size: 1.25rem !default;
214
- $typography-style-body-base-line-height: 2rem !default;
215
- $typography-style-body-base-font-weight: 400 !default;
216
- $typography-style-small-small-font-size: 1rem !default;
217
- $typography-style-small-small-line-height: 1.5rem !default;
218
- $typography-style-small-small-font-weight: 400 !default;
219
- $typography-style-small-base-font-size: 1rem !default;
220
- $typography-style-small-base-line-height: 1.5rem !default;
221
- $typography-style-small-base-font-weight: 400 !default;
222
- $typography-title-small-font-size: 2.25rem !default;
223
- $typography-title-small-line-height: 2.75rem !default;
224
- $typography-title-small-font-weight: 400 !default;
225
- $typography-title-base-font-size: 3.5rem !default;
226
- $typography-title-base-line-height: 4rem !default;
227
- $typography-title-base-font-weight: 400 !default;
228
- $typography-title-small-small-font-size: 1.875rem !default;
229
- $typography-title-small-small-line-height: 2.25rem !default;
230
- $typography-title-small-small-font-weight: 400 !default;
231
- $typography-title-small-base-font-size: 2.75rem !default;
232
- $typography-title-small-base-line-height: 3.25rem !default;
233
- $typography-title-small-base-font-weight: 400 !default;
234
- $typography-heading-1-small-font-size: 1.625rem !default;
235
- $typography-heading-1-small-line-height: 2rem !default;
236
- $typography-heading-1-small-font-weight: 400 !default;
237
- $typography-heading-1-base-font-size: 2.25rem !default;
238
- $typography-heading-1-base-line-height: 2.75rem !default;
239
- $typography-heading-1-base-font-weight: 400 !default;
240
- $typography-heading-2-small-font-size: 1.4375rem !default;
241
- $typography-heading-2-small-line-height: 2rem !default;
242
- $typography-heading-2-small-font-weight: 400 !default;
243
- $typography-heading-2-base-font-size: 1.75rem !default;
244
- $typography-heading-2-base-line-height: 2.5rem !default;
245
- $typography-heading-2-base-font-weight: 400 !default;
246
- $typography-heading-3-small-font-size: 1.3125rem !default;
247
- $typography-heading-3-small-line-height: 1.75rem !default;
248
- $typography-heading-3-small-font-weight: 700 !default;
249
- $typography-heading-3-base-font-size: 1.5625rem !default;
250
- $typography-heading-3-base-line-height: 2rem !default;
251
- $typography-heading-3-base-font-weight: 700 !default;
252
- $typography-heading-4-small-font-size: 1.125rem !default;
253
- $typography-heading-4-small-line-height: 1.5rem !default;
254
- $typography-heading-4-small-font-weight: 700 !default;
255
- $typography-heading-4-base-font-size: 1.3125rem !default;
256
- $typography-heading-4-base-line-height: 1.75rem !default;
257
- $typography-heading-4-base-font-weight: 700 !default;
258
- $typography-heading-5-small-font-size: 1rem !default;
259
- $typography-heading-5-small-line-height: 1.5rem !default;
260
- $typography-heading-5-small-font-weight: 700 !default;
261
- $typography-heading-5-base-font-size: 1rem !default;
262
- $typography-heading-5-base-line-height: 1.5rem !default;
263
- $typography-heading-5-base-font-weight: 700 !default;
264
- $typography-body-small-font-size: 1.125rem !default;
265
- $typography-body-small-line-height: 1.75rem !default;
266
- $typography-body-small-font-weight: 400 !default;
267
- $typography-body-base-font-size: 1.25rem !default;
268
- $typography-body-base-line-height: 2rem !default;
269
- $typography-body-base-font-weight: 400 !default;
270
- $typography-small-small-font-size: 1rem !default;
271
- $typography-small-small-line-height: 1.5rem !default;
272
- $typography-small-small-font-weight: 400 !default;
273
- $typography-small-base-font-size: 1rem !default;
274
- $typography-small-base-line-height: 1.5rem !default;
275
- $typography-small-base-font-weight: 400 !default;
276
-
277
- $tokens: (
278
- 'border': (
279
- 'width': (
280
- '1': $border-width-1,
281
- '2': $border-width-2,
282
- '3': $border-width-3
283
- ),
284
- 'radius': (
285
- 'none': $border-radius-none,
286
- 'xs': $border-radius-xs,
287
- 's': $border-radius-s,
288
- 'm': $border-radius-m,
289
- 'l': $border-radius-l,
290
- 'full': $border-radius-full
291
- )
292
- ),
293
- 'breakpoint': (
294
- 'small': $breakpoint-small,
295
- 'medium': $breakpoint-medium,
296
- 'large': $breakpoint-large,
297
- 'xl': $breakpoint-xl
298
- ),
299
- 'color': (
300
- 'brand': (
301
- 'snohvit': $color-brand-snohvit,
302
- 'varde': $color-brand-varde,
303
- 'granitt': $color-brand-granitt,
304
- 'hvit': $color-brand-hvit,
305
- 'svart': $color-brand-svart,
306
- 'skifer': $color-brand-skifer,
307
- 'fjellgra': $color-brand-fjellgra,
308
- 'stein': $color-brand-stein,
309
- 'svaberg': $color-brand-svaberg,
310
- 'dis': $color-brand-dis,
311
- 'sand': $color-brand-sand
312
- ),
313
- 'functional': (
314
- 'info': $color-functional-info,
315
- 'info-dark': $color-functional-info-dark,
316
- 'success': $color-functional-success,
317
- 'success-dark': $color-functional-success-dark,
318
- 'warning': $color-functional-warning,
319
- 'warning-dark': $color-functional-warning-dark,
320
- 'error': $color-functional-error,
321
- 'error-dark': $color-functional-error-dark
322
- ),
323
- 'svart': $color-svart,
324
- 'granitt': $color-granitt,
325
- 'skifer': $color-skifer,
326
- 'fjellgra': $color-fjellgra,
327
- 'stein': $color-stein,
328
- 'svaberg': $color-svaberg,
329
- 'varde': $color-varde,
330
- 'dis': $color-dis,
331
- 'sand': $color-sand,
332
- 'snohvit': $color-snohvit,
333
- 'hvit': $color-hvit,
334
- 'suksess': $color-suksess,
335
- 'suksess-dark': $color-suksess-dark,
336
- 'feil': $color-feil,
337
- 'feil-dark': $color-feil-dark,
338
- 'info': $color-info,
339
- 'info-dark': $color-info-dark,
340
- 'advarsel': $color-advarsel,
341
- 'advarsel-dark': $color-advarsel-dark
342
- ),
343
- 'motion': (
344
- 'timing': (
345
- 'energetic': $motion-timing-energetic,
346
- 'snappy': $motion-timing-snappy,
347
- 'productive': $motion-timing-productive,
348
- 'expressive': $motion-timing-expressive,
349
- 'lazy': $motion-timing-lazy
350
- ),
351
- 'easing': (
352
- 'standard': $motion-easing-standard,
353
- 'entrance': $motion-easing-entrance,
354
- 'exit': $motion-easing-exit,
355
- 'easeInBounceOut': $motion-easing-ease-in-bounce-out,
356
- 'focus': $motion-easing-focus
357
- )
358
- ),
359
- 'spacing': (
360
- '0': $spacing-0,
361
- '2': $spacing-2,
362
- '4': $spacing-4,
363
- '8': $spacing-8,
364
- '12': $spacing-12,
365
- '16': $spacing-16,
366
- '24': $spacing-24,
367
- '32': $spacing-32,
368
- '40': $spacing-40,
369
- '64': $spacing-64,
370
- '104': $spacing-104,
371
- '168': $spacing-168
372
- ),
373
- 'semantic-spacing': (
374
- 'none': $semantic-spacing-none,
375
- '2xs': $semantic-spacing-2xs,
376
- 'xs': $semantic-spacing-xs,
377
- 's': $semantic-spacing-s,
378
- 'm': $semantic-spacing-m,
379
- 'l': $semantic-spacing-l,
380
- 'xl': $semantic-spacing-xl,
381
- '2xl': $semantic-spacing-2xl
382
- ),
383
- 'icon': (
384
- 'weight': (
385
- 'normal': $icon-weight-normal,
386
- 'bold': $icon-weight-bold
387
- )
388
- ),
389
- 'typography': (
390
- 'weight': (
391
- 'normal': $typography-weight-normal,
392
- 'bold': $typography-weight-bold
393
- ),
394
- 'font': (
395
- 'weight': (
396
- 'normal': $typography-font-weight-normal,
397
- 'bold': $typography-font-weight-bold
398
- ),
399
- 'size': (
400
- '1': $typography-font-size-1,
401
- '2': $typography-font-size-2,
402
- '3': $typography-font-size-3,
403
- '4': $typography-font-size-4,
404
- '5': $typography-font-size-5,
405
- '6': $typography-font-size-6,
406
- '7': $typography-font-size-7,
407
- '8': $typography-font-size-8,
408
- '9': $typography-font-size-9,
409
- '10': $typography-font-size-10,
410
- '16': $typography-font-size-16,
411
- '18': $typography-font-size-18,
412
- '20': $typography-font-size-20,
413
- '21': $typography-font-size-21,
414
- '23': $typography-font-size-23,
415
- '25': $typography-font-size-25,
416
- '26': $typography-font-size-26,
417
- '28': $typography-font-size-28,
418
- '30': $typography-font-size-30,
419
- '36': $typography-font-size-36,
420
- '44': $typography-font-size-44,
421
- '56': $typography-font-size-56
422
- )
423
- ),
424
- 'line': (
425
- 'height': (
426
- '24': $typography-line-height-24,
427
- '28': $typography-line-height-28,
428
- '32': $typography-line-height-32,
429
- '36': $typography-line-height-36,
430
- '40': $typography-line-height-40,
431
- '44': $typography-line-height-44,
432
- '52': $typography-line-height-52,
433
- '64': $typography-line-height-64,
434
- 'flush': $typography-line-height-flush,
435
- 'tight': $typography-line-height-tight,
436
- 'relaxed': $typography-line-height-relaxed
437
- )
438
- ),
439
- 'style': (
440
- 'title': (
441
- 'small': (
442
- 'fontSize': $typography-style-title-small-font-size,
443
- 'lineHeight': $typography-style-title-small-line-height,
444
- 'fontWeight': $typography-style-title-small-font-weight
445
- ),
446
- 'base': (
447
- 'fontSize': $typography-style-title-base-font-size,
448
- 'lineHeight': $typography-style-title-base-line-height,
449
- 'fontWeight': $typography-style-title-base-font-weight
450
- )
451
- ),
452
- 'title-small': (
453
- 'small': (
454
- 'fontSize': $typography-style-title-small-small-font-size,
455
- 'lineHeight': $typography-style-title-small-small-line-height,
456
- 'fontWeight': $typography-style-title-small-small-font-weight
457
- ),
458
- 'base': (
459
- 'fontSize': $typography-style-title-small-base-font-size,
460
- 'lineHeight': $typography-style-title-small-base-line-height,
461
- 'fontWeight': $typography-style-title-small-base-font-weight
462
- )
463
- ),
464
- 'heading-1': (
465
- 'small': (
466
- 'fontSize': $typography-style-heading-1-small-font-size,
467
- 'lineHeight': $typography-style-heading-1-small-line-height,
468
- 'fontWeight': $typography-style-heading-1-small-font-weight
469
- ),
470
- 'base': (
471
- 'fontSize': $typography-style-heading-1-base-font-size,
472
- 'lineHeight': $typography-style-heading-1-base-line-height,
473
- 'fontWeight': $typography-style-heading-1-base-font-weight
474
- )
475
- ),
476
- 'heading-2': (
477
- 'small': (
478
- 'fontSize': $typography-style-heading-2-small-font-size,
479
- 'lineHeight': $typography-style-heading-2-small-line-height,
480
- 'fontWeight': $typography-style-heading-2-small-font-weight
481
- ),
482
- 'base': (
483
- 'fontSize': $typography-style-heading-2-base-font-size,
484
- 'lineHeight': $typography-style-heading-2-base-line-height,
485
- 'fontWeight': $typography-style-heading-2-base-font-weight
486
- )
487
- ),
488
- 'heading-3': (
489
- 'small': (
490
- 'fontSize': $typography-style-heading-3-small-font-size,
491
- 'lineHeight': $typography-style-heading-3-small-line-height,
492
- 'fontWeight': $typography-style-heading-3-small-font-weight
493
- ),
494
- 'base': (
495
- 'fontSize': $typography-style-heading-3-base-font-size,
496
- 'lineHeight': $typography-style-heading-3-base-line-height,
497
- 'fontWeight': $typography-style-heading-3-base-font-weight
498
- )
499
- ),
500
- 'heading-4': (
501
- 'small': (
502
- 'fontSize': $typography-style-heading-4-small-font-size,
503
- 'lineHeight': $typography-style-heading-4-small-line-height,
504
- 'fontWeight': $typography-style-heading-4-small-font-weight
505
- ),
506
- 'base': (
507
- 'fontSize': $typography-style-heading-4-base-font-size,
508
- 'lineHeight': $typography-style-heading-4-base-line-height,
509
- 'fontWeight': $typography-style-heading-4-base-font-weight
510
- )
511
- ),
512
- 'heading-5': (
513
- 'small': (
514
- 'fontSize': $typography-style-heading-5-small-font-size,
515
- 'lineHeight': $typography-style-heading-5-small-line-height,
516
- 'fontWeight': $typography-style-heading-5-small-font-weight
517
- ),
518
- 'base': (
519
- 'fontSize': $typography-style-heading-5-base-font-size,
520
- 'lineHeight': $typography-style-heading-5-base-line-height,
521
- 'fontWeight': $typography-style-heading-5-base-font-weight
522
- )
523
- ),
524
- 'paragraph-large': (
525
- 'small': (
526
- 'fontSize': $typography-style-paragraph-large-small-font-size,
527
- 'lineHeight': $typography-style-paragraph-large-small-line-height,
528
- 'fontWeight': $typography-style-paragraph-large-small-font-weight
529
- ),
530
- 'base': (
531
- 'fontSize': $typography-style-paragraph-large-base-font-size,
532
- 'lineHeight': $typography-style-paragraph-large-base-line-height,
533
- 'fontWeight': $typography-style-paragraph-large-base-font-weight
534
- )
535
- ),
536
- 'paragraph-medium': (
537
- 'small': (
538
- 'fontSize': $typography-style-paragraph-medium-small-font-size,
539
- 'lineHeight': $typography-style-paragraph-medium-small-line-height,
540
- 'fontWeight': $typography-style-paragraph-medium-small-font-weight
541
- ),
542
- 'base': (
543
- 'fontSize': $typography-style-paragraph-medium-base-font-size,
544
- 'lineHeight': $typography-style-paragraph-medium-base-line-height,
545
- 'fontWeight': $typography-style-paragraph-medium-base-font-weight
546
- )
547
- ),
548
- 'paragraph-small': (
549
- 'small': (
550
- 'fontSize': $typography-style-paragraph-small-small-font-size,
551
- 'lineHeight': $typography-style-paragraph-small-small-line-height,
552
- 'fontWeight': $typography-style-paragraph-small-small-font-weight
553
- ),
554
- 'base': (
555
- 'fontSize': $typography-style-paragraph-small-base-font-size,
556
- 'lineHeight': $typography-style-paragraph-small-base-line-height,
557
- 'fontWeight': $typography-style-paragraph-small-base-font-weight
558
- )
559
- ),
560
- 'text-large': (
561
- 'small': (
562
- 'fontSize': $typography-style-text-large-small-font-size,
563
- 'lineHeight': $typography-style-text-large-small-line-height,
564
- 'fontWeight': $typography-style-text-large-small-font-weight
565
- ),
566
- 'base': (
567
- 'fontSize': $typography-style-text-large-base-font-size,
568
- 'lineHeight': $typography-style-text-large-base-line-height,
569
- 'fontWeight': $typography-style-text-large-base-font-weight
570
- )
571
- ),
572
- 'text-medium': (
573
- 'small': (
574
- 'fontSize': $typography-style-text-medium-small-font-size,
575
- 'lineHeight': $typography-style-text-medium-small-line-height,
576
- 'fontWeight': $typography-style-text-medium-small-font-weight
577
- ),
578
- 'base': (
579
- 'fontSize': $typography-style-text-medium-base-font-size,
580
- 'lineHeight': $typography-style-text-medium-base-line-height,
581
- 'fontWeight': $typography-style-text-medium-base-font-weight
582
- )
583
- ),
584
- 'text-small': (
585
- 'small': (
586
- 'fontSize': $typography-style-text-small-small-font-size,
587
- 'lineHeight': $typography-style-text-small-small-line-height,
588
- 'fontWeight': $typography-style-text-small-small-font-weight
589
- ),
590
- 'base': (
591
- 'fontSize': $typography-style-text-small-base-font-size,
592
- 'lineHeight': $typography-style-text-small-base-line-height,
593
- 'fontWeight': $typography-style-text-small-base-font-weight
594
- )
595
- ),
596
- 'text-micro': (
597
- 'small': (
598
- 'fontSize': $typography-style-text-micro-small-font-size,
599
- 'lineHeight': $typography-style-text-micro-small-line-height,
600
- 'fontWeight': $typography-style-text-micro-small-font-weight
601
- ),
602
- 'base': (
603
- 'fontSize': $typography-style-text-micro-base-font-size,
604
- 'lineHeight': $typography-style-text-micro-base-line-height,
605
- 'fontWeight': $typography-style-text-micro-base-font-weight
606
- )
607
- ),
608
- 'body': (
609
- 'small': (
610
- 'fontSize': $typography-style-body-small-font-size,
611
- 'lineHeight': $typography-style-body-small-line-height,
612
- 'fontWeight': $typography-style-body-small-font-weight
613
- ),
614
- 'base': (
615
- 'fontSize': $typography-style-body-base-font-size,
616
- 'lineHeight': $typography-style-body-base-line-height,
617
- 'fontWeight': $typography-style-body-base-font-weight
618
- )
619
- ),
620
- 'small': (
621
- 'small': (
622
- 'fontSize': $typography-style-small-small-font-size,
623
- 'lineHeight': $typography-style-small-small-line-height,
624
- 'fontWeight': $typography-style-small-small-font-weight
625
- ),
626
- 'base': (
627
- 'fontSize': $typography-style-small-base-font-size,
628
- 'lineHeight': $typography-style-small-base-line-height,
629
- 'fontWeight': $typography-style-small-base-font-weight
630
- )
631
- )
632
- ),
633
- 'title': (
634
- 'small': (
635
- 'fontSize': $typography-title-small-font-size,
636
- 'lineHeight': $typography-title-small-line-height,
637
- 'fontWeight': $typography-title-small-font-weight
638
- ),
639
- 'base': (
640
- 'fontSize': $typography-title-base-font-size,
641
- 'lineHeight': $typography-title-base-line-height,
642
- 'fontWeight': $typography-title-base-font-weight
643
- )
644
- ),
645
- 'titleSmall': (
646
- 'small': (
647
- 'fontSize': $typography-title-small-small-font-size,
648
- 'lineHeight': $typography-title-small-small-line-height,
649
- 'fontWeight': $typography-title-small-small-font-weight
650
- ),
651
- 'base': (
652
- 'fontSize': $typography-title-small-base-font-size,
653
- 'lineHeight': $typography-title-small-base-line-height,
654
- 'fontWeight': $typography-title-small-base-font-weight
655
- )
656
- ),
657
- 'heading-1': (
658
- 'small': (
659
- 'fontSize': $typography-heading-1-small-font-size,
660
- 'lineHeight': $typography-heading-1-small-line-height,
661
- 'fontWeight': $typography-heading-1-small-font-weight
662
- ),
663
- 'base': (
664
- 'fontSize': $typography-heading-1-base-font-size,
665
- 'lineHeight': $typography-heading-1-base-line-height,
666
- 'fontWeight': $typography-heading-1-base-font-weight
667
- )
668
- ),
669
- 'heading-2': (
670
- 'small': (
671
- 'fontSize': $typography-heading-2-small-font-size,
672
- 'lineHeight': $typography-heading-2-small-line-height,
673
- 'fontWeight': $typography-heading-2-small-font-weight
674
- ),
675
- 'base': (
676
- 'fontSize': $typography-heading-2-base-font-size,
677
- 'lineHeight': $typography-heading-2-base-line-height,
678
- 'fontWeight': $typography-heading-2-base-font-weight
679
- )
680
- ),
681
- 'heading-3': (
682
- 'small': (
683
- 'fontSize': $typography-heading-3-small-font-size,
684
- 'lineHeight': $typography-heading-3-small-line-height,
685
- 'fontWeight': $typography-heading-3-small-font-weight
686
- ),
687
- 'base': (
688
- 'fontSize': $typography-heading-3-base-font-size,
689
- 'lineHeight': $typography-heading-3-base-line-height,
690
- 'fontWeight': $typography-heading-3-base-font-weight
691
- )
692
- ),
693
- 'heading-4': (
694
- 'small': (
695
- 'fontSize': $typography-heading-4-small-font-size,
696
- 'lineHeight': $typography-heading-4-small-line-height,
697
- 'fontWeight': $typography-heading-4-small-font-weight
698
- ),
699
- 'base': (
700
- 'fontSize': $typography-heading-4-base-font-size,
701
- 'lineHeight': $typography-heading-4-base-line-height,
702
- 'fontWeight': $typography-heading-4-base-font-weight
703
- )
704
- ),
705
- 'heading-5': (
706
- 'small': (
707
- 'fontSize': $typography-heading-5-small-font-size,
708
- 'lineHeight': $typography-heading-5-small-line-height,
709
- 'fontWeight': $typography-heading-5-small-font-weight
710
- ),
711
- 'base': (
712
- 'fontSize': $typography-heading-5-base-font-size,
713
- 'lineHeight': $typography-heading-5-base-line-height,
714
- 'fontWeight': $typography-heading-5-base-font-weight
715
- )
716
- ),
717
- 'body': (
718
- 'small': (
719
- 'fontSize': $typography-body-small-font-size,
720
- 'lineHeight': $typography-body-small-line-height,
721
- 'fontWeight': $typography-body-small-font-weight
722
- ),
723
- 'base': (
724
- 'fontSize': $typography-body-base-font-size,
725
- 'lineHeight': $typography-body-base-line-height,
726
- 'fontWeight': $typography-body-base-font-weight
727
- )
728
- ),
729
- 'small': (
730
- 'small': (
731
- 'fontSize': $typography-small-small-font-size,
732
- 'lineHeight': $typography-small-small-line-height,
733
- 'fontWeight': $typography-small-small-font-weight
734
- ),
735
- 'base': (
736
- 'fontSize': $typography-small-base-font-size,
737
- 'lineHeight': $typography-small-base-line-height,
738
- 'fontWeight': $typography-small-base-font-weight
739
- )
740
- )
741
- )
742
- );