@loworbitstudio/visor-core 0.6.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/themes/blackout.css +124 -124
  2. package/dist/themes/modern-minimal.css +97 -97
  3. package/dist/themes/neutral.css +109 -109
  4. package/dist/themes/space.css +142 -142
  5. package/package.json +2 -2
package/dist/themes/space.css CHANGED
@@ -14,62 +14,62 @@
14
14
  --color-white: #ffffff;
15
15
  --color-black: #000000;
16
16
  --color-primary-50: #f2f5ff;
17
- --color-primary-100: #eef2ff;
18
- --color-primary-200: #eaeeff;
19
- --color-primary-300: #e2e9ff;
20
- --color-primary-400: #d8e1ff;
17
+ --color-primary-100: #e2e9fe;
18
+ --color-primary-200: #ccd7ff;
19
+ --color-primary-300: #aabcff;
20
+ --color-primary-400: #7b93ff;
21
21
  --color-primary-500: #5b6fff;
22
- --color-primary-600: #353ac8;
23
- --color-primary-700: #281fb0;
24
- --color-primary-800: #1b0b86;
25
- --color-primary-900: #0e005a;
22
+ --color-primary-600: #3f49d7;
23
+ --color-primary-700: #2e2dbc;
24
+ --color-primary-800: #1e168d;
25
+ --color-primary-900: #100061;
26
26
  --color-primary-950: #04002d;
27
27
  --color-accent-50: #f2f5ff;
28
- --color-accent-100: #eef2ff;
29
- --color-accent-200: #eaeeff;
30
- --color-accent-300: #e2e9ff;
31
- --color-accent-400: #d8e1ff;
28
+ --color-accent-100: #e2e9fe;
29
+ --color-accent-200: #ccd7ff;
30
+ --color-accent-300: #aabcff;
31
+ --color-accent-400: #7b93ff;
32
32
  --color-accent-500: #5b6fff;
33
- --color-accent-600: #353ac8;
34
- --color-accent-700: #281fb0;
35
- --color-accent-800: #1b0b86;
36
- --color-accent-900: #0e005a;
33
+ --color-accent-600: #3f49d7;
34
+ --color-accent-700: #2e2dbc;
35
+ --color-accent-800: #1e168d;
36
+ --color-accent-900: #100061;
37
37
  --color-accent-950: #04002d;
38
38
  --color-neutral-50: #f5f5f8;
39
- --color-neutral-100: #f1f1f8;
40
- --color-neutral-200: #ecedf8;
41
- --color-neutral-300: #e5e6f5;
42
- --color-neutral-400: #dcdceb;
43
- --color-neutral-500: #6c6c79;
44
- --color-neutral-600: #545460;
45
- --color-neutral-700: #41414d;
46
- --color-neutral-800: #2d2d38;
47
- --color-neutral-900: #191924;
39
+ --color-neutral-100: #e7e7ed;
40
+ --color-neutral-200: #d2d2dd;
41
+ --color-neutral-300: #b4b4c2;
42
+ --color-neutral-400: #8a8a98;
43
+ --color-neutral-500: #6b6b80;
44
+ --color-neutral-600: #51515d;
45
+ --color-neutral-700: #3f3f4b;
46
+ --color-neutral-800: #2b2b36;
47
+ --color-neutral-900: #191923;
48
48
  --color-neutral-950: #080810;
49
49
  --color-success-50: #e8fbeb;
50
- --color-success-100: #defde3;
50
+ --color-success-100: #d8f7dc;
51
51
  --color-success-500: #22c55e;
52
- --color-success-600: #00672b;
53
- --color-success-700: #005120;
54
- --color-success-900: #002209;
52
+ --color-success-600: #019341;
53
+ --color-success-700: #017231;
54
+ --color-success-900: #002b0e;
55
55
  --color-warning-50: #fff3e6;
56
- --color-warning-100: #fff1e3;
56
+ --color-warning-100: #ffebd5;
57
57
  --color-warning-500: #f59e0b;
