@breadstone/mosaik-themes 0.0.172 → 0.0.174

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 (68) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/Index.d.ts +5 -0
  3. package/Index.d.ts.map +1 -1
  4. package/Index.js +4 -0
  5. package/Index.js.map +1 -1
  6. package/Themes/___bootstrap-tokens.css +91 -0
  7. package/Themes/___cosmopolitan-tokens.css +213 -0
  8. package/Themes/___fluent-tokens.css +30 -0
  9. package/Themes/___joy-tokens.css +500 -0
  10. package/Themes/___material-tokens.css +22 -0
  11. package/Themes/___memphis-tokens.css +392 -0
  12. package/Themes/bootstrap-tokens.scss +89 -0
  13. package/Themes/bootstrap-tokens.tailwind.js +8 -0
  14. package/Themes/cosmopolitan-tokens.scss +211 -0
  15. package/Themes/cosmopolitan-tokens.tailwind.js +32 -0
  16. package/Themes/fluent-tokens.scss +28 -0
  17. package/Themes/fluent-tokens.tailwind.js +8 -0
  18. package/Themes/joy-tokens.scss +498 -0
  19. package/Themes/joy-tokens.tailwind.js +52 -0
  20. package/Themes/joy.scss +0 -1
  21. package/Themes/material-tokens.scss +20 -0
  22. package/Themes/material-tokens.tailwind.js +8 -0
  23. package/Themes/memphis-tokens.scss +390 -0
  24. package/Themes/memphis-tokens.tailwind.js +192 -0
  25. package/Themes/memphis.scss +1 -0
  26. package/Theming/Strategies/CosmopolitanThemeGeneratorStrategy.d.ts +16 -0
  27. package/Theming/Strategies/CosmopolitanThemeGeneratorStrategy.d.ts.map +1 -0
  28. package/Theming/Strategies/CosmopolitanThemeGeneratorStrategy.js +50 -0
  29. package/Theming/Strategies/CosmopolitanThemeGeneratorStrategy.js.map +1 -0
  30. package/Theming/Strategies/IThemeGeneratorStrategy.d.ts +27 -0
  31. package/Theming/Strategies/IThemeGeneratorStrategy.d.ts.map +1 -0
  32. package/Theming/Strategies/IThemeGeneratorStrategy.js +3 -0
  33. package/Theming/Strategies/IThemeGeneratorStrategy.js.map +1 -0
  34. package/Theming/Strategies/JoyThemeGeneratorStrategy.d.ts +17 -0
  35. package/Theming/Strategies/JoyThemeGeneratorStrategy.d.ts.map +1 -0
  36. package/Theming/Strategies/JoyThemeGeneratorStrategy.js +27 -0
  37. package/Theming/Strategies/JoyThemeGeneratorStrategy.js.map +1 -0
  38. package/Theming/Strategies/MaterialThemeGeneratorStrategy.d.ts +15 -0
  39. package/Theming/Strategies/MaterialThemeGeneratorStrategy.d.ts.map +1 -0
  40. package/Theming/Strategies/MaterialThemeGeneratorStrategy.js +86 -0
  41. package/Theming/Strategies/MaterialThemeGeneratorStrategy.js.map +1 -0
  42. package/Theming/Strategies/MemphisThemeGeneratorStrategy.d.ts +17 -0
  43. package/Theming/Strategies/MemphisThemeGeneratorStrategy.d.ts.map +1 -0
  44. package/Theming/Strategies/MemphisThemeGeneratorStrategy.js +27 -0
  45. package/Theming/Strategies/MemphisThemeGeneratorStrategy.js.map +1 -0
  46. package/Theming/Strategies/index.d.ts +6 -0
  47. package/Theming/Strategies/index.d.ts.map +1 -0
  48. package/Theming/Strategies/index.js +7 -0
  49. package/Theming/Strategies/index.js.map +1 -0
  50. package/Theming/ThemeGenerator.d.ts +3 -8
  51. package/Theming/ThemeGenerator.d.ts.map +1 -1
  52. package/Theming/ThemeGenerator.js +29 -137
  53. package/Theming/ThemeGenerator.js.map +1 -1
  54. package/Theming/Tokens/JoyTokens.d.ts +0 -1
  55. package/Theming/Tokens/JoyTokens.d.ts.map +1 -1
  56. package/Theming/Tokens/JoyTokens.js +0 -1
  57. package/Theming/Tokens/JoyTokens.js.map +1 -1
  58. package/Theming/Tokens/MemphisTokens.d.ts +1 -0
  59. package/Theming/Tokens/MemphisTokens.d.ts.map +1 -1
  60. package/Theming/Tokens/MemphisTokens.js +1 -0
  61. package/Theming/Tokens/MemphisTokens.js.map +1 -1
  62. package/package.json +27 -3
  63. package/tailwind/v3/bootstrap-tokens.tailwind.js +41 -0
  64. package/tailwind/v3/cosmopolitan-tokens.tailwind.js +286 -0
  65. package/tailwind/v3/fluent-tokens.tailwind.js +39 -0
  66. package/tailwind/v3/joy-tokens.tailwind.js +562 -0
  67. package/tailwind/v3/material-tokens.tailwind.js +29 -0
  68. package/tailwind/v3/memphis-tokens.tailwind.js +410 -0
