@adobe/spectrum-tokens 13.0.0-beta.7 → 13.0.0-beta.8

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 CHANGED
@@ -1,5 +1,26 @@
1
1
  # @adobe/spectrum-tokens
2
2
 
3
+ ## 13.0.0-beta.8
4
+
5
+ ### Minor Changes
6
+
7
+ - 507f3c2: Added new and updating existing background layer tokens to S2 set in Tokens Studio and S2/Variables. Also reordered token organization to reflect proper usage based on [S2 guidelines](https://s2.spectrum.corp.adobe.com/page/background-layers/#editing-contexts).
8
+
9
+ ## Design Motivation
10
+
11
+ In Spectrum 2, background layers are used differently depending on the primary context of the page. We now have a full set of tokens to help users distinguish between primary purposes, editing vs browsing.
12
+
13
+ ## Token Diff
14
+
15
+ _Tokens added (2):_
16
+
17
+ - `background-elevated-color`
18
+ - `background-pasteboard-color`
19
+
20
+ _Token values updated (1):_
21
+
22
+ - `background-base-color`
23
+
3
24
  ## 13.0.0-beta.7
4
25
 
5
26
  ### Minor Changes
@@ -38,9 +38,11 @@
38
38
  "accent-content-color-key-focus": "rgb(39, 77, 234)",
39
39
  "accent-content-color-selected": "rgb(39, 77, 234)",
40
40
  "accent-visual-color": "rgb(75, 117, 255)",
41
- "background-base-color": "rgb(233, 233, 233)",
41
+ "background-base-color": "rgb(255, 255, 255)",
42
+ "background-elevated-color": "rgb(255, 255, 255)",
42
43
  "background-layer-1-color": "rgb(248, 248, 248)",
43
44
  "background-layer-2-color": "rgb(255, 255, 255)",
45
+ "background-pasteboard-color": "rgb(233, 233, 233)",
44
46
  "black": "rgb(0, 0, 0)",
45
47
  "blue-100": "rgb(245, 249, 255)",
46
48
  "blue-1000": "rgb(39, 77, 234)",
@@ -588,8 +590,10 @@
588
590
  "accent-content-color-selected": "rgb(105, 149, 254)",
589
591
  "accent-visual-color": "rgb(86, 129, 255)",
590
592
  "background-base-color": "rgb(17, 17, 17)",
593
+ "background-elevated-color": "rgb(34, 34, 34)",
591
594
  "background-layer-1-color": "rgb(27, 27, 27)",
592
595
  "background-layer-2-color": "rgb(34, 34, 34)",
596
+ "background-pasteboard-color": "rgb(17, 17, 17)",
593
597
  "black": "rgb(0, 0, 0)",
594
598
  "blue-100": "rgb(14, 23, 63)",
595
599
  "blue-1000": "rgb(105, 149, 254)",
@@ -71,19 +71,19 @@
71
71
  "background-base-color": {
72
72
  "sets": {
73
73
  "light": {
74
- "ref": "{gray-100}",
74
+ "ref": "{gray-25}",
75
75
  "sets": {
76
- "light": {
77
- "value": "rgb(233, 233, 233)",
78
- "uuid": "64e2dbc2-05fa-43d7-80ae-d4d11c55348f"
79
- },
80
76
  "dark": {
81
- "value": "rgb(44, 44, 44)",
82
- "uuid": "abd011c4-87a5-4b1f-82e2-e94d118f417f"
77
+ "value": "rgb(17, 17, 17)",
78
+ "uuid": "ac61b090-d356-4f7f-ac6d-b4f20617c9e3"
79
+ },
80
+ "light": {
81
+ "value": "rgb(255, 255, 255)",
82
+ "uuid": "a8c6363c-5297-41e3-ad76-1b6d0d3a3cc9"
83
83
  },
84
84
  "wireframe": {
85
- "value": "rgb(244, 246, 252)",
86
- "uuid": "3605974e-8f93-4907-81b3-fb6ab55d03f8"
85
+ "value": "rgb(255, 255, 255)",
86
+ "uuid": "0906f3b2-74a9-4012-9e26-4d8f68f0eba9"
87
87
  }
88
88
  },
89
89
  "uuid": "e0d8739d-18dd-44bc-92ea-e443882a780b"
@@ -4144,6 +4144,122 @@
4144
4144
  },
4145
4145
  "uuid": "393cb93a-3d0a-4118-a2ee-451fdc871b0f"
4146
4146
  },
4147
+ "background-elevated-color": {
4148
+ "sets": {
4149
+ "dark": {
4150
+ "ref": "{gray-75}",
4151
+ "sets": {
4152
+ "light": {
4153
+ "value": "rgb(243, 243, 243)",
4154
+ "uuid": "01cd6c7e-f2eb-4b5d-9e2a-30940e1ab37b"
4155
+ },
4156
+ "dark": {
4157
+ "value": "rgb(34, 34, 34)",
4158
+ "uuid": "1666d544-ad1b-445a-9a57-d2277fb752eb"
4159
+ },
4160
+ "wireframe": {
4161
+ "value": "rgb(253, 253, 254)",
4162
+ "uuid": "4b6e738d-ac71-4d34-83eb-cd45e511b144"
4163
+ }
4164
+ },
4165
+ "uuid": "4c19885d-0411-43dc-8f4a-db81905728e6"
4166
+ },
4167
+ "light": {
4168
+ "ref": "{gray-25}",
4169
+ "sets": {
4170
+ "dark": {
4171
+ "value": "rgb(17, 17, 17)",
4172
+ "uuid": "ac61b090-d356-4f7f-ac6d-b4f20617c9e3"
4173
+ },
4174
+ "light": {
4175
+ "value": "rgb(255, 255, 255)",
4176
+ "uuid": "a8c6363c-5297-41e3-ad76-1b6d0d3a3cc9"
4177
+ },
4178
+ "wireframe": {
4179
+ "value": "rgb(255, 255, 255)",
4180
+ "uuid": "0906f3b2-74a9-4012-9e26-4d8f68f0eba9"
4181
+ }
4182
+ },
4183
+ "uuid": "2275e0fa-69a3-4542-9ec6-919e44035118"
4184
+ },
4185
+ "wireframe": {
4186
+ "ref": "{gray-25}",
4187
+ "sets": {
4188
+ "dark": {
4189
+ "value": "rgb(17, 17, 17)",
4190
+ "uuid": "ac61b090-d356-4f7f-ac6d-b4f20617c9e3"
4191
+ },
4192
+ "light": {
4193
+ "value": "rgb(255, 255, 255)",
4194
+ "uuid": "a8c6363c-5297-41e3-ad76-1b6d0d3a3cc9"
4195
+ },
4196
+ "wireframe": {
4197
+ "value": "rgb(255, 255, 255)",
4198
+ "uuid": "0906f3b2-74a9-4012-9e26-4d8f68f0eba9"
4199
+ }
4200
+ },
4201
+ "uuid": "d9cb27b8-5535-4e3a-8ca5-6eda69b934af"
4202
+ }
4203
+ }
4204
+ },
4205
+ "background-pasteboard-color": {
4206
+ "sets": {
4207
+ "dark": {
4208
+ "ref": "{gray-25}",
4209
+ "sets": {
4210
+ "dark": {
4211
+ "value": "rgb(17, 17, 17)",
4212
+ "uuid": "ac61b090-d356-4f7f-ac6d-b4f20617c9e3"
4213
+ },
4214
+ "light": {
4215
+ "value": "rgb(255, 255, 255)",
4216
+ "uuid": "a8c6363c-5297-41e3-ad76-1b6d0d3a3cc9"
4217
+ },
4218
+ "wireframe": {
4219
+ "value": "rgb(255, 255, 255)",
4220
+ "uuid": "0906f3b2-74a9-4012-9e26-4d8f68f0eba9"
4221
+ }
4222
+ },
4223
+ "uuid": "6a7c5092-c262-49b0-b5ec-5b8b4fa66d1e"
4224
+ },
4225
+ "light": {
4226
+ "ref": "{gray-100}",
4227
+ "sets": {
4228
+ "light": {
4229
+ "value": "rgb(233, 233, 233)",
4230
+ "uuid": "64e2dbc2-05fa-43d7-80ae-d4d11c55348f"
4231
+ },
4232
+ "dark": {
4233
+ "value": "rgb(44, 44, 44)",
4234
+ "uuid": "abd011c4-87a5-4b1f-82e2-e94d118f417f"
4235
+ },
4236
+ "wireframe": {
4237
+ "value": "rgb(244, 246, 252)",
4238
+ "uuid": "3605974e-8f93-4907-81b3-fb6ab55d03f8"
4239
+ }
4240
+ },
4241
+ "uuid": "4938710b-5a69-49eb-8517-6f5556c23298"
4242
+ },
4243
+ "wireframe": {
4244
+ "ref": "{gray-100}",
4245
+ "sets": {
4246
+ "light": {
4247
+ "value": "rgb(233, 233, 233)",
4248
+ "uuid": "64e2dbc2-05fa-43d7-80ae-d4d11c55348f"
4249
+ },
4250
+ "dark": {
4251
+ "value": "rgb(44, 44, 44)",
4252
+ "uuid": "abd011c4-87a5-4b1f-82e2-e94d118f417f"
4253
+ },
4254
+ "wireframe": {
4255
+ "value": "rgb(244, 246, 252)",
4256
+ "uuid": "3605974e-8f93-4907-81b3-fb6ab55d03f8"
4257
+ }
4258
+ },
4259
+ "uuid": "6a60aa01-d789-4d39-9867-2264e66d419c"
4260
+ }
4261
+ }
4262
+ },
4147
4263
  "swatch-border-color": {
4148
4264
  "ref": "{gray-900}",
4149
4265
  "sets": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adobe/spectrum-tokens",
3
- "version": "13.0.0-beta.7",
3
+ "version": "13.0.0-beta.8",
4
4
  "description": "Design tokens for Spectrum, Adobe's design system",
5
5
  "type": "module",
6
6
  "main": "tasks/buildSpectrumTokens.js",
@@ -68,8 +68,8 @@
68
68
  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json",
69
69
  "sets": {
70
70
  "light": {
71
+ "value": "{gray-25}",
71
72
  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
72
- "value": "{gray-100}",
73
73
  "uuid": "e0d8739d-18dd-44bc-92ea-e443882a780b"
74
74
  },
75
75
  "dark": {
@@ -1458,5 +1458,45 @@
1458
1458
  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
1459
1459
  "value": "{negative-color-1000}",
1460
1460
  "uuid": "393cb93a-3d0a-4118-a2ee-451fdc871b0f"
1461
+ },
1462
+ "background-elevated-color": {
1463
+ "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json",
1464
+ "sets": {
1465
+ "dark": {
1466
+ "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
1467
+ "value": "{gray-75}",
1468
+ "uuid": "4c19885d-0411-43dc-8f4a-db81905728e6"
1469
+ },
1470
+ "light": {
1471
+ "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
1472
+ "value": "{gray-25}",
1473
+ "uuid": "2275e0fa-69a3-4542-9ec6-919e44035118"
1474
+ },
1475
+ "wireframe": {
1476
+ "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
1477
+ "value": "{gray-25}",
1478
+ "uuid": "d9cb27b8-5535-4e3a-8ca5-6eda69b934af"
1479
+ }
1480
+ }
1481
+ },
1482
+ "background-pasteboard-color": {
1483
+ "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json",
1484
+ "sets": {
1485
+ "dark": {
1486
+ "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
1487
+ "value": "{gray-25}",
1488
+ "uuid": "6a7c5092-c262-49b0-b5ec-5b8b4fa66d1e"
1489
+ },
1490
+ "light": {
1491
+ "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
1492
+ "value": "{gray-100}",
1493
+ "uuid": "4938710b-5a69-49eb-8517-6f5556c23298"
1494
+ },
1495
+ "wireframe": {
1496
+ "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
1497
+ "value": "{gray-100}",
1498
+ "uuid": "6a60aa01-d789-4d39-9867-2264e66d419c"
1499
+ }
1500
+ }
1461
1501
  }
1462
1502
  }