58
- --color-warning-600: #774a01;
59
- --color-warning-700: #5e3900;
60
- --color-warning-900: #281600;
58
+ --color-warning-600: #b77401;
59
+ --color-warning-700: #8d5800;
60
+ --color-warning-900: #361f00;
61
61
  --color-error-50: #fff2f0;
62
- --color-error-100: #ffefed;
62
+ --color-error-100: #ffe3e0;
63
63
  --color-error-500: #ef4444;
64
- --color-error-600: #a30016;
65
- --color-error-700: #81000f;
66
- --color-error-900: #3a0003;
64
+ --color-error-600: #c3041e;
65
+ --color-error-700: #990015;
66
+ --color-error-900: #410004;
67
67
  --color-info-50: #ecf7ff;
68
- --color-info-100: #e8f5ff;
68
+ --color-info-100: #daf0ff;
69
69
  --color-info-500: #0ea5e9;
70
- --color-info-600: #005c85;
71
- --color-info-700: #004869;
72
- --color-info-900: #001d2e;
70
+ --color-info-600: #017baf;
71
+ --color-info-700: #005f88;
72
+ --color-info-900: #002437;
73
73
  }
74
74
 
75
75
 
@@ -185,11 +185,11 @@
185
185
  --text-primary: #e8e8f0;
186
186
  --text-secondary: rgba(232, 232, 240, 0.72);
187
187
  --text-tertiary: rgba(232, 232, 240, 0.5);
188
- --text-disabled: #545460;
189
- --text-inverse: #191924;
190
- --text-inverse-secondary: #41414d;
188
+ --text-disabled: #51515d;
189
+ --text-inverse: #191923;
190
+ --text-inverse-secondary: #3f3f4b;
191
191
  --text-link: #8b9fff;
192
- --text-link-hover: #e2e9ff;
192
+ --text-link-hover: #aabcff;
193
193
  --text-success: #22c55e;
194
194
  --text-warning: #f59e0b;
195
195
  --text-error: #ef4444;
@@ -202,40 +202,40 @@
202
202
  --surface-page: #080810;
203
203
  --surface-card: #0e0e18;
204
204
  --surface-popover: #0e0e18;
205
- --surface-subtle: #2d2d38;
206
- --surface-muted: #41414d;
205
+ --surface-subtle: #2b2b36;
206
+ --surface-muted: #0b0b14;
207
207
  --surface-overlay: #080810;
208
- --surface-interactive-default: #2d2d38;
209
- --surface-interactive-hover: #41414d;
210
- --surface-interactive-active: #545460;
211
- --surface-interactive-disabled: #2d2d38;
212
- --surface-selected: #1b0b86;
213
- --surface-accent-subtle: #0e005a;
208
+ --surface-interactive-default: #2b2b36;
209
+ --surface-interactive-hover: #3f3f4b;
210
+ --surface-interactive-active: #51515d;
211
+ --surface-interactive-disabled: #2b2b36;
212
+ --surface-selected: #1e168d;
213
+ --surface-accent-subtle: #100061;
214
214
  --surface-accent-default: #5b6fff;
215
- --surface-accent-strong: #d8e1ff;
216
- --surface-success-subtle: #002209;
215
+ --surface-accent-strong: #7b93ff;
216
+ --surface-success-subtle: #002b0e;
217
217
  --surface-success-default: #22c55e;
218
- --surface-warning-subtle: #281600;
218
+ --surface-warning-subtle: #361f00;
219
219
  --surface-warning-default: #f59e0b;
220
- --surface-error-subtle: #3a0003;
220
+ --surface-error-subtle: #410004;
221
221
  --surface-error-default: #ef4444;
222
- --surface-info-subtle: #001d2e;
222
+ --surface-info-subtle: #002437;
223
223
  --surface-info-default: #0ea5e9;
224
224
  --surface-elev-0: #080810;