package/tailwind/v3/cosmopolitan-tokens.tailwind.js ADDED
@@ -0,0 +1,286 @@
1
+ module.exports = {
2
+ theme: {
3
+ extend: {
4
+ colors: {
5
+ 'ElevationLightLightColor0': 'rgba(0, 0, 0, 0.12)',
6
+ 'ElevationLightLightColor1': 'rgba(0, 0, 0, 0.14)',
7
+ 'ElevationLightSemilightColor0': 'rgba(0, 0, 0, 0.12)',
8
+ 'ElevationLightSemilightColor1': 'rgba(0, 0, 0, 0.14)',
9
+ 'ElevationLightRegularColor0': 'rgba(0, 0, 0, 0.12)',
10
+ 'ElevationLightRegularColor1': 'rgba(0, 0, 0, 0.14)',
11
+ 'ElevationLightSemiboldColor0': 'rgba(0, 0, 0, 0.12)',
12
+ 'ElevationLightSemiboldColor1': 'rgba(0, 0, 0, 0.14)',
13
+ 'ElevationLightBoldColor0': 'rgba(0, 0, 0, 0.12)',
14
+ 'ElevationLightBoldColor1': 'rgba(0, 0, 0, 0.14)',
15
+ 'ElevationLightExtraboldColor0': 'rgba(0, 0, 0, 0.12)',
16
+ 'ElevationLightExtraboldColor1': 'rgba(0, 0, 0, 0.14)',
17
+ 'ElevationDarkLightColor0': 'rgba(0, 0, 0, 0.24)',
18
+ 'ElevationDarkLightColor1': 'rgba(0, 0, 0, 0.28)',
19
+ 'ElevationDarkSemilightColor0': 'rgba(0, 0, 0, 0.24)',
20
+ 'ElevationDarkSemilightColor1': 'rgba(0, 0, 0, 0.28)',
21
+ 'ElevationDarkRegularColor0': 'rgba(0, 0, 0, 0.24)',
22
+ 'ElevationDarkRegularColor1': 'rgba(0, 0, 0, 0.28)',
23
+ 'ElevationDarkSemiboldColor0': 'rgba(0, 0, 0, 0.24)',
24
+ 'ElevationDarkSemiboldColor1': 'rgba(0, 0, 0, 0.28)',
25
+ 'ElevationDarkBoldColor0': 'rgba(0, 0, 0, 0.24)',
26
+ 'ElevationDarkBoldColor1': 'rgba(0, 0, 0, 0.28)',
27
+ 'ElevationDarkExtraboldColor0': 'rgba(0, 0, 0, 0.24)',
28
+ 'ElevationDarkExtraboldColor1': 'rgba(0, 0, 0, 0.28)',
29
+ },
30
+ width: {
31
+ 'LayoutRadius': '3px',
32
+ 'LayoutSpace': '8px',
33
+ 'LayoutThickness': '1px',
34
+ 'TypographyHeadingFontSize': '24px',
35
+ 'TypographyHeadingLineHeight': '28px',
36
+ 'TypographyContentFontSize': '16px',
37
+ 'TypographyContentLineHeight': '20px',
38
+ 'TypographyButtonFontSize': '16px',
39
+ 'TypographyButtonLineHeight': '20px',
40
+ 'ElevationLightLightOffsetX0': '0px',
41
+ 'ElevationLightLightOffsetX1': '0px',
42
+ 'ElevationLightLightOffsetY0': '0px',
43
+ 'ElevationLightLightOffsetY1': '1px',
44
+ 'ElevationLightLightBlur0': '2px',
45
+ 'ElevationLightLightBlur1': '2px',
46
+ 'ElevationLightLightSpread0': '0px',
47
+ 'ElevationLightLightSpread1': '0px',
48
+ 'ElevationLightSemilightOffsetX0': '0px',
49
+ 'ElevationLightSemilightOffsetX1': '0px',
50
+ 'ElevationLightSemilightOffsetY0': '0px',
51
+ 'ElevationLightSemilightOffsetY1': '2px',
52
+ 'ElevationLightSemilightBlur0': '2px',
53
+ 'ElevationLightSemilightBlur1': '4px',
54
+ 'ElevationLightSemilightSpread0': '0px',
55
+ 'ElevationLightSemilightSpread1': '0px',
56
+ 'ElevationLightRegularOffsetX0': '0px',
57
+ 'ElevationLightRegularOffsetX1': '0px',
58
+ 'ElevationLightRegularOffsetY0': '0px',
59
+ 'ElevationLightRegularOffsetY1': '4px',
60
+ 'ElevationLightRegularBlur0': '2px',
61
+ 'ElevationLightRegularBlur1': '8px',
62
+ 'ElevationLightRegularSpread0': '0px',
63
+ 'ElevationLightRegularSpread1': '0px',
64
+ 'ElevationLightSemiboldOffsetX0': '0px',
65
+ 'ElevationLightSemiboldOffsetX1': '0px',
66
+ 'ElevationLightSemiboldOffsetY0': '0px',
67
+ 'ElevationLightSemiboldOffsetY1': '8px',
68
+ 'ElevationLightSemiboldBlur0': '2px',
69
+ 'ElevationLightSemiboldBlur1': '16px',
70
+ 'ElevationLightSemiboldSpread0': '0px',
71
+ 'ElevationLightSemiboldSpread1': '0px',
72
+ 'ElevationLightBoldOffsetX0': '0px',
73
+ 'ElevationLightBoldOffsetX1': '0px',
74
+ 'ElevationLightBoldOffsetY0': '0px',
75
+ 'ElevationLightBoldOffsetY1': '14px',
76
+ 'ElevationLightBoldBlur0': '8px',
77
+ 'ElevationLightBoldBlur1': '28px',
78
+ 'ElevationLightBoldSpread0': '0px',
79
+ 'ElevationLightBoldSpread1': '0px',
80
+ 'ElevationLightExtraboldOffsetX0': '0px',
81
+ 'ElevationLightExtraboldOffsetX1': '0px',
82
+ 'ElevationLightExtraboldOffsetY0': '0px',
83
+ 'ElevationLightExtraboldOffsetY1': '32px',
84
+ 'ElevationLightExtraboldBlur0': '8px',
85
+ 'ElevationLightExtraboldBlur1': '64px',
86
+ 'ElevationLightExtraboldSpread0': '0px',
87
+ 'ElevationLightExtraboldSpread1': '0px',
88
+ 'ElevationDarkLightOffsetX0': '0px',
89
+ 'ElevationDarkLightOffsetX1': '0px',
90
+ 'ElevationDarkLightOffsetY0': '0px',
91
+ 'ElevationDarkLightOffsetY1': '1px',
92
+ 'ElevationDarkLightBlur0': '2px',
93
+ 'ElevationDarkLightBlur1': '2px',
94
+ 'ElevationDarkLightSpread0': '0px',
95
+ 'ElevationDarkLightSpread1': '0px',
96
+ 'ElevationDarkSemilightOffsetX0': '0px',
97
+ 'ElevationDarkSemilightOffsetX1': '0px',
98
+ 'ElevationDarkSemilightOffsetY0': '0px',
99
+ 'ElevationDarkSemilightOffsetY1': '2px',
100
+ 'ElevationDarkSemilightBlur0': '2px',
101
+ 'ElevationDarkSemilightBlur1': '4px',
102
+ 'ElevationDarkSemilightSpread0': '0px',
103
+ 'ElevationDarkSemilightSpread1': '0px',
104
+ 'ElevationDarkRegularOffsetX0': '0px',
105
+ 'ElevationDarkRegularOffsetX1': '0px',
106
+ 'ElevationDarkRegularOffsetY0': '0px',
107
+ 'ElevationDarkRegularOffsetY1': '4px',
108
+ 'ElevationDarkRegularBlur0': '2px',
109
+ 'ElevationDarkRegularBlur1': '8px',
110
+ 'ElevationDarkRegularSpread0': '0px',
111
+ 'ElevationDarkRegularSpread1': '0px',
112
+ 'ElevationDarkSemiboldOffsetX0': '0px',
113
+ 'ElevationDarkSemiboldOffsetX1': '0px',
114
+ 'ElevationDarkSemiboldOffsetY0': '0px',
115
+ 'ElevationDarkSemiboldOffsetY1': '8px',
116
+ 'ElevationDarkSemiboldBlur0': '2px',
117
+ 'ElevationDarkSemiboldBlur1': '16px',
118
+ 'ElevationDarkSemiboldSpread0': '0px',
119
+ 'ElevationDarkSemiboldSpread1': '0px',
120
+ 'ElevationDarkBoldOffsetX0': '0px',
121
+ 'ElevationDarkBoldOffsetX1': '0px',
122
+ 'ElevationDarkBoldOffsetY0': '0px',
123
+ 'ElevationDarkBoldOffsetY1': '14px',
124
+ 'ElevationDarkBoldBlur0': '8px',
125
+ 'ElevationDarkBoldBlur1': '28px',
126
+ 'ElevationDarkBoldSpread0': '0px',
127
+ 'ElevationDarkBoldSpread1': '0px',
128
+ 'ElevationDarkExtraboldOffsetX0': '0px',
129
+ 'ElevationDarkExtraboldOffsetX1': '0px',
130
+ 'ElevationDarkExtraboldOffsetY0': '0px',
131
+ 'ElevationDarkExtraboldOffsetY1': '32px',
132
+ 'ElevationDarkExtraboldBlur0': '8px',
133
+ 'ElevationDarkExtraboldBlur1': '64px',
134
+ 'ElevationDarkExtraboldSpread0': '0px',
135
+ 'ElevationDarkExtraboldSpread1': '0px',
136
+ 'SizeTiny': '2px',
137
+ 'SizeSmall': '4px',
138
+ 'SizeMedium': '8px',
139
+ 'SizeLarge': '16px',
140
+ 'SizeGiant': '32px',
141
+ },
142
+ height: {
143
+ 'LayoutRadius': '3px',
144
+ 'LayoutSpace': '8px',
145
+ 'LayoutThickness': '1px',
146
+ 'TypographyHeadingFontSize': '24px',
147
+ 'TypographyHeadingLineHeight': '28px',
148
+ 'TypographyContentFontSize': '16px',
149
+ 'TypographyContentLineHeight': '20px',
150
+ 'TypographyButtonFontSize': '16px',
151
+ 'TypographyButtonLineHeight': '20px',
152
+ 'ElevationLightLightOffsetX0': '0px',
153
+ 'ElevationLightLightOffsetX1': '0px',
154
+ 'ElevationLightLightOffsetY0': '0px',
155
+ 'ElevationLightLightOffsetY1': '1px',
156
+ 'ElevationLightLightBlur0': '2px',
157
+ 'ElevationLightLightBlur1': '2px',
158
+ 'ElevationLightLightSpread0': '0px',
159
+ 'ElevationLightLightSpread1': '0px',
160
+ 'ElevationLightSemilightOffsetX0': '0px',
161
+ 'ElevationLightSemilightOffsetX1': '0px',
162
+ 'ElevationLightSemilightOffsetY0': '0px',
163
+ 'ElevationLightSemilightOffsetY1': '2px',
164
+ 'ElevationLightSemilightBlur0': '2px',
165
+ 'ElevationLightSemilightBlur1': '4px',
166
+ 'ElevationLightSemilightSpread0': '0px',
167
+ 'ElevationLightSemilightSpread1': '0px',
168
+ 'ElevationLightRegularOffsetX0': '0px',
169
+ 'ElevationLightRegularOffsetX1': '0px',
170
+ 'ElevationLightRegularOffsetY0': '0px',
171
+ 'ElevationLightRegularOffsetY1': '4px',
172
+ 'ElevationLightRegularBlur0': '2px',
173
+ 'ElevationLightRegularBlur1': '8px',
174
+ 'ElevationLightRegularSpread0': '0px',
175
+ 'ElevationLightRegularSpread1': '0px',
176
+ 'ElevationLightSemiboldOffsetX0': '0px',
177
+ 'ElevationLightSemiboldOffsetX1': '0px',
178
+ 'ElevationLightSemiboldOffsetY0': '0px',
179
+ 'ElevationLightSemiboldOffsetY1': '8px',
180
+ 'ElevationLightSemiboldBlur0': '2px',
181
+ 'ElevationLightSemiboldBlur1': '16px',
182
+ 'ElevationLightSemiboldSpread0': '0px',
183
+ 'ElevationLightSemiboldSpread1': '0px',
184
+ 'ElevationLightBoldOffsetX0': '0px',
185
+ 'ElevationLightBoldOffsetX1': '0px',
186
+ 'ElevationLightBoldOffsetY0': '0px',
187
+ 'ElevationLightBoldOffsetY1': '14px',
188
+ 'ElevationLightBoldBlur0': '8px',
189
+ 'ElevationLightBoldBlur1': '28px',
190
+ 'ElevationLightBoldSpread0': '0px',
191
+ 'ElevationLightBoldSpread1': '0px',
192
+ 'ElevationLightExtraboldOffsetX0': '0px',
193
+ 'ElevationLightExtraboldOffsetX1': '0px',
194
+ 'ElevationLightExtraboldOffsetY0': '0px',
195
+ 'ElevationLightExtraboldOffsetY1': '32px',
196
+ 'ElevationLightExtraboldBlur0': '8px',
197
+ 'ElevationLightExtraboldBlur1': '64px',
198
+ 'ElevationLightExtraboldSpread0': '0px',
199
+ 'ElevationLightExtraboldSpread1': '0px',
200
+ 'ElevationDarkLightOffsetX0': '0px',
201
+ 'ElevationDarkLightOffsetX1': '0px',
202
+ 'ElevationDarkLightOffsetY0': '0px',
203
+ 'ElevationDarkLightOffsetY1': '1px',
204
+ 'ElevationDarkLightBlur0': '2px',
205
+ 'ElevationDarkLightBlur1': '2px',
206
+ 'ElevationDarkLightSpread0': '0px',
207
+ 'ElevationDarkLightSpread1': '0px',
208
+ 'ElevationDarkSemilightOffsetX0': '0px',
209
+ 'ElevationDarkSemilightOffsetX1': '0px',
210
+ 'ElevationDarkSemilightOffsetY0': '0px',
211
+ 'ElevationDarkSemilightOffsetY1': '2px',
212
+ 'ElevationDarkSemilightBlur0': '2px',
213
+ 'ElevationDarkSemilightBlur1': '4px',
214
+ 'ElevationDarkSemilightSpread0': '0px',
215
+ 'ElevationDarkSemilightSpread1': '0px',
216
+ 'ElevationDarkRegularOffsetX0': '0px',
217
+ 'ElevationDarkRegularOffsetX1': '0px',
218
+ 'ElevationDarkRegularOffsetY0': '0px',
219
+ 'ElevationDarkRegularOffsetY1': '4px',
220
+ 'ElevationDarkRegularBlur0': '2px',
221
+ 'ElevationDarkRegularBlur1': '8px',
222
+ 'ElevationDarkRegularSpread0': '0px',
223
+ 'ElevationDarkRegularSpread1': '0px',
224
+ 'ElevationDarkSemiboldOffsetX0': '0px',
225
+ 'ElevationDarkSemiboldOffsetX1': '0px',
226
+ 'ElevationDarkSemiboldOffsetY0': '0px',
227
+ 'ElevationDarkSemiboldOffsetY1': '8px',
228
+ 'ElevationDarkSemiboldBlur0': '2px',
229
+ 'ElevationDarkSemiboldBlur1': '16px',
230
+ 'ElevationDarkSemiboldSpread0': '0px',
231
+ 'ElevationDarkSemiboldSpread1': '0px',
232
+ 'ElevationDarkBoldOffsetX0': '0px',
233
+ 'ElevationDarkBoldOffsetX1': '0px',
234
+ 'ElevationDarkBoldOffsetY0': '0px',
235
+ 'ElevationDarkBoldOffsetY1': '14px',
236
+ 'ElevationDarkBoldBlur0': '8px',
237
+ 'ElevationDarkBoldBlur1': '28px',
238
+ 'ElevationDarkBoldSpread0': '0px',
239
+ 'ElevationDarkBoldSpread1': '0px',
240
+ 'ElevationDarkExtraboldOffsetX0': '0px',
241
+ 'ElevationDarkExtraboldOffsetX1': '0px',
242
+ 'ElevationDarkExtraboldOffsetY0': '0px',
243
+ 'ElevationDarkExtraboldOffsetY1': '32px',
244
+ 'ElevationDarkExtraboldBlur0': '8px',
245
+ 'ElevationDarkExtraboldBlur1': '64px',
246
+ 'ElevationDarkExtraboldSpread0': '0px',
247
+ 'ElevationDarkExtraboldSpread1': '0px',
248
+ 'SizeTiny': '2px',
249
+ 'SizeSmall': '4px',
250
+ 'SizeMedium': '8px',
251
+ 'SizeLarge': '16px',
252
+ 'SizeGiant': '32px',
253
+ },
254
+ fontFamily: {
255
+ 'FontFamily': ''Noto Sans', sans-serif',
256
+ 'TypographyHeadingFontFamily': ''Noto Sans', sans-serif',
257
+ 'TypographyContentFontFamily': ''Noto Sans', sans-serif',
258
+ 'TypographyButtonFontFamily': ''Noto Sans', sans-serif',
259
+ },
260
+ letterSpacing: {
261
+ 'TypographyHeadingLetterSpacing': '-0.25px',
262
+ 'TypographyContentLetterSpacing': '-0.25px',
263
+ 'TypographyButtonLetterSpacing': '-0.25px',
264
+ },
265
+ boxShadow: {
266
+ 'ElevationLightLight': '0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 2px 0px rgba(0, 0, 0, 0.14)',
267
+ 'ElevationLightSemilight': '0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 2px 4px 0px rgba(0, 0, 0, 0.14)',
268
+ 'ElevationLightRegular': '0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 4px 8px 0px rgba(0, 0, 0, 0.14)',
269
+ 'ElevationLightSemibold': '0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 8px 16px 0px rgba(0, 0, 0, 0.14)',
270
+ 'ElevationLightBold': '0px 0px 8px 0px rgba(0, 0, 0, 0.12), 0px 14px 28px 0px rgba(0, 0, 0, 0.14)',
271
+ 'ElevationLightExtrabold': '0px 0px 8px 0px rgba(0, 0, 0, 0.12), 0px 32px 64px 0px rgba(0, 0, 0, 0.14)',
272
+ 'ElevationDarkLight': '0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 1px 2px 0px rgba(0, 0, 0, 0.28)',
273
+ 'ElevationDarkSemilight': '0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 2px 4px 0px rgba(0, 0, 0, 0.28)',
274
+ 'ElevationDarkRegular': '0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 4px 8px 0px rgba(0, 0, 0, 0.28)',
275
+ 'ElevationDarkSemibold': '0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 8px 16px 0px rgba(0, 0, 0, 0.28)',
276
+ 'ElevationDarkBold': '0px 0px 8px 0px rgba(0, 0, 0, 0.24), 0px 14px 28px 0px rgba(0, 0, 0, 0.28)',
277
+ 'ElevationDarkExtrabold': '0px 0px 8px 0px rgba(0, 0, 0, 0.24), 0px 32px 64px 0px rgba(0, 0, 0, 0.28)',
278
+ },
279
+ transitionDuration: {
280
+ 'DurationShort': '200ms',
281
+ 'DurationMedium': '400ms',
282
+ 'DurationLong': '600ms',
283
+ },
284
+ }
285
+ }
286
+ };
package/tailwind/v3/fluent-tokens.tailwind.js ADDED
@@ -0,0 +1,39 @@
1
+ module.exports = {
2
+ theme: {
3
+ extend: {
4
+ width: {
5
+ 'LayoutRadius': '12px',
6
+ 'LayoutSpace': '8px',
7
+ 'LayoutThickness': '2px',
8
+ 'SizeTiny': '2px',
9
+ 'SizeSmall': '4px',
10
+ 'SizeMedium': '8px',
11
+ 'SizeLarge': '16px',
12
+ 'SizeGiant': '32px',
13
+ },
14
+ height: {
15
+ 'LayoutRadius': '12px',
16
+ 'LayoutSpace': '8px',
17
+ 'LayoutThickness': '2px',
18
+ 'SizeTiny': '2px',
19
+ 'SizeSmall': '4px',
20
+ 'SizeMedium': '8px',
21
+ 'SizeLarge': '16px',
22
+ 'SizeGiant': '32px',
23
+ },
24
+ fontFamily: {
25
+ 'FontFamily': ''Inter', Roboto, Helvetica, sans-serif',
26
+ },
27
+ transitionDuration: {
28
+ 'DurationDurationUltraFast': '50ms',
29
+ 'DurationDurationFaster': '100ms',
30
+ 'DurationDurationFast': '150ms',
31
+ 'DurationDurationNormal': '200ms',
32
+ 'DurationDurationGentle': '250ms',
33
+ 'DurationDurationSlow': '300ms',
34
+ 'DurationDurationSlower': '400ms',
35
+ 'DurationDurationUltraSlow': '500ms',
36
+ },
37
+ }
38
+ }
39
+ };