@adobe/spectrum-tokens 12.0.0-beta.24 → 12.0.0-beta.27
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/CHANGELOG.md +2 -2
- package/dist/json/variables.json +164 -50
- package/package.json +1 -1
- package/src/color-alias.json +48 -0
- package/src/component-layout.json +22 -50
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
# [12.0.0-beta.
|
|
1
|
+
# [12.0.0-beta.27](https://github.com/adobe/spectrum-tokens/compare/v12.0.0-beta.26...v12.0.0-beta.27) (2022-06-01)
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
### Features
|
|
5
5
|
|
|
6
|
-
* adding
|
|
6
|
+
* adding tokens for 3 backgrounds ([#38](https://github.com/adobe/spectrum-tokens/issues/38)) ([cf839d3](https://github.com/adobe/spectrum-tokens/commit/cf839d37658b60251db71596da0f4ad91567d5f2))
|
package/dist/json/variables.json
CHANGED
|
@@ -2600,6 +2600,150 @@
|
|
|
2600
2600
|
}
|
|
2601
2601
|
}
|
|
2602
2602
|
},
|
|
2603
|
+
"background-base-color": {
|
|
2604
|
+
"sets": {
|
|
2605
|
+
"light": {
|
|
2606
|
+
"ref": "{gray-50}",
|
|
2607
|
+
"sets": {
|
|
2608
|
+
"light": {
|
|
2609
|
+
"value": "rgb(255, 255, 255)"
|
|
2610
|
+
},
|
|
2611
|
+
"dark": {
|
|
2612
|
+
"value": "rgb(29, 29, 29)"
|
|
2613
|
+
},
|
|
2614
|
+
"darkest": {
|
|
2615
|
+
"value": "rgb(0, 0, 0)"
|
|
2616
|
+
},
|
|
2617
|
+
"wireframe": {
|
|
2618
|
+
"value": "rgb(255, 255, 255)"
|
|
2619
|
+
}
|
|
2620
|
+
}
|
|
2621
|
+
},
|
|
2622
|
+
"dark": {
|
|
2623
|
+
"ref": "{gray-100}",
|
|
2624
|
+
"sets": {
|
|
2625
|
+
"light": {
|
|
2626
|
+
"value": "rgb(248, 248, 248)"
|
|
2627
|
+
},
|
|
2628
|
+
"dark": {
|
|
2629
|
+
"value": "rgb(50, 50, 50)"
|
|
2630
|
+
},
|
|
2631
|
+
"darkest": {
|
|
2632
|
+
"value": "rgb(29, 29, 29)"
|
|
2633
|
+
},
|
|
2634
|
+
"wireframe": {
|
|
2635
|
+
"value": "rgb(244, 246, 252)"
|
|
2636
|
+
}
|
|
2637
|
+
}
|
|
2638
|
+
},
|
|
2639
|
+
"darkest": {
|
|
2640
|
+
"ref": "{gray-100}",
|
|
2641
|
+
"sets": {
|
|
2642
|
+
"light": {
|
|
2643
|
+
"value": "rgb(248, 248, 248)"
|
|
2644
|
+
},
|
|
2645
|
+
"dark": {
|
|
2646
|
+
"value": "rgb(50, 50, 50)"
|
|
2647
|
+
},
|
|
2648
|
+
"darkest": {
|
|
2649
|
+
"value": "rgb(29, 29, 29)"
|
|
2650
|
+
},
|
|
2651
|
+
"wireframe": {
|
|
2652
|
+
"value": "rgb(244, 246, 252)"
|
|
2653
|
+
}
|
|
2654
|
+
}
|
|
2655
|
+
},
|
|
2656
|
+
"wireframe": {
|
|
2657
|
+
"ref": "{gray-50}",
|
|
2658
|
+
"sets": {
|
|
2659
|
+
"light": {
|
|
2660
|
+
"value": "rgb(255, 255, 255)"
|
|
2661
|
+
},
|
|
2662
|
+
"dark": {
|
|
2663
|
+
"value": "rgb(29, 29, 29)"
|
|
2664
|
+
},
|
|
2665
|
+
"darkest": {
|
|
2666
|
+
"value": "rgb(0, 0, 0)"
|
|
2667
|
+
},
|
|
2668
|
+
"wireframe": {
|
|
2669
|
+
"value": "rgb(255, 255, 255)"
|
|
2670
|
+
}
|
|
2671
|
+
}
|
|
2672
|
+
}
|
|
2673
|
+
}
|
|
2674
|
+
},
|
|
2675
|
+
"background-layer-1-color": {
|
|
2676
|
+
"sets": {
|
|
2677
|
+
"light": {
|
|
2678
|
+
"ref": "{gray-100}",
|
|
2679
|
+
"sets": {
|
|
2680
|
+
"light": {
|
|
2681
|
+
"value": "rgb(248, 248, 248)"
|
|
2682
|
+
},
|
|
2683
|
+
"dark": {
|
|
2684
|
+
"value": "rgb(50, 50, 50)"
|
|
2685
|
+
},
|
|
2686
|
+
"darkest": {
|
|
2687
|
+
"value": "rgb(29, 29, 29)"
|
|
2688
|
+
},
|
|
2689
|
+
"wireframe": {
|
|
2690
|
+
"value": "rgb(244, 246, 252)"
|
|
2691
|
+
}
|
|
2692
|
+
}
|
|
2693
|
+
},
|
|
2694
|
+
"dark": {
|
|
2695
|
+
"ref": "{gray-75}",
|
|
2696
|
+
"sets": {
|
|
2697
|
+
"light": {
|
|
2698
|
+
"value": "rgb(253, 253, 253)"
|
|
2699
|
+
},
|
|
2700
|
+
"dark": {
|
|
2701
|
+
"value": "rgb(38, 38, 38)"
|
|
2702
|
+
},
|
|
2703
|
+
"darkest": {
|
|
2704
|
+
"value": "rgb(14, 14, 14)"
|
|
2705
|
+
},
|
|
2706
|
+
"wireframe": {
|
|
2707
|
+
"value": "rgb(253, 253, 254)"
|
|
2708
|
+
}
|
|
2709
|
+
}
|
|
2710
|
+
},
|
|
2711
|
+
"darkest": {
|
|
2712
|
+
"ref": "{gray-75}",
|
|
2713
|
+
"sets": {
|
|
2714
|
+
"light": {
|
|
2715
|
+
"value": "rgb(253, 253, 253)"
|
|
2716
|
+
},
|
|
2717
|
+
"dark": {
|
|
2718
|
+
"value": "rgb(38, 38, 38)"
|
|
2719
|
+
},
|
|
2720
|
+
"darkest": {
|
|
2721
|
+
"value": "rgb(14, 14, 14)"
|
|
2722
|
+
},
|
|
2723
|
+
"wireframe": {
|
|
2724
|
+
"value": "rgb(253, 253, 254)"
|
|
2725
|
+
}
|
|
2726
|
+
}
|
|
2727
|
+
},
|
|
2728
|
+
"wireframe": {
|
|
2729
|
+
"ref": "{gray-100}",
|
|
2730
|
+
"sets": {
|
|
2731
|
+
"light": {
|
|
2732
|
+
"value": "rgb(248, 248, 248)"
|
|
2733
|
+
},
|
|
2734
|
+
"dark": {
|
|
2735
|
+
"value": "rgb(50, 50, 50)"
|
|
2736
|
+
},
|
|
2737
|
+
"darkest": {
|
|
2738
|
+
"value": "rgb(29, 29, 29)"
|
|
2739
|
+
},
|
|
2740
|
+
"wireframe": {
|
|
2741
|
+
"value": "rgb(244, 246, 252)"
|
|
2742
|
+
}
|
|
2743
|
+
}
|
|
2744
|
+
}
|
|
2745
|
+
}
|
|
2746
|
+
},
|
|
2603
2747
|
"accent-color-100": {
|
|
2604
2748
|
"sets": {
|
|
2605
2749
|
"spectrum": {
|
|
@@ -7448,56 +7592,6 @@
|
|
|
7448
7592
|
}
|
|
7449
7593
|
}
|
|
7450
7594
|
},
|
|
7451
|
-
"component-minimum-width-50": {
|
|
7452
|
-
"sets": {
|
|
7453
|
-
"desktop": {
|
|
7454
|
-
"value": "20px"
|
|
7455
|
-
},
|
|
7456
|
-
"mobile": {
|
|
7457
|
-
"value": "26px"
|
|
7458
|
-
}
|
|
7459
|
-
}
|
|
7460
|
-
},
|
|
7461
|
-
"component-minimum-width-75": {
|
|
7462
|
-
"sets": {
|
|
7463
|
-
"desktop": {
|
|
7464
|
-
"value": "24px"
|
|
7465
|
-
},
|
|
7466
|
-
"mobile": {
|
|
7467
|
-
"value": "30px"
|
|
7468
|
-
}
|
|
7469
|
-
}
|
|
7470
|
-
},
|
|
7471
|
-
"component-minimum-width-100": {
|
|
7472
|
-
"sets": {
|
|
7473
|
-
"desktop": {
|
|
7474
|
-
"value": "32px"
|
|
7475
|
-
},
|
|
7476
|
-
"mobile": {
|
|
7477
|
-
"value": "40px"
|
|
7478
|
-
}
|
|
7479
|
-
}
|
|
7480
|
-
},
|
|
7481
|
-
"component-minimum-width-200": {
|
|
7482
|
-
"sets": {
|
|
7483
|
-
"desktop": {
|
|
7484
|
-
"value": "40px"
|
|
7485
|
-
},
|
|
7486
|
-
"mobile": {
|
|
7487
|
-
"value": "50px"
|
|
7488
|
-
}
|
|
7489
|
-
}
|
|
7490
|
-
},
|
|
7491
|
-
"component-minimum-width-300": {
|
|
7492
|
-
"sets": {
|
|
7493
|
-
"desktop": {
|
|
7494
|
-
"value": "48px"
|
|
7495
|
-
},
|
|
7496
|
-
"mobile": {
|
|
7497
|
-
"value": "60px"
|
|
7498
|
-
}
|
|
7499
|
-
}
|
|
7500
|
-
},
|
|
7501
7595
|
"component-height-50": {
|
|
7502
7596
|
"sets": {
|
|
7503
7597
|
"desktop": {
|
|
@@ -7698,6 +7792,26 @@
|
|
|
7698
7792
|
}
|
|
7699
7793
|
}
|
|
7700
7794
|
},
|
|
7795
|
+
"action-bar-height": {
|
|
7796
|
+
"sets": {
|
|
7797
|
+
"desktop": {
|
|
7798
|
+
"value": "48px"
|
|
7799
|
+
},
|
|
7800
|
+
"mobile": {
|
|
7801
|
+
"value": "56px"
|
|
7802
|
+
}
|
|
7803
|
+
}
|
|
7804
|
+
},
|
|
7805
|
+
"action-bar-top-to-item-counter": {
|
|
7806
|
+
"sets": {
|
|
7807
|
+
"desktop": {
|
|
7808
|
+
"value": "14px"
|
|
7809
|
+
},
|
|
7810
|
+
"mobile": {
|
|
7811
|
+
"value": "16px"
|
|
7812
|
+
}
|
|
7813
|
+
}
|
|
7814
|
+
},
|
|
7701
7815
|
"action-button-edge-to-hold-icon-small": {
|
|
7702
7816
|
"sets": {
|
|
7703
7817
|
"desktop": {
|
package/package.json
CHANGED
package/src/color-alias.json
CHANGED
|
@@ -542,5 +542,53 @@
|
|
|
542
542
|
"value": "rgba(0, 0, 0, 0.80)"
|
|
543
543
|
}
|
|
544
544
|
}
|
|
545
|
+
},
|
|
546
|
+
"background-base-color": {
|
|
547
|
+
"sets": {
|
|
548
|
+
"light": {
|
|
549
|
+
"value": "{gray-200}"
|
|
550
|
+
},
|
|
551
|
+
"dark": {
|
|
552
|
+
"value": "{gray-50}"
|
|
553
|
+
},
|
|
554
|
+
"darkest": {
|
|
555
|
+
"value": "{gray-50}"
|
|
556
|
+
},
|
|
557
|
+
"wireframe": {
|
|
558
|
+
"value": "{gray-200}"
|
|
559
|
+
}
|
|
560
|
+
}
|
|
561
|
+
},
|
|
562
|
+
"background-layer-1-color": {
|
|
563
|
+
"sets": {
|
|
564
|
+
"light": {
|
|
565
|
+
"value": "{gray-100}"
|
|
566
|
+
},
|
|
567
|
+
"dark": {
|
|
568
|
+
"value": "{gray-75}"
|
|
569
|
+
},
|
|
570
|
+
"darkest": {
|
|
571
|
+
"value": "{gray-75}"
|
|
572
|
+
},
|
|
573
|
+
"wireframe": {
|
|
574
|
+
"value": "{gray-100}"
|
|
575
|
+
}
|
|
576
|
+
}
|
|
577
|
+
},
|
|
578
|
+
"background-base-color": {
|
|
579
|
+
"sets": {
|
|
580
|
+
"light": {
|
|
581
|
+
"value": "{gray-50}"
|
|
582
|
+
},
|
|
583
|
+
"dark": {
|
|
584
|
+
"value": "{gray-100}"
|
|
585
|
+
},
|
|
586
|
+
"darkest": {
|
|
587
|
+
"value": "{gray-100}"
|
|
588
|
+
},
|
|
589
|
+
"wireframe": {
|
|
590
|
+
"value": "{gray-50}"
|
|
591
|
+
}
|
|
592
|
+
}
|
|
545
593
|
}
|
|
546
594
|
}
|
|
@@ -271,56 +271,7 @@
|
|
|
271
271
|
}
|
|
272
272
|
}
|
|
273
273
|
},
|
|
274
|
-
|
|
275
|
-
"sets": {
|
|
276
|
-
"desktop": {
|
|
277
|
-
"value": "20px"
|
|
278
|
-
},
|
|
279
|
-
"mobile": {
|
|
280
|
-
"value": "26px"
|
|
281
|
-
}
|
|
282
|
-
}
|
|
283
|
-
},
|
|
284
|
-
"component-minimum-width-75": {
|
|
285
|
-
"sets": {
|
|
286
|
-
"desktop": {
|
|
287
|
-
"value": "24px"
|
|
288
|
-
},
|
|
289
|
-
"mobile": {
|
|
290
|
-
"value": "30px"
|
|
291
|
-
}
|
|
292
|
-
}
|
|
293
|
-
},
|
|
294
|
-
"component-minimum-width-100": {
|
|
295
|
-
"sets": {
|
|
296
|
-
"desktop": {
|
|
297
|
-
"value": "32px"
|
|
298
|
-
},
|
|
299
|
-
"mobile": {
|
|
300
|
-
"value": "40px"
|
|
301
|
-
}
|
|
302
|
-
}
|
|
303
|
-
},
|
|
304
|
-
"component-minimum-width-200": {
|
|
305
|
-
"sets": {
|
|
306
|
-
"desktop": {
|
|
307
|
-
"value": "40px"
|
|
308
|
-
},
|
|
309
|
-
"mobile": {
|
|
310
|
-
"value": "50px"
|
|
311
|
-
}
|
|
312
|
-
}
|
|
313
|
-
},
|
|
314
|
-
"component-minimum-width-300": {
|
|
315
|
-
"sets": {
|
|
316
|
-
"desktop": {
|
|
317
|
-
"value": "48px"
|
|
318
|
-
},
|
|
319
|
-
"mobile": {
|
|
320
|
-
"value": "60px"
|
|
321
|
-
}
|
|
322
|
-
}
|
|
323
|
-
},
|
|
274
|
+
|
|
324
275
|
"component-height-50": {
|
|
325
276
|
"sets": {
|
|
326
277
|
"desktop": {
|
|
@@ -522,6 +473,27 @@
|
|
|
522
473
|
}
|
|
523
474
|
},
|
|
524
475
|
|
|
476
|
+
"action-bar-height": {
|
|
477
|
+
"sets": {
|
|
478
|
+
"desktop": {
|
|
479
|
+
"value": "48px"
|
|
480
|
+
},
|
|
481
|
+
"mobile": {
|
|
482
|
+
"value": "56px"
|
|
483
|
+
}
|
|
484
|
+
}
|
|
485
|
+
},
|
|
486
|
+
"action-bar-top-to-item-counter":{
|
|
487
|
+
"sets": {
|
|
488
|
+
"desktop": {
|
|
489
|
+
"value": "14px"
|
|
490
|
+
},
|
|
491
|
+
"mobile": {
|
|
492
|
+
"value": "16px"
|
|
493
|
+
}
|
|
494
|
+
}
|
|
495
|
+
},
|
|
496
|
+
|
|
525
497
|
"action-button-edge-to-hold-icon-small": {
|
|
526
498
|
"sets": {
|
|
527
499
|
"desktop": {
|