225
- --surface-elev-1: #191924;
226
- --surface-elev-2: #2d2d38;
227
- --surface-elev-3: #41414d;
228
- --surface-elev-4: #545460;
225
+ --surface-elev-1: #191923;
226
+ --surface-elev-2: #2b2b36;
227
+ --surface-elev-3: #3f3f4b;
228
+ --surface-elev-4: #51515d;
229
229
  }
230
230
 
231
231
 
232
232
  /* --- Adaptive: Border (dark) — manual toggle --- */
233
233
  .dark .space-theme {
234
- --border-default: #41414d;
235
- --border-muted: #2d2d38;
236
- --border-strong: #545460;
234
+ --border-default: #3f3f4b;
235
+ --border-muted: #2b2b36;
236
+ --border-strong: #51515d;
237
237
  --border-focus: #5b6fff;
238
- --border-disabled: #2d2d38;
238
+ --border-disabled: #2b2b36;
239
239
  --border-success: #22c55e;
240
240
  --border-warning: #f59e0b;
241
241
  --border-error: #ef4444;
@@ -246,19 +246,19 @@
246
246
  /* --- Adaptive: Interactive (dark) — manual toggle --- */
247
247
  .dark .space-theme {
248
248
  --interactive-primary-bg: #5b6fff;
249
- --interactive-primary-bg-hover: #d8e1ff;
250
- --interactive-primary-bg-active: #e2e9ff;
249
+ --interactive-primary-bg-hover: #7b93ff;
250
+ --interactive-primary-bg-active: #aabcff;
251
251
  --interactive-primary-text: #ffffff;
252
- --interactive-secondary-bg: #2d2d38;
253
- --interactive-secondary-bg-hover: #41414d;
254
- --interactive-secondary-bg-active: #545460;
252
+ --interactive-secondary-bg: #2b2b36;
253
+ --interactive-secondary-bg-hover: #3f3f4b;
254
+ --interactive-secondary-bg-active: #51515d;
255
255
  --interactive-secondary-text: #f5f5f8;
256
- --interactive-secondary-border: #545460;
256
+ --interactive-secondary-border: #51515d;
257
257
  --interactive-destructive-bg: #ef4444;
258
- --interactive-destructive-bg-hover: #a30016;
258
+ --interactive-destructive-bg-hover: #c3041e;
259
259
  --interactive-destructive-text: #ffffff;
260
- --interactive-ghost-bg: #2d2d38;
261
- --interactive-ghost-bg-hover: #41414d;
260
+ --interactive-ghost-bg: #2b2b36;
261
+ --interactive-ghost-bg-hover: #3f3f4b;
262
262
  }
263
263
 
264
264
 
@@ -268,11 +268,11 @@
268
268
  --text-primary: #e8e8f0;
269
269
  --text-secondary: rgba(232, 232, 240, 0.72);
270
270
  --text-tertiary: rgba(232, 232, 240, 0.5);
271
- --text-disabled: #545460;
272
- --text-inverse: #191924;
273
- --text-inverse-secondary: #41414d;
271
+ --text-disabled: #51515d;
272
+ --text-inverse: #191923;
273
+ --text-inverse-secondary: #3f3f4b;
274
274
  --text-link: #8b9fff;
275
- --text-link-hover: #e2e9ff;
275
+ --text-link-hover: #aabcff;
276
276
  --text-success: #22c55e;
277
277
  --text-warning: #f59e0b;
278
278
  --text-error: #ef4444;
@@ -287,30 +287,30 @@
287
287
  --surface-page: #080810;
288
288
  --surface-card: #0e0e18;
289
289
  --surface-popover: #0e0e18;
290
- --surface-subtle: #2d2d38;
291
- --surface-muted: #41414d;
290
+ --surface-subtle: #2b2b36;
291
+ --surface-muted: #0b0b14;
292
292
  --surface-overlay: #080810;
293
- --surface-interactive-default: #2d2d38;
294
- --surface-interactive-hover: #41414d;
295
- --surface-interactive-active: #545460;
296
- --surface-interactive-disabled: #2d2d38;
297
- --surface-selected: #1b0b86;
298
- --surface-accent-subtle: #0e005a;
293
+ --surface-interactive-default: #2b2b36;
294
+ --surface-interactive-hover: #3f3f4b;
295
+ --surface-interactive-active: #51515d;
296
+ --surface-interactive-disabled: #2b2b36;
297
+ --surface-selected: #1e168d;
298
+ --surface-accent-subtle: #100061;
299
299
  --surface-accent-default: #5b6fff;
300
- --surface-accent-strong: #d8e1ff;
301
- --surface-success-subtle: #002209;
300
+ --surface-accent-strong: #7b93ff;
301
+ --surface-success-subtle: #002b0e;
302
302
  --surface-success-default: #22c55e;
303
- --surface-warning-subtle: #281600;
303
+ --surface-warning-subtle: #361f00;
304
304
  --surface-warning-default: #f59e0b;
305
- --surface-error-subtle: #3a0003;
305
+ --surface-error-subtle: #410004;
306
306
  --surface-error-default: #ef4444;
307
- --surface-info-subtle: #001d2e;
307
+ --surface-info-subtle: #002437;
308
308
  --surface-info-default: #0ea5e9;
309
309
  --surface-elev-0: #080810;
310
- --surface-elev-1: #191924;
311
- --surface-elev-2: #2d2d38;
312
- --surface-elev-3: #41414d;
313
- --surface-elev-4: #545460;
310
+ --surface-elev-1: #191923;
311
+ --surface-elev-2: #2b2b36;
312
+ --surface-elev-3: #3f3f4b;
313
+ --surface-elev-4: #51515d;
314
314
  }
