@qw-ui/tokens 0.3.0-next.4 → 0.3.0-next.6
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.
- package/README.md +7 -4
- package/dist/color-architecture.d.ts +153 -3
- package/dist/derive/index.d.ts +2 -2
- package/dist/derive/live-css.d.ts +1 -1
- package/dist/derive/reference.d.ts +73 -13
- package/dist/derive/semantic.d.ts +17 -1
- package/dist/design-doc.d.ts +1 -1
- package/dist/figma/color-contract.d.ts +2 -0
- package/dist/figma/color-snapshot.d.ts +4 -0
- package/dist/index.d.ts +6 -5
- package/dist/index.js +863 -241
- package/dist/index.js.map +1 -1
- package/dist/schema.d.ts +3 -3
- package/dist/tokens.css +115 -94
- package/dist/tokens.json +209 -94
- package/dist/tokens.live.css +134 -10
- package/dist/tokens.ts +211 -131
- package/package.json +1 -1
- package/dist/compat/build.d.ts +0 -14
- package/dist/compat/color.d.ts +0 -8
- package/dist/compat/index.d.ts +0 -5
- package/dist/compat/schema.d.ts +0 -114
package/dist/tokens.live.css
CHANGED
|
@@ -31,9 +31,6 @@
|
|
|
31
31
|
--qw-seed-typography-font-family-text-windows-latin: 'Segoe UI', system-ui, Roboto, 'Noto Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
32
32
|
--qw-seed-typography-font-family-text-windows-zh: 'Microsoft YaHei', 'Segoe UI', system-ui, Roboto, 'Noto Sans SC', 'Helvetica Neue', Arial, sans-serif;
|
|
33
33
|
--qw-seed-typography-font-family-text-windows-ja: Meiryo, 'Yu Gothic UI', 'Segoe UI', system-ui, Roboto, 'Noto Sans JP', 'Helvetica Neue', Arial, sans-serif;
|
|
34
|
-
--qw-seed-typography-font-weight-regular: 400;
|
|
35
|
-
--qw-seed-typography-font-weight-medium: 500;
|
|
36
|
-
--qw-seed-typography-font-weight-semibold: 600;
|
|
37
34
|
--qw-seed-typography-font-size-base: 14px;
|
|
38
35
|
--qw-seed-typography-line-height-base: 1.5;
|
|
39
36
|
--qw-seed-typography-letter-spacing-base: 0px;
|
|
@@ -307,6 +304,12 @@
|
|
|
307
304
|
--qw-ref-color-brown-800: #542800;
|
|
308
305
|
--qw-ref-color-brown-900: #200B00;
|
|
309
306
|
--qw-ref-color-brown-base: var(--qw-seed-color-brown);
|
|
307
|
+
--qw-ref-color-brand-500-a20: rgba(66, 110, 255, 0.2);
|
|
308
|
+
--qw-ref-color-blue-600-a20: rgba(38, 111, 255, 0.2);
|
|
309
|
+
--qw-ref-color-blue-600-a40: rgba(38, 111, 255, 0.4);
|
|
310
|
+
--qw-ref-color-red-400-a10: rgba(255, 87, 69, 0.1);
|
|
311
|
+
--qw-ref-color-red-400-a20: rgba(255, 87, 69, 0.2);
|
|
312
|
+
--qw-ref-color-black-pure: #000000;
|
|
310
313
|
--qw-ref-size-spacing-1: calc(var(--qw-seed-size-spacing-step) * 1);
|
|
311
314
|
--qw-ref-size-spacing-2: calc(var(--qw-seed-size-spacing-step) * 2);
|
|
312
315
|
--qw-ref-size-spacing-3: calc(var(--qw-seed-size-spacing-step) * 3);
|
|
@@ -318,6 +321,7 @@
|
|
|
318
321
|
--qw-ref-size-radius-sm: calc(var(--qw-seed-size-radius-base) * 0.5);
|
|
319
322
|
--qw-ref-size-radius-md: var(--qw-seed-size-radius-base);
|
|
320
323
|
--qw-ref-size-radius-lg: calc(var(--qw-seed-size-radius-base) * 1.75);
|
|
324
|
+
--qw-ref-size-radius-xl: calc(var(--qw-seed-size-radius-base) * 2);
|
|
321
325
|
--qw-ref-size-radius-full: var(--qw-seed-size-radius-full);
|
|
322
326
|
--qw-ref-size-control-size-sm: calc(var(--qw-seed-size-control-size-base) - var(--qw-seed-size-spacing-step) * 2);
|
|
323
327
|
--qw-ref-size-control-size-md: var(--qw-seed-size-control-size-base);
|
|
@@ -325,7 +329,20 @@
|
|
|
325
329
|
--qw-ref-size-icon-size-sm: calc(var(--qw-seed-size-icon-size-base) - var(--qw-seed-size-spacing-step) * 1);
|
|
326
330
|
--qw-ref-size-icon-size-md: var(--qw-seed-size-icon-size-base);
|
|
327
331
|
--qw-ref-size-icon-size-lg: calc(var(--qw-seed-size-icon-size-base) + var(--qw-seed-size-spacing-step) * 1);
|
|
328
|
-
--qw-ref-size-
|
|
332
|
+
--qw-ref-size-stroke-width-half: calc(var(--qw-seed-size-border-width-hairline) * 0.5);
|
|
333
|
+
--qw-ref-size-stroke-width-base: var(--qw-seed-size-border-width-hairline);
|
|
334
|
+
--qw-ref-size-stroke-width-double: calc(var(--qw-seed-size-border-width-hairline) * 2);
|
|
335
|
+
--qw-ref-size-stroke-width-triple: calc(var(--qw-seed-size-border-width-hairline) * 3);
|
|
336
|
+
--qw-ref-size-action-control-height-2xs: 24px;
|
|
337
|
+
--qw-ref-size-action-control-height-xs: 28px;
|
|
338
|
+
--qw-ref-size-action-control-height-sm: 32px;
|
|
339
|
+
--qw-ref-size-action-control-height-md: 36px;
|
|
340
|
+
--qw-ref-size-action-control-height-lg: 42px;
|
|
341
|
+
--qw-ref-size-action-control-height-xl: 50px;
|
|
342
|
+
--qw-ref-size-action-control-icon-2xs: 14px;
|
|
343
|
+
--qw-ref-size-avatar-diameter-sm: 40px;
|
|
344
|
+
--qw-ref-size-avatar-diameter-md: 50px;
|
|
345
|
+
--qw-ref-size-avatar-diameter-lg: 58px;
|
|
329
346
|
--qw-ref-typography-line-height-tight: calc(var(--qw-seed-typography-line-height-base) - 0.25);
|
|
330
347
|
--qw-ref-typography-line-height-normal: var(--qw-seed-typography-line-height-base);
|
|
331
348
|
--qw-ref-typography-line-height-relaxed: calc(var(--qw-seed-typography-line-height-base) + 0.25);
|
|
@@ -343,10 +360,11 @@
|
|
|
343
360
|
--qw-ref-typography-font-family-text-windows-latin: var(--qw-seed-typography-font-family-text-windows-latin);
|
|
344
361
|
--qw-ref-typography-font-family-text-windows-zh: var(--qw-seed-typography-font-family-text-windows-zh);
|
|
345
362
|
--qw-ref-typography-font-family-text-windows-ja: var(--qw-seed-typography-font-family-text-windows-ja);
|
|
346
|
-
--qw-ref-typography-font-weight-regular:
|
|
347
|
-
--qw-ref-typography-font-weight-medium:
|
|
348
|
-
--qw-ref-typography-font-weight-semibold:
|
|
363
|
+
--qw-ref-typography-font-weight-regular: 400;
|
|
364
|
+
--qw-ref-typography-font-weight-medium: 500;
|
|
365
|
+
--qw-ref-typography-font-weight-semibold: 600;
|
|
349
366
|
--qw-ref-typography-font-size-base: var(--qw-seed-typography-font-size-base);
|
|
367
|
+
--qw-ref-typography-font-size-xs: round(nearest, calc(var(--qw-seed-typography-font-size-base) * 0.786), 1px);
|
|
350
368
|
--qw-ref-typography-font-size-sm: round(nearest, calc(var(--qw-seed-typography-font-size-base) * 0.857), 1px);
|
|
351
369
|
--qw-ref-typography-font-size-lg: round(nearest, calc(var(--qw-seed-typography-font-size-base) * 1.143), 1px);
|
|
352
370
|
--qw-ref-typography-font-size-xl: round(nearest, calc(var(--qw-seed-typography-font-size-base) * 1.429), 1px);
|
|
@@ -359,8 +377,10 @@
|
|
|
359
377
|
--qw-ref-effect-shadow-sm: calc(var(--qw-seed-effect-shadow-base-offset-x) * 0.5) calc(var(--qw-seed-effect-shadow-base-offset-y) * 0.5) calc(var(--qw-seed-effect-shadow-base-blur) * 0.5) calc(var(--qw-seed-effect-shadow-base-spread) * 0.5) rgb(0 0 0 / calc(var(--qw-seed-size-opacity-alpha-step) * 2));
|
|
360
378
|
--qw-ref-effect-shadow-md: calc(var(--qw-seed-effect-shadow-base-offset-x) * 2) calc(var(--qw-seed-effect-shadow-base-offset-y) * 2) calc(var(--qw-seed-effect-shadow-base-blur) * 3) calc(var(--qw-seed-effect-shadow-base-spread) * 2) rgb(0 0 0 / calc(var(--qw-seed-size-opacity-alpha-step) * 3));
|
|
361
379
|
--qw-ref-effect-shadow-lg: calc(var(--qw-seed-effect-shadow-base-offset-x) * 4) calc(var(--qw-seed-effect-shadow-base-offset-y) * 4) calc(var(--qw-seed-effect-shadow-base-blur) * 6) calc(var(--qw-seed-effect-shadow-base-spread) * 4) rgb(0 0 0 / calc(var(--qw-seed-size-opacity-alpha-step) * 4));
|
|
380
|
+
--qw-sem-size-radius-sm: var(--qw-ref-size-radius-sm);
|
|
362
381
|
--qw-sem-size-radius-control: var(--qw-ref-size-radius-md);
|
|
363
382
|
--qw-sem-size-radius-card: var(--qw-ref-size-radius-lg);
|
|
383
|
+
--qw-sem-size-radius-xl: var(--qw-ref-size-radius-xl);
|
|
364
384
|
--qw-sem-size-radius-pill: var(--qw-ref-size-radius-full);
|
|
365
385
|
--qw-sem-size-radius-full: var(--qw-ref-size-radius-full);
|
|
366
386
|
--qw-sem-size-control-height-sm: var(--qw-ref-size-control-size-sm);
|
|
@@ -369,6 +389,40 @@
|
|
|
369
389
|
--qw-sem-size-icon-size-sm: var(--qw-ref-size-icon-size-sm);
|
|
370
390
|
--qw-sem-size-icon-size-md: var(--qw-ref-size-icon-size-md);
|
|
371
391
|
--qw-sem-size-icon-size-lg: var(--qw-ref-size-icon-size-lg);
|
|
392
|
+
--qw-sem-size-action-control-height-2xs: var(--qw-ref-size-action-control-height-2xs);
|
|
393
|
+
--qw-sem-size-action-control-height-xs: var(--qw-ref-size-action-control-height-xs);
|
|
394
|
+
--qw-sem-size-action-control-height-sm: var(--qw-ref-size-action-control-height-sm);
|
|
395
|
+
--qw-sem-size-action-control-height-md: var(--qw-ref-size-action-control-height-md);
|
|
396
|
+
--qw-sem-size-action-control-height-lg: var(--qw-ref-size-action-control-height-lg);
|
|
397
|
+
--qw-sem-size-action-control-height-xl: var(--qw-ref-size-action-control-height-xl);
|
|
398
|
+
--qw-sem-size-action-control-padding-inline-2xs: var(--qw-ref-size-spacing-2);
|
|
399
|
+
--qw-sem-size-action-control-padding-inline-xs: var(--qw-ref-size-spacing-2);
|
|
400
|
+
--qw-sem-size-action-control-padding-inline-sm: var(--qw-ref-size-spacing-4);
|
|
401
|
+
--qw-sem-size-action-control-padding-inline-md: var(--qw-ref-size-spacing-4);
|
|
402
|
+
--qw-sem-size-action-control-padding-inline-lg: var(--qw-ref-size-spacing-5);
|
|
403
|
+
--qw-sem-size-action-control-padding-inline-xl: var(--qw-ref-size-spacing-8);
|
|
404
|
+
--qw-sem-size-action-control-icon-2xs: var(--qw-ref-size-action-control-icon-2xs);
|
|
405
|
+
--qw-sem-size-action-control-icon-xs: var(--qw-ref-size-icon-size-sm);
|
|
406
|
+
--qw-sem-size-action-control-icon-sm: var(--qw-ref-size-icon-size-sm);
|
|
407
|
+
--qw-sem-size-action-control-icon-md: var(--qw-ref-size-icon-size-sm);
|
|
408
|
+
--qw-sem-size-action-control-icon-lg: var(--qw-ref-size-icon-size-sm);
|
|
409
|
+
--qw-sem-size-action-control-icon-xl: var(--qw-ref-size-icon-size-md);
|
|
410
|
+
--qw-sem-size-action-control-gap-2xs: var(--qw-ref-size-spacing-1);
|
|
411
|
+
--qw-sem-size-action-control-gap-xs: var(--qw-ref-size-spacing-1);
|
|
412
|
+
--qw-sem-size-action-control-gap-sm: var(--qw-ref-size-spacing-2);
|
|
413
|
+
--qw-sem-size-action-control-gap-md: var(--qw-ref-size-spacing-2);
|
|
414
|
+
--qw-sem-size-action-control-gap-lg: var(--qw-ref-size-spacing-2);
|
|
415
|
+
--qw-sem-size-action-control-gap-xl: var(--qw-ref-size-spacing-2);
|
|
416
|
+
--qw-sem-size-border-width-default: var(--qw-ref-size-stroke-width-base);
|
|
417
|
+
--qw-sem-size-border-width-strong: var(--qw-ref-size-stroke-width-double);
|
|
418
|
+
--qw-sem-size-divider-width-thin: var(--qw-ref-size-stroke-width-half);
|
|
419
|
+
--qw-sem-size-divider-width-default: var(--qw-ref-size-stroke-width-base);
|
|
420
|
+
--qw-sem-size-focus-ring-width: var(--qw-ref-size-stroke-width-double);
|
|
421
|
+
--qw-sem-size-focus-ring-offset: var(--qw-ref-size-stroke-width-double);
|
|
422
|
+
--qw-sem-size-indicator-loading: var(--qw-ref-size-stroke-width-double);
|
|
423
|
+
--qw-sem-size-avatar-diameter-sm: var(--qw-ref-size-avatar-diameter-sm);
|
|
424
|
+
--qw-sem-size-avatar-diameter-md: var(--qw-ref-size-avatar-diameter-md);
|
|
425
|
+
--qw-sem-size-avatar-diameter-lg: var(--qw-ref-size-avatar-diameter-lg);
|
|
372
426
|
--qw-sem-size-inset-sm: var(--qw-ref-size-spacing-2);
|
|
373
427
|
--qw-sem-size-stack-sm: var(--qw-ref-size-spacing-2);
|
|
374
428
|
--qw-sem-size-inset-md: var(--qw-ref-size-spacing-4);
|
|
@@ -413,6 +467,16 @@
|
|
|
413
467
|
--qw-sem-typography-caption-font-weight: var(--qw-ref-typography-font-weight-regular);
|
|
414
468
|
--qw-sem-typography-caption-line-height: var(--qw-ref-typography-line-height-normal);
|
|
415
469
|
--qw-sem-typography-caption-letter-spacing: var(--qw-ref-typography-letter-spacing-base);
|
|
470
|
+
--qw-sem-typography-body-lg-font-family: var(--qw-ref-typography-font-family-text);
|
|
471
|
+
--qw-sem-typography-body-lg-font-size: var(--qw-ref-typography-font-size-lg);
|
|
472
|
+
--qw-sem-typography-body-lg-font-weight: var(--qw-ref-typography-font-weight-regular);
|
|
473
|
+
--qw-sem-typography-body-lg-line-height: var(--qw-ref-typography-line-height-normal);
|
|
474
|
+
--qw-sem-typography-body-lg-letter-spacing: var(--qw-ref-typography-letter-spacing-base);
|
|
475
|
+
--qw-sem-typography-label-sm-font-family: var(--qw-ref-typography-font-family-text);
|
|
476
|
+
--qw-sem-typography-label-sm-font-size: var(--qw-ref-typography-font-size-xs);
|
|
477
|
+
--qw-sem-typography-label-sm-font-weight: var(--qw-ref-typography-font-weight-medium);
|
|
478
|
+
--qw-sem-typography-label-sm-line-height: var(--qw-ref-typography-line-height-normal);
|
|
479
|
+
--qw-sem-typography-label-sm-letter-spacing: var(--qw-ref-typography-letter-spacing-base);
|
|
416
480
|
--qw-sem-typography-code-font-family: var(--qw-ref-typography-font-family-code);
|
|
417
481
|
--qw-sem-typography-code-font-size: var(--qw-ref-typography-font-size-sm);
|
|
418
482
|
--qw-sem-typography-code-font-weight: var(--qw-ref-typography-font-weight-regular);
|
|
@@ -427,30 +491,64 @@
|
|
|
427
491
|
--qw-sem-color-surface-elevated: var(--qw-ref-color-white-base);
|
|
428
492
|
--qw-sem-color-surface-header: var(--qw-ref-color-gray-100);
|
|
429
493
|
--qw-sem-color-surface-brand-subtle: var(--qw-ref-color-blue-50);
|
|
494
|
+
--qw-sem-color-surface-canvas: var(--qw-ref-color-white-base);
|
|
495
|
+
--qw-sem-color-surface-sunken: var(--qw-ref-color-gray-100);
|
|
496
|
+
--qw-sem-color-surface-selected: var(--qw-ref-color-black-a5);
|
|
497
|
+
--qw-sem-color-surface-inverse: var(--qw-ref-color-black-800);
|
|
498
|
+
--qw-sem-color-surface-canvas-subtle: var(--qw-ref-color-gray-50);
|
|
430
499
|
--qw-sem-color-content-primary: var(--qw-ref-color-black-base);
|
|
431
500
|
--qw-sem-color-content-secondary: var(--qw-ref-color-gray-600);
|
|
432
501
|
--qw-sem-color-content-tertiary: var(--qw-ref-color-gray-base);
|
|
433
502
|
--qw-sem-color-content-placeholder: var(--qw-ref-color-gray-300);
|
|
434
503
|
--qw-sem-color-content-intro: var(--qw-ref-color-gray-400);
|
|
504
|
+
--qw-sem-color-content-disabled: var(--qw-ref-color-black-a30);
|
|
505
|
+
--qw-sem-color-content-link: var(--qw-ref-color-blue-700);
|
|
506
|
+
--qw-sem-color-content-icon-subtle: var(--qw-ref-color-black-a5);
|
|
507
|
+
--qw-sem-color-content-inverse: var(--qw-ref-color-white-base);
|
|
508
|
+
--qw-sem-color-content-on-solid: var(--qw-ref-color-white-base);
|
|
509
|
+
--qw-sem-color-content-on-warning-subtle: var(--qw-ref-color-yellow-800);
|
|
435
510
|
--qw-sem-color-border-default: var(--qw-ref-color-gray-100);
|
|
436
511
|
--qw-sem-color-border-strong: var(--qw-ref-color-gray-300);
|
|
437
512
|
--qw-sem-color-border-focus: var(--qw-ref-color-brand-base);
|
|
513
|
+
--qw-sem-color-border-subtle: var(--qw-ref-color-black-a5);
|
|
514
|
+
--qw-sem-color-border-disabled: var(--qw-ref-color-black-a10);
|
|
515
|
+
--qw-sem-color-border-on-media: var(--qw-ref-color-white-base);
|
|
438
516
|
--qw-sem-color-fill-subtle: var(--qw-ref-color-gray-50);
|
|
439
517
|
--qw-sem-color-fill-hover: var(--qw-ref-color-gray-100);
|
|
440
518
|
--qw-sem-color-fill-active: var(--qw-ref-color-blue-50);
|
|
441
519
|
--qw-sem-color-fill-disabled: var(--qw-ref-color-gray-50);
|
|
520
|
+
--qw-sem-color-fill-track: var(--qw-ref-color-black-a10);
|
|
442
521
|
--qw-sem-color-action-brand: var(--qw-ref-color-brand-base);
|
|
443
522
|
--qw-sem-color-action-product: var(--qw-ref-color-blue-base);
|
|
444
523
|
--qw-sem-color-action-selected: var(--qw-ref-color-blue-a20);
|
|
445
524
|
--qw-sem-color-action-inverse: var(--qw-ref-color-white-base);
|
|
525
|
+
--qw-sem-color-control-action-brand-subtle: var(--qw-ref-color-brand-a10);
|
|
526
|
+
--qw-sem-color-control-action-product-subtle: var(--qw-ref-color-blue-a10);
|
|
527
|
+
--qw-sem-color-control-action-danger-default: var(--qw-ref-color-red-400);
|
|
528
|
+
--qw-sem-color-control-action-danger-subtle: var(--qw-ref-color-red-400-a10);
|
|
529
|
+
--qw-sem-color-control-action-neutral-subtle: var(--qw-ref-color-black-a5);
|
|
530
|
+
--qw-sem-color-control-selection-brand: var(--qw-ref-color-brand-a10);
|
|
531
|
+
--qw-sem-color-control-selection-product: var(--qw-ref-color-blue-a10);
|
|
532
|
+
--qw-sem-color-selection-text-background: var(--qw-ref-color-blue-a20);
|
|
446
533
|
--qw-sem-color-status-success: var(--qw-ref-color-green-base);
|
|
447
534
|
--qw-sem-color-status-warning: var(--qw-ref-color-yellow-base);
|
|
448
535
|
--qw-sem-color-status-danger: var(--qw-ref-color-red-400);
|
|
449
536
|
--qw-sem-color-status-info: var(--qw-ref-color-blue-base);
|
|
537
|
+
--qw-sem-color-status-success-subtle: var(--qw-ref-color-green-a10);
|
|
538
|
+
--qw-sem-color-status-warning-subtle: var(--qw-ref-color-yellow-a20);
|
|
539
|
+
--qw-sem-color-status-danger-subtle: var(--qw-ref-color-red-400-a10);
|
|
540
|
+
--qw-sem-color-status-info-subtle: var(--qw-ref-color-blue-a10);
|
|
450
541
|
--qw-sem-color-overlay-scrim: var(--qw-ref-color-black-a50);
|
|
451
|
-
--qw-sem-color-overlay-guide: var(--qw-ref-color-
|
|
542
|
+
--qw-sem-color-overlay-guide: var(--qw-ref-color-blue-a10);
|
|
543
|
+
--qw-sem-color-overlay-media-subtle: var(--qw-ref-color-black-a40);
|
|
544
|
+
--qw-sem-color-overlay-media-strong: var(--qw-ref-color-black-a50);
|
|
452
545
|
--qw-sem-color-shadow: var(--qw-ref-color-black-a10);
|
|
453
|
-
--qw-sem-effect-shadow-
|
|
546
|
+
--qw-sem-effect-shadow-card-color: var(--qw-ref-color-black-a10);
|
|
547
|
+
--qw-sem-effect-shadow-floating-color: var(--qw-ref-color-black-a10);
|
|
548
|
+
--qw-sem-effect-shadow-dialog-color: var(--qw-ref-color-black-a10);
|
|
549
|
+
--qw-sem-effect-shadow-card: calc(var(--qw-seed-effect-shadow-base-offset-x) * 0.5) calc(var(--qw-seed-effect-shadow-base-offset-y) * 0.5) calc(var(--qw-seed-effect-shadow-base-blur) * 0.5) calc(var(--qw-seed-effect-shadow-base-spread) * 0.5) var(--qw-sem-effect-shadow-card-color);
|
|
550
|
+
--qw-sem-effect-shadow-floating: calc(var(--qw-seed-effect-shadow-base-offset-x) * 2) calc(var(--qw-seed-effect-shadow-base-offset-y) * 2) calc(var(--qw-seed-effect-shadow-base-blur) * 3) calc(var(--qw-seed-effect-shadow-base-spread) * 2) var(--qw-sem-effect-shadow-floating-color);
|
|
551
|
+
--qw-sem-effect-shadow-dialog: calc(var(--qw-seed-effect-shadow-base-offset-x) * 4) calc(var(--qw-seed-effect-shadow-base-offset-y) * 4) calc(var(--qw-seed-effect-shadow-base-blur) * 6) calc(var(--qw-seed-effect-shadow-base-spread) * 4) var(--qw-sem-effect-shadow-dialog-color);
|
|
454
552
|
}
|
|
455
553
|
|
|
456
554
|
[data-qw-mode="dark"] {
|
|
@@ -459,23 +557,49 @@
|
|
|
459
557
|
--qw-sem-color-surface-elevated: var(--qw-ref-color-gray-800);
|
|
460
558
|
--qw-sem-color-surface-header: var(--qw-ref-color-gray-700);
|
|
461
559
|
--qw-sem-color-surface-brand-subtle: var(--qw-ref-color-blue-800);
|
|
560
|
+
--qw-sem-color-surface-canvas: var(--qw-ref-color-black-pure);
|
|
561
|
+
--qw-sem-color-surface-sunken: var(--qw-ref-color-gray-800);
|
|
562
|
+
--qw-sem-color-surface-selected: var(--qw-ref-color-white-a10);
|
|
563
|
+
--qw-sem-color-surface-canvas-subtle: var(--qw-ref-color-black-pure);
|
|
462
564
|
--qw-sem-color-content-primary: var(--qw-ref-color-white-base);
|
|
463
565
|
--qw-sem-color-content-secondary: var(--qw-ref-color-gray-base);
|
|
464
566
|
--qw-sem-color-content-tertiary: var(--qw-ref-color-gray-600);
|
|
465
567
|
--qw-sem-color-content-placeholder: var(--qw-ref-color-white-a30);
|
|
466
568
|
--qw-sem-color-content-intro: var(--qw-ref-color-gray-500);
|
|
569
|
+
--qw-sem-color-content-disabled: var(--qw-ref-color-white-a30);
|
|
570
|
+
--qw-sem-color-content-link: var(--qw-ref-color-blue-400);
|
|
571
|
+
--qw-sem-color-content-icon-subtle: var(--qw-ref-color-white-a10);
|
|
572
|
+
--qw-sem-color-content-inverse: var(--qw-ref-color-black-base);
|
|
573
|
+
--qw-sem-color-content-on-warning-subtle: var(--qw-ref-color-yellow-200);
|
|
467
574
|
--qw-sem-color-border-default: var(--qw-ref-color-gray-700);
|
|
468
575
|
--qw-sem-color-border-strong: var(--qw-ref-color-gray-600);
|
|
469
576
|
--qw-sem-color-border-focus: var(--qw-ref-color-brand-500);
|
|
577
|
+
--qw-sem-color-border-subtle: var(--qw-ref-color-white-a5);
|
|
578
|
+
--qw-sem-color-border-disabled: var(--qw-ref-color-white-a10);
|
|
470
579
|
--qw-sem-color-fill-subtle: var(--qw-ref-color-white-a20);
|
|
471
580
|
--qw-sem-color-fill-hover: var(--qw-ref-color-gray-800);
|
|
472
581
|
--qw-sem-color-fill-active: var(--qw-ref-color-blue-800);
|
|
473
582
|
--qw-sem-color-fill-disabled: var(--qw-ref-color-gray-900);
|
|
583
|
+
--qw-sem-color-fill-track: var(--qw-ref-color-white-a20);
|
|
474
584
|
--qw-sem-color-action-brand: var(--qw-ref-color-brand-500);
|
|
475
585
|
--qw-sem-color-action-product: var(--qw-ref-color-blue-600);
|
|
476
|
-
--qw-sem-color-action-selected: var(--qw-ref-color-blue-a40);
|
|
586
|
+
--qw-sem-color-action-selected: var(--qw-ref-color-blue-600-a40);
|
|
477
587
|
--qw-sem-color-action-inverse: var(--qw-ref-color-black-base);
|
|
588
|
+
--qw-sem-color-control-action-brand-subtle: var(--qw-ref-color-brand-500-a20);
|
|
589
|
+
--qw-sem-color-control-action-product-subtle: var(--qw-ref-color-blue-600-a20);
|
|
590
|
+
--qw-sem-color-control-action-danger-subtle: var(--qw-ref-color-red-400-a20);
|
|
591
|
+
--qw-sem-color-control-action-neutral-subtle: var(--qw-ref-color-white-a10);
|
|
592
|
+
--qw-sem-color-control-selection-brand: var(--qw-ref-color-brand-500-a20);
|
|
593
|
+
--qw-sem-color-control-selection-product: var(--qw-ref-color-blue-600-a20);
|
|
594
|
+
--qw-sem-color-selection-text-background: var(--qw-ref-color-blue-600-a40);
|
|
478
595
|
--qw-sem-color-status-info: var(--qw-ref-color-blue-600);
|
|
596
|
+
--qw-sem-color-status-success-subtle: var(--qw-ref-color-green-a20);
|
|
597
|
+
--qw-sem-color-status-danger-subtle: var(--qw-ref-color-red-400-a20);
|
|
598
|
+
--qw-sem-color-status-info-subtle: var(--qw-ref-color-blue-600-a20);
|
|
479
599
|
--qw-sem-color-overlay-scrim: var(--qw-ref-color-black-a70);
|
|
600
|
+
--qw-sem-color-overlay-guide: var(--qw-ref-color-blue-600-a20);
|
|
480
601
|
--qw-sem-color-shadow: var(--qw-ref-color-black-a50);
|
|
602
|
+
--qw-sem-effect-shadow-card-color: var(--qw-ref-color-black-a50);
|
|
603
|
+
--qw-sem-effect-shadow-floating-color: var(--qw-ref-color-black-a50);
|
|
604
|
+
--qw-sem-effect-shadow-dialog-color: var(--qw-ref-color-black-a50);
|
|
481
605
|
}
|