@polyxd/ds-mono 0.3.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.
@@ -0,0 +1,433 @@
1
+ {
2
+ "$description": "Polyxd semantic tier for the Mono template. Every token aliases a mono.* token; the file is the same in both modes.",
3
+ "color": {
4
+ "surface": {
5
+ "default": {
6
+ "$value": "{mono.sys.surface-default}"
7
+ },
8
+ "subtle": {
9
+ "$value": "{mono.sys.surface-subtle}"
10
+ },
11
+ "raised": {
12
+ "$value": "{mono.sys.surface-raised}"
13
+ },
14
+ "overlay": {
15
+ "$value": "{mono.sys.surface-overlay}"
16
+ },
17
+ "inverse": {
18
+ "$value": "{mono.sys.surface-inverse}"
19
+ }
20
+ },
21
+ "scrim": {
22
+ "$value": "{mono.sys.scrim}"
23
+ },
24
+ "text": {
25
+ "default": {
26
+ "$value": "{mono.sys.text-default}"
27
+ },
28
+ "muted": {
29
+ "$value": "{mono.sys.text-muted}"
30
+ },
31
+ "inverse": {
32
+ "$value": "{mono.sys.text-inverse}"
33
+ },
34
+ "link": {
35
+ "$value": "{mono.sys.text-link}"
36
+ }
37
+ },
38
+ "border": {
39
+ "default": {
40
+ "$value": "{mono.sys.border-default}"
41
+ },
42
+ "strong": {
43
+ "$value": "{mono.sys.border-strong}"
44
+ },
45
+ "focus": {
46
+ "$value": "{mono.sys.border-focus}"
47
+ }
48
+ },
49
+ "action": {
50
+ "primary": {
51
+ "background": {
52
+ "$value": "{mono.sys.action-primary-background}"
53
+ },
54
+ "foreground": {
55
+ "$value": "{mono.sys.action-primary-foreground}"
56
+ }
57
+ },
58
+ "secondary": {
59
+ "background": {
60
+ "$value": "{mono.sys.action-secondary-background}"
61
+ },
62
+ "foreground": {
63
+ "$value": "{mono.sys.action-secondary-foreground}"
64
+ },
65
+ "border": {
66
+ "$value": "{mono.sys.action-secondary-border}"
67
+ }
68
+ },
69
+ "danger": {
70
+ "background": {
71
+ "$value": "{mono.sys.action-danger-background}"
72
+ },
73
+ "foreground": {
74
+ "$value": "{mono.sys.action-danger-foreground}"
75
+ }
76
+ }
77
+ },
78
+ "selection": {
79
+ "background": {
80
+ "$value": "{mono.sys.selection-background}"
81
+ },
82
+ "foreground": {
83
+ "$value": "{mono.sys.selection-foreground}"
84
+ }
85
+ },
86
+ "status": {
87
+ "info": {
88
+ "background": {
89
+ "$value": "{mono.sys.status-info-background}"
90
+ },
91
+ "foreground": {
92
+ "$value": "{mono.sys.status-info-foreground}"
93
+ },
94
+ "emphasis": {
95
+ "$value": "{mono.sys.status-info-emphasis}"
96
+ }
97
+ },
98
+ "success": {
99
+ "background": {
100
+ "$value": "{mono.sys.status-success-background}"
101
+ },
102
+ "foreground": {
103
+ "$value": "{mono.sys.status-success-foreground}"
104
+ },
105
+ "emphasis": {
106
+ "$value": "{mono.sys.status-success-emphasis}"
107
+ }
108
+ },
109
+ "warning": {
110
+ "background": {
111
+ "$value": "{mono.sys.status-warning-background}"
112
+ },
113
+ "foreground": {
114
+ "$value": "{mono.sys.status-warning-foreground}"
115
+ },
116
+ "emphasis": {
117
+ "$value": "{mono.sys.status-warning-emphasis}"
118
+ }
119
+ },
120
+ "danger": {
121
+ "background": {
122
+ "$value": "{mono.sys.status-danger-background}"
123
+ },
124
+ "foreground": {
125
+ "$value": "{mono.sys.status-danger-foreground}"
126
+ },
127
+ "emphasis": {
128
+ "$value": "{mono.sys.status-danger-emphasis}"
129
+ }
130
+ }
131
+ },
132
+ "data": {
133
+ "categorical": {
134
+ "1": {
135
+ "$value": "{mono.sys.data-1}"
136
+ },
137
+ "2": {
138
+ "$value": "{mono.sys.data-2}"
139
+ },
140
+ "3": {
141
+ "$value": "{mono.sys.data-3}"
142
+ },
143
+ "4": {
144
+ "$value": "{mono.sys.data-4}"
145
+ },
146
+ "5": {
147
+ "$value": "{mono.sys.data-5}"
148
+ },
149
+ "6": {
150
+ "$value": "{mono.sys.data-6}"
151
+ }
152
+ },
153
+ "positive": {
154
+ "$value": "{mono.sys.data-positive}"
155
+ },
156
+ "negative": {
157
+ "$value": "{mono.sys.data-negative}"
158
+ },
159
+ "neutral": {
160
+ "$value": "{mono.sys.data-neutral}"
161
+ }
162
+ },
163
+ "$type": "color"
164
+ },
165
+ "type": {
166
+ "$type": "typography",
167
+ "title": {
168
+ "page": {
169
+ "$value": {
170
+ "fontFamily": "{mono.font.display}",
171
+ "fontSize": "{mono.text.title-page}",
172
+ "fontWeight": "{mono.weight.700}",
173
+ "lineHeight": 1.2,
174
+ "letterSpacing": {
175
+ "value": -0.3,
176
+ "unit": "px"
177
+ }
178
+ }
179
+ },
180
+ "section": {
181
+ "$value": {
182
+ "fontFamily": "{mono.font.display}",
183
+ "fontSize": "{mono.text.title-section}",
184
+ "fontWeight": "{mono.weight.600}",
185
+ "lineHeight": 1.25,
186
+ "letterSpacing": {
187
+ "value": -0.1,
188
+ "unit": "px"
189
+ }
190
+ }
191
+ },
192
+ "item": {
193
+ "$value": {
194
+ "fontFamily": "{mono.font.display}",
195
+ "fontSize": "{mono.text.title-item}",
196
+ "fontWeight": "{mono.weight.600}",
197
+ "lineHeight": 1.35,
198
+ "letterSpacing": {
199
+ "value": 0,
200
+ "unit": "px"
201
+ }
202
+ }
203
+ }
204
+ },
205
+ "body": {
206
+ "default": {
207
+ "$value": {
208
+ "fontFamily": "{mono.font.body}",
209
+ "fontSize": "{mono.text.body-default}",
210
+ "fontWeight": "{mono.weight.400}",
211
+ "lineHeight": 1.5,
212
+ "letterSpacing": {
213
+ "value": 0,
214
+ "unit": "px"
215
+ }
216
+ }
217
+ },
218
+ "small": {
219
+ "$value": {
220
+ "fontFamily": "{mono.font.body}",
221
+ "fontSize": "{mono.text.body-small}",
222
+ "fontWeight": "{mono.weight.400}",
223
+ "lineHeight": 1.5,
224
+ "letterSpacing": {
225
+ "value": 0,
226
+ "unit": "px"
227
+ }
228
+ }
229
+ }
230
+ },
231
+ "label": {
232
+ "default": {
233
+ "$value": {
234
+ "fontFamily": "{mono.font.label}",
235
+ "fontSize": "{mono.text.label-default}",
236
+ "fontWeight": "{mono.weight.600}",
237
+ "lineHeight": 1.4,
238
+ "letterSpacing": {
239
+ "value": 0,
240
+ "unit": "px"
241
+ }
242
+ }
243
+ },
244
+ "small": {
245
+ "$value": {
246
+ "fontFamily": "{mono.font.label}",
247
+ "fontSize": "{mono.text.label-small}",
248
+ "fontWeight": "{mono.weight.600}",
249
+ "lineHeight": 1.4,
250
+ "letterSpacing": {
251
+ "value": 0.2,
252
+ "unit": "px"
253
+ }
254
+ }
255
+ }
256
+ },
257
+ "numeric": {
258
+ "display": {
259
+ "$value": {
260
+ "fontFamily": "{mono.font.display}",
261
+ "fontSize": "{mono.text.numeric-display}",
262
+ "fontWeight": "{mono.weight.700}",
263
+ "lineHeight": 1.15,
264
+ "letterSpacing": {
265
+ "value": -0.3,
266
+ "unit": "px"
267
+ }
268
+ },
269
+ "$extensions": {
270
+ "com.polyxd": {
271
+ "numeric": "tabular"
272
+ }
273
+ }
274
+ }
275
+ }
276
+ },
277
+ "space": {
278
+ "$type": "dimension",
279
+ "inset": {
280
+ "compact": {
281
+ "$value": "{mono.space.inset.compact}"
282
+ },
283
+ "default": {
284
+ "$value": "{mono.space.inset.default}"
285
+ },
286
+ "comfortable": {
287
+ "$value": "{mono.space.inset.comfortable}"
288
+ }
289
+ },
290
+ "stack": {
291
+ "tight": {
292
+ "$value": "{mono.space.stack.tight}"
293
+ },
294
+ "default": {
295
+ "$value": "{mono.space.stack.default}"
296
+ },
297
+ "loose": {
298
+ "$value": "{mono.space.stack.loose}"
299
+ },
300
+ "section": {
301
+ "$value": "{mono.space.stack.section}"
302
+ }
303
+ },
304
+ "inline": {
305
+ "tight": {
306
+ "$value": "{mono.space.inline.tight}"
307
+ },
308
+ "default": {
309
+ "$value": "{mono.space.inline.default}"
310
+ },
311
+ "loose": {
312
+ "$value": "{mono.space.inline.loose}"
313
+ }
314
+ }
315
+ },
316
+ "size": {
317
+ "$type": "dimension",
318
+ "target": {
319
+ "min": {
320
+ "$value": "{mono.size.target}"
321
+ }
322
+ },
323
+ "icon": {
324
+ "small": {
325
+ "$value": "{mono.size.icon-small}"
326
+ },
327
+ "default": {
328
+ "$value": "{mono.size.icon-default}"
329
+ }
330
+ }
331
+ },
332
+ "radius": {
333
+ "$type": "dimension",
334
+ "small": {
335
+ "$value": "{mono.radius.small}"
336
+ },
337
+ "control": {
338
+ "$value": "{mono.radius.control}"
339
+ },
340
+ "default": {
341
+ "$value": "{mono.radius.default}"
342
+ },
343
+ "large": {
344
+ "$value": "{mono.radius.large}"
345
+ },
346
+ "full": {
347
+ "$value": "{mono.radius.full}"
348
+ }
349
+ },
350
+ "border": {
351
+ "width": {
352
+ "$type": "dimension",
353
+ "default": {
354
+ "$value": "{mono.border.default}"
355
+ },
356
+ "strong": {
357
+ "$value": "{mono.border.strong}"
358
+ }
359
+ }
360
+ },
361
+ "focus": {
362
+ "ring": {
363
+ "$type": "dimension",
364
+ "width": {
365
+ "$value": "{mono.focus.width}"
366
+ },
367
+ "offset": {
368
+ "$value": "{mono.focus.offset}"
369
+ }
370
+ }
371
+ },
372
+ "measure": {
373
+ "max": {
374
+ "$value": "{mono.measure}",
375
+ "$type": "number"
376
+ }
377
+ },
378
+ "opacity": {
379
+ "state": {
380
+ "$type": "number",
381
+ "hover": {
382
+ "$value": "{mono.opacity.hover}"
383
+ },
384
+ "pressed": {
385
+ "$value": "{mono.opacity.pressed}"
386
+ },
387
+ "focus": {
388
+ "$value": "{mono.opacity.focus}"
389
+ },
390
+ "disabled": {
391
+ "$value": "{mono.opacity.disabled}"
392
+ }
393
+ }
394
+ },
395
+ "shadow": {
396
+ "$type": "shadow",
397
+ "raised": {
398
+ "$value": "{mono.shadow.raised}"
399
+ },
400
+ "overlay": {
401
+ "$value": "{mono.shadow.overlay}"
402
+ }
403
+ },
404
+ "motion": {
405
+ "duration": {
406
+ "$type": "duration",
407
+ "instant": {
408
+ "$value": "{mono.duration.instant}"
409
+ },
410
+ "short": {
411
+ "$value": "{mono.duration.short}"
412
+ },
413
+ "medium": {
414
+ "$value": "{mono.duration.medium}"
415
+ },
416
+ "long": {
417
+ "$value": "{mono.duration.long}"
418
+ }
419
+ },
420
+ "easing": {
421
+ "$type": "cubicBezier",
422
+ "standard": {
423
+ "$value": "{mono.ease.standard}"
424
+ },
425
+ "enter": {
426
+ "$value": "{mono.ease.enter}"
427
+ },
428
+ "exit": {
429
+ "$value": "{mono.ease.exit}"
430
+ }
431
+ }
432
+ }
433
+ }
@@ -0,0 +1,269 @@
1
+ {
2
+ "$description": "Mono, dark mode: the palette (named colours) and the roles that pick from it. Change a palette entry to recolour every role that uses it; point a role at a different entry to change one thing.",
3
+ "mono": {
4
+ "palette": {
5
+ "$type": "color",
6
+ "brand-950": {
7
+ "$value": "oklch(17% 0.035 275)"
8
+ },
9
+ "brand-900": {
10
+ "$value": "oklch(22% 0.045 275)"
11
+ },
12
+ "brand-875": {
13
+ "$value": "oklch(20% 0.04 275)"
14
+ },
15
+ "brand-850": {
16
+ "$value": "oklch(26% 0.05 275)"
17
+ },
18
+ "brand-800": {
19
+ "$value": "oklch(32% 0.07 275)"
20
+ },
21
+ "brand-700": {
22
+ "$value": "oklch(42% 0.12 275)"
23
+ },
24
+ "brand-600": {
25
+ "$value": "oklch(58% 0.15 275)"
26
+ },
27
+ "brand-500": {
28
+ "$value": "oklch(66% 0.14 275)"
29
+ },
30
+ "brand-400": {
31
+ "$value": "oklch(76% 0.13 275)"
32
+ },
33
+ "brand-300": {
34
+ "$value": "oklch(82% 0.1 275)"
35
+ },
36
+ "brand-200": {
37
+ "$value": "oklch(88% 0.07 275)"
38
+ },
39
+ "brand-100": {
40
+ "$value": "oklch(93% 0.04 275)"
41
+ },
42
+ "brand-50": {
43
+ "$value": "oklch(96% 0.02 275)"
44
+ },
45
+ "grey-400": {
46
+ "$value": "oklch(70% 0.03 275)"
47
+ },
48
+ "ink": {
49
+ "$value": "oklch(16% 0.04 275)"
50
+ },
51
+ "success-400": {
52
+ "$value": "oklch(78% 0.15 150)"
53
+ },
54
+ "success-200": {
55
+ "$value": "oklch(90% 0.08 150)"
56
+ },
57
+ "success-900": {
58
+ "$value": "oklch(30% 0.07 150)"
59
+ },
60
+ "warning-400": {
61
+ "$value": "oklch(80% 0.14 75)"
62
+ },
63
+ "warning-200": {
64
+ "$value": "oklch(91% 0.08 80)"
65
+ },
66
+ "warning-900": {
67
+ "$value": "oklch(32% 0.07 70)"
68
+ },
69
+ "danger-400": {
70
+ "$value": "oklch(74% 0.16 25)"
71
+ },
72
+ "danger-200": {
73
+ "$value": "oklch(88% 0.07 25)"
74
+ },
75
+ "danger-900": {
76
+ "$value": "oklch(30% 0.09 25)"
77
+ }
78
+ },
79
+ "sys": {
80
+ "$type": "color",
81
+ "surface-default": {
82
+ "$value": "{mono.palette.brand-950}",
83
+ "$description": "Main page background"
84
+ },
85
+ "surface-subtle": {
86
+ "$value": "{mono.palette.brand-900}",
87
+ "$description": "Grouping background: table headers, wells"
88
+ },
89
+ "surface-raised": {
90
+ "$value": "{mono.palette.brand-875}",
91
+ "$description": "Cards and sheets"
92
+ },
93
+ "surface-overlay": {
94
+ "$value": "{mono.palette.brand-850}",
95
+ "$description": "Dialogs and popovers"
96
+ },
97
+ "surface-inverse": {
98
+ "$value": "{mono.palette.brand-100}",
99
+ "$description": "Snackbars and tooltips"
100
+ },
101
+ "scrim": {
102
+ "$value": "oklch(10% 0.03 275 / 0.6)"
103
+ },
104
+ "text-default": {
105
+ "$value": "{mono.palette.brand-50}"
106
+ },
107
+ "text-muted": {
108
+ "$value": "{mono.palette.brand-300}"
109
+ },
110
+ "text-inverse": {
111
+ "$value": "{mono.palette.brand-950}"
112
+ },
113
+ "text-link": {
114
+ "$value": "{mono.palette.brand-400}",
115
+ "$description": "Inline links"
116
+ },
117
+ "border-default": {
118
+ "$value": "{mono.palette.brand-800}"
119
+ },
120
+ "border-strong": {
121
+ "$value": "{mono.palette.brand-600}",
122
+ "$description": "Input outlines (3:1 on the page)"
123
+ },
124
+ "border-focus": {
125
+ "$value": "{mono.palette.brand-400}",
126
+ "$description": "Keyboard focus ring (3:1 on the page)"
127
+ },
128
+ "action-primary-background": {
129
+ "$value": "{mono.palette.brand-400}"
130
+ },
131
+ "action-primary-foreground": {
132
+ "$value": "{mono.palette.ink}"
133
+ },
134
+ "action-secondary-background": {
135
+ "$value": "{mono.palette.brand-850}"
136
+ },
137
+ "action-secondary-foreground": {
138
+ "$value": "{mono.palette.brand-100}"
139
+ },
140
+ "action-secondary-border": {
141
+ "$value": "{mono.palette.brand-700}"
142
+ },
143
+ "action-danger-background": {
144
+ "$value": "{mono.palette.danger-400}"
145
+ },
146
+ "action-danger-foreground": {
147
+ "$value": "{mono.palette.ink}"
148
+ },
149
+ "selection-background": {
150
+ "$value": "{mono.palette.brand-800}"
151
+ },
152
+ "selection-foreground": {
153
+ "$value": "{mono.palette.brand-100}"
154
+ },
155
+ "status-info-background": {
156
+ "$value": "{mono.palette.brand-800}"
157
+ },
158
+ "status-info-foreground": {
159
+ "$value": "{mono.palette.brand-200}"
160
+ },
161
+ "status-info-emphasis": {
162
+ "$value": "{mono.palette.brand-400}"
163
+ },
164
+ "status-success-background": {
165
+ "$value": "{mono.palette.success-900}"
166
+ },
167
+ "status-success-foreground": {
168
+ "$value": "{mono.palette.success-200}"
169
+ },
170
+ "status-success-emphasis": {
171
+ "$value": "{mono.palette.success-400}"
172
+ },
173
+ "status-warning-background": {
174
+ "$value": "{mono.palette.warning-900}"
175
+ },
176
+ "status-warning-foreground": {
177
+ "$value": "{mono.palette.warning-200}"
178
+ },
179
+ "status-warning-emphasis": {
180
+ "$value": "{mono.palette.warning-400}"
181
+ },
182
+ "status-danger-background": {
183
+ "$value": "{mono.palette.danger-900}"
184
+ },
185
+ "status-danger-foreground": {
186
+ "$value": "{mono.palette.danger-200}"
187
+ },
188
+ "status-danger-emphasis": {
189
+ "$value": "{mono.palette.danger-400}"
190
+ },
191
+ "data-1": {
192
+ "$value": "{mono.palette.brand-400}"
193
+ },
194
+ "data-2": {
195
+ "$value": "{mono.palette.brand-100}"
196
+ },
197
+ "data-3": {
198
+ "$value": "{mono.palette.brand-600}"
199
+ },
200
+ "data-4": {
201
+ "$value": "{mono.palette.brand-300}"
202
+ },
203
+ "data-5": {
204
+ "$value": "{mono.palette.grey-400}"
205
+ },
206
+ "data-6": {
207
+ "$value": "{mono.palette.brand-500}"
208
+ },
209
+ "data-positive": {
210
+ "$value": "{mono.palette.success-400}"
211
+ },
212
+ "data-negative": {
213
+ "$value": "{mono.palette.danger-400}"
214
+ },
215
+ "data-neutral": {
216
+ "$value": "{mono.palette.grey-400}"
217
+ }
218
+ },
219
+ "shadow": {
220
+ "$type": "shadow",
221
+ "raised": {
222
+ "$value": [
223
+ {
224
+ "offsetX": {
225
+ "value": 0,
226
+ "unit": "px"
227
+ },
228
+ "offsetY": {
229
+ "value": 1,
230
+ "unit": "px"
231
+ },
232
+ "blur": {
233
+ "value": 3,
234
+ "unit": "px"
235
+ },
236
+ "spread": {
237
+ "value": 0,
238
+ "unit": "px"
239
+ },
240
+ "color": "rgba(0, 0, 0, 0.4)"
241
+ }
242
+ ]
243
+ },
244
+ "overlay": {
245
+ "$value": [
246
+ {
247
+ "offsetX": {
248
+ "value": 0,
249
+ "unit": "px"
250
+ },
251
+ "offsetY": {
252
+ "value": 12,
253
+ "unit": "px"
254
+ },
255
+ "blur": {
256
+ "value": 32,
257
+ "unit": "px"
258
+ },
259
+ "spread": {
260
+ "value": 0,
261
+ "unit": "px"
262
+ },
263
+ "color": "rgba(0, 0, 0, 0.6)"
264
+ }
265
+ ]
266
+ }
267
+ }
268
+ }
269
+ }