315
315
  }
316
316
 
@@ -318,11 +318,11 @@
318
318
  /* --- Adaptive: Border (dark) — prefers-color-scheme --- */
319
319
  @media (prefers-color-scheme: dark) {
320
320
  .space-theme:not(.light) {
321
- --border-default: #41414d;
322
- --border-muted: #2d2d38;
323
- --border-strong: #545460;
321
+ --border-default: #3f3f4b;
322
+ --border-muted: #2b2b36;
323
+ --border-strong: #51515d;
324
324
  --border-focus: #5b6fff;
325
- --border-disabled: #2d2d38;
325
+ --border-disabled: #2b2b36;
326
326
  --border-success: #22c55e;
327
327
  --border-warning: #f59e0b;
328
328
  --border-error: #ef4444;
@@ -335,19 +335,19 @@
335
335
  @media (prefers-color-scheme: dark) {
336
336
  .space-theme:not(.light) {
337
337
  --interactive-primary-bg: #5b6fff;
338
- --interactive-primary-bg-hover: #d8e1ff;
339
- --interactive-primary-bg-active: #e2e9ff;
338
+ --interactive-primary-bg-hover: #7b93ff;
339
+ --interactive-primary-bg-active: #aabcff;
340
340
  --interactive-primary-text: #ffffff;
341
- --interactive-secondary-bg: #2d2d38;
342
- --interactive-secondary-bg-hover: #41414d;
343
- --interactive-secondary-bg-active: #545460;
341
+ --interactive-secondary-bg: #2b2b36;
342
+ --interactive-secondary-bg-hover: #3f3f4b;
343
+ --interactive-secondary-bg-active: #51515d;
344
344
  --interactive-secondary-text: #f5f5f8;
345
- --interactive-secondary-border: #545460;
345
+ --interactive-secondary-border: #51515d;
346
346
  --interactive-destructive-bg: #ef4444;
347
- --interactive-destructive-bg-hover: #a30016;
347
+ --interactive-destructive-bg-hover: #c3041e;
348
348
  --interactive-destructive-text: #ffffff;
349
- --interactive-ghost-bg: #2d2d38;
350
- --interactive-ghost-bg-hover: #41414d;
349
+ --interactive-ghost-bg: #2b2b36;
350
+ --interactive-ghost-bg-hover: #3f3f4b;
351
351
  }
352
352
  }
353
353
 
@@ -359,15 +359,15 @@ html:not(.dark) .space-theme {
359
359
  --text-primary: #1a1630;
360
360
  --text-secondary: rgba(26, 22, 48, 0.72);
361
361
  --text-tertiary: rgba(26, 22, 48, 0.65);
362
- --text-disabled: #e5e6f5;
362
+ --text-disabled: #b4b4c2;
363
363
  --text-inverse: #ffffff;
364
- --text-inverse-secondary: #ecedf8;
364
+ --text-inverse-secondary: #d2d2dd;
365
365
  --text-link: #5b6fff;
366
- --text-link-hover: #281fb0;
367
- --text-success: #005120;
368
- --text-warning: #5e3900;
369
- --text-error: #81000f;
370
- --text-info: #004869;
366
+ --text-link-hover: #2e2dbc;
367
+ --text-success: #017231;
368
+ --text-warning: #8d5800;
369
+ --text-error: #990015;
370
+ --text-info: #005f88;
371
371
  }
372
372
 
373
373
 
@@ -377,16 +377,16 @@ html:not(.dark) .space-theme {
377
377
  --surface-card: #f2f0f8;
378
378
  --surface-popover: #f2f0f8;
379
379
  --surface-subtle: #f5f5f8;
380
- --surface-muted: #f1f1f8;
381
- --surface-overlay: #191924;
380
+ --surface-muted: #e7e7ed;
381
+ --surface-overlay: #191923;
382
382
  --surface-interactive-default: #ffffff;
383
383
  --surface-interactive-hover: #f5f5f8;
384
- --surface-interactive-active: #f1f1f8;
384
+ --surface-interactive-active: #e7e7ed;
385
385
  --surface-interactive-disabled: #f5f5f8;
386
- --surface-selected: #eef2ff;
386
+ --surface-selected: #e2e9fe;
387
387
  --surface-accent-subtle: #f2f5ff;
388
388
  --surface-accent-default: #5b6fff;
389
- --surface-accent-strong: #353ac8;
389
+ --surface-accent-strong: #3f49d7;
390
390
  --surface-success-subtle: #e8fbeb;
391
391
  --surface-success-default: #22c55e;
392
392
  --surface-warning-subtle: #fff3e6;
@@ -397,19 +397,19 @@ html:not(.dark) .space-theme {
397
397
  --surface-info-default: #0ea5e9;
398
398
  --surface-elev-0: #ffffff;
399
399
  --surface-elev-1: #f5f5f8;
400
- --surface-elev-2: #f1f1f8;
401
- --surface-elev-3: #ecedf8;
402
- --surface-elev-4: #e5e6f5;
400
+ --surface-elev-2: #e7e7ed;
401
+ --surface-elev-3: #d2d2dd;
402
+ --surface-elev-4: #b4b4c2;
403
403
  }
404
404
 
405
405
 
406
406
  /* --- Adaptive: Border (light) --- */
407
407
  html:not(.dark) .space-theme {
408
- --border-default: #ecedf8;
409
- --border-muted: #f1f1f8;
410
- --border-strong: #e5e6f5;
408
+ --border-default: #d2d2dd;
409
+ --border-muted: #e7e7ed;
410
+ --border-strong: #b4b4c2;
411
411
  --border-focus: #5b6fff;
412
- --border-disabled: #f1f1f8;
412
+ --border-disabled: #e7e7ed;
413
413
  --border-success: #22c55e;
414
414
  --border-warning: #f59e0b;
415
415
  --border-error: #ef4444;
@@ -420,19 +420,19 @@ html:not(.dark) .space-theme {
420
420
  /* --- Adaptive: Interactive (light) --- */
421
421
  html:not(.dark) .space-theme {
422
422
  --interactive-primary-bg: #5b6fff;
423
- --interactive-primary-bg-hover: #281fb0;
424
- --interactive-primary-bg-active: #1b0b86;
423
+ --interactive-primary-bg-hover: #2e2dbc;
424
+ --interactive-primary-bg-active: #1e168d;
425
425
  --interactive-primary-text: #ffffff;
426
426
  --interactive-secondary-bg: #ffffff;
427
427
  --interactive-secondary-bg-hover: #f5f5f8;
428
- --interactive-secondary-bg-active: #f1f1f8;
429
- --interactive-secondary-text: #191924;
430
- --interactive-secondary-border: #e5e6f5;
431
- --interactive-destructive-bg: #a30016;
432
- --interactive-destructive-bg-hover: #81000f;
428
+ --interactive-secondary-bg-active: #e7e7ed;
429
+ --interactive-secondary-text: #191923;
430
+ --interactive-secondary-border: #b4b4c2;
431
+ --interactive-destructive-bg: #c3041e;
432
+ --interactive-destructive-bg-hover: #990015;
433
433
  --interactive-destructive-text: #ffffff;
434
434
  --interactive-ghost-bg: #ffffff;
435
- --interactive-ghost-bg-hover: #f1f1f8;
435
+ --interactive-ghost-bg-hover: #e7e7ed;
436
436
  }
437
437
 
438
438
 
@@ -442,14 +442,14 @@ html:not(.dark) .space-theme {
442
442
  --color-fd-foreground: #e8e8f0;
443
443
  --color-fd-card: #0e0e18;
444
444
  --color-fd-card-foreground: #e8e8f0;
445
- --color-fd-border: #41414d;
446
- --color-fd-muted: #41414d;
445
+ --color-fd-border: #3f3f4b;
446
+ --color-fd-muted: #0b0b14;
447
447
  --color-fd-muted-foreground: rgba(232, 232, 240, 0.72);
448
448
  --color-fd-accent: #5b6fff;
449
449
  --color-fd-accent-foreground: #ffffff;
450
450
  --color-fd-primary: #5b6fff;
451
451
  --color-fd-primary-foreground: #ffffff;
452
- --color-fd-secondary: #41414d;
452
+ --color-fd-secondary: #0b0b14;
453
453
  --color-fd-secondary-foreground: #e8e8f0;
454
454
  --color-fd-popover: #0e0e18;
455
455
  --color-fd-popover-foreground: #e8e8f0;
@@ -463,14 +463,14 @@ html:not(.dark) .space-theme {
463
463
  --color-fd-foreground: #1a1630;
464
464
  --color-fd-card: #f2f0f8;
465
465
  --color-fd-card-foreground: #1a1630;
466
- --color-fd-border: #ecedf8;
467
- --color-fd-muted: #f1f1f8;
466
+ --color-fd-border: #d2d2dd;
467
+ --color-fd-muted: #e7e7ed;
468
468
  --color-fd-muted-foreground: rgba(26, 22, 48, 0.72);
469
469
  --color-fd-accent: #5b6fff;
470
470
  --color-fd-accent-foreground: #ffffff;
471
471
  --color-fd-primary: #5b6fff;
472
472
  --color-fd-primary-foreground: #ffffff;
473
- --color-fd-secondary: #f1f1f8;
473
+ --color-fd-secondary: #e7e7ed;
474
474
  --color-fd-secondary-foreground: #1a1630;
475
475
  --color-fd-popover: #f2f0f8;
476
476
  --color-fd-popover-foreground: #1a1630;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@loworbitstudio/visor-core",
3
- "version": "0.6.0",
3
+ "version": "0.7.0",
4
4
  "description": "Design tokens for the Visor design system — CSS custom properties for theming.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.css",
@@ -48,7 +48,7 @@
48
48
  "access": "public"
49
49
  },
50
50
  "devDependencies": {
51
- "@loworbitstudio/visor-theme-engine": "^0.4.0",
51
+ "@loworbitstudio/visor-theme-engine": "^0.4.2",
52
52
  "@types/node": "^22.0.0",
53
53
  "tsx": "^4.19.2",
54
54
  "typescript": "^5.7.2",