@primer/primitives 8.2.3 → 8.2.4-rc.20f0592f
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/dist/css/functional/themes/dark-colorblind.css +48 -48
- package/dist/css/functional/themes/dark-dimmed.css +50 -50
- package/dist/css/functional/themes/dark-high-contrast.css +50 -50
- package/dist/css/functional/themes/dark-tritanopia.css +50 -50
- package/dist/css/functional/themes/dark.css +50 -50
- package/dist/css/functional/themes/light-colorblind.css +22 -22
- package/dist/css/functional/themes/light-high-contrast.css +10 -10
- package/dist/css/functional/themes/light-tritanopia.css +22 -22
- package/dist/css/functional/themes/light.css +10 -10
- package/dist/docs/functional/themes/dark-colorblind.json +202 -202
- package/dist/docs/functional/themes/dark-dimmed.json +212 -210
- package/dist/docs/functional/themes/dark-high-contrast.json +212 -210
- package/dist/docs/functional/themes/dark-tritanopia.json +206 -206
- package/dist/docs/functional/themes/dark.json +212 -210
- package/dist/docs/functional/themes/light-colorblind.json +187 -193
- package/dist/docs/functional/themes/light-high-contrast.json +185 -183
- package/dist/docs/functional/themes/light-tritanopia.json +187 -193
- package/dist/docs/functional/themes/light.json +180 -178
- package/dist/figma/themes/dark-colorblind.json +231 -231
- package/dist/figma/themes/dark-dimmed.json +215 -214
- package/dist/figma/themes/dark-high-contrast.json +215 -214
- package/dist/figma/themes/dark-tritanopia.json +233 -233
- package/dist/figma/themes/dark.json +215 -214
- package/dist/figma/themes/light-colorblind.json +213 -214
- package/dist/figma/themes/light-high-contrast.json +135 -134
- package/dist/figma/themes/light-tritanopia.json +212 -213
- package/dist/figma/themes/light.json +135 -134
- package/dist/internalCss/dark-colorblind.css +48 -48
- package/dist/internalCss/dark-dimmed.css +50 -50
- package/dist/internalCss/dark-high-contrast.css +50 -50
- package/dist/internalCss/dark-tritanopia.css +50 -50
- package/dist/internalCss/dark.css +50 -50
- package/dist/internalCss/light-colorblind.css +22 -22
- package/dist/internalCss/light-high-contrast.css +10 -10
- package/dist/internalCss/light-tritanopia.css +22 -22
- package/dist/internalCss/light.css +10 -10
- package/dist/styleLint/functional/themes/dark-colorblind.json +202 -202
- package/dist/styleLint/functional/themes/dark-dimmed.json +212 -210
- package/dist/styleLint/functional/themes/dark-high-contrast.json +212 -210
- package/dist/styleLint/functional/themes/dark-tritanopia.json +206 -206
- package/dist/styleLint/functional/themes/dark.json +212 -210
- package/dist/styleLint/functional/themes/light-colorblind.json +187 -193
- package/dist/styleLint/functional/themes/light-high-contrast.json +185 -183
- package/dist/styleLint/functional/themes/light-tritanopia.json +187 -193
- package/dist/styleLint/functional/themes/light.json +180 -178
- package/package.json +1 -1
- package/src/tokens/functional/color/dark/display-dark.json5 +19 -19
- package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +7 -0
- package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +8 -16
- package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +13 -17
- package/src/tokens/functional/color/dark/patterns-dark.json5 +10 -10
- package/src/tokens/functional/color/dark/primitives-dark.json5 +174 -197
- package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +11 -8
- package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +14 -25
- package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +11 -22
- package/src/tokens/functional/color/light/patterns-light.json5 +12 -12
- package/src/tokens/functional/color/light/primitives-light.json5 +173 -196
|
@@ -86,206 +86,182 @@
|
|
|
86
86
|
},
|
|
87
87
|
},
|
|
88
88
|
link: {
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
'
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
web: 'var(--fgColor-link) /* utility class: .color-fg-accent */',
|
|
100
|
-
},
|
|
89
|
+
$value: '{fgColor.accent}',
|
|
90
|
+
$type: 'color',
|
|
91
|
+
$extensions: {
|
|
92
|
+
'org.primer.figma': {
|
|
93
|
+
collection: 'mode',
|
|
94
|
+
mode: 'light',
|
|
95
|
+
group: 'semantic',
|
|
96
|
+
scopes: ['fgColor'],
|
|
97
|
+
codeSyntax: {
|
|
98
|
+
web: 'var(--fgColor-link) /* utility class: .color-fg-accent */',
|
|
101
99
|
},
|
|
102
100
|
},
|
|
103
101
|
},
|
|
104
102
|
},
|
|
105
103
|
neutral: {
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
'
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
scopes: ['fgColor'],
|
|
115
|
-
},
|
|
104
|
+
$value: '{base.color.neutral.5}',
|
|
105
|
+
$type: 'color',
|
|
106
|
+
$extensions: {
|
|
107
|
+
'org.primer.figma': {
|
|
108
|
+
collection: 'mode',
|
|
109
|
+
mode: 'light',
|
|
110
|
+
group: 'semantic',
|
|
111
|
+
scopes: ['fgColor'],
|
|
116
112
|
},
|
|
117
113
|
},
|
|
118
114
|
},
|
|
119
115
|
accent: {
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
'
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
web: 'var(--fgColor-accent) /* utility class: .color-fg-accent */',
|
|
131
|
-
},
|
|
116
|
+
$value: '{base.color.blue.5}',
|
|
117
|
+
$type: 'color',
|
|
118
|
+
$extensions: {
|
|
119
|
+
'org.primer.figma': {
|
|
120
|
+
collection: 'mode',
|
|
121
|
+
mode: 'light',
|
|
122
|
+
group: 'semantic',
|
|
123
|
+
scopes: ['fgColor'],
|
|
124
|
+
codeSyntax: {
|
|
125
|
+
web: 'var(--fgColor-accent) /* utility class: .color-fg-accent */',
|
|
132
126
|
},
|
|
133
127
|
},
|
|
134
128
|
},
|
|
135
129
|
},
|
|
136
130
|
success: {
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
'
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
web: 'var(--fgColor-success) /* utility class: .color-fg-success */',
|
|
148
|
-
},
|
|
131
|
+
$value: '{base.color.green.5}',
|
|
132
|
+
$type: 'color',
|
|
133
|
+
$extensions: {
|
|
134
|
+
'org.primer.figma': {
|
|
135
|
+
collection: 'mode',
|
|
136
|
+
mode: 'light',
|
|
137
|
+
group: 'semantic',
|
|
138
|
+
scopes: ['fgColor'],
|
|
139
|
+
codeSyntax: {
|
|
140
|
+
web: 'var(--fgColor-success) /* utility class: .color-fg-success */',
|
|
149
141
|
},
|
|
150
142
|
},
|
|
151
143
|
},
|
|
152
144
|
},
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
'
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
web: 'var(--fgColor-attention) /* utility class: .color-fg-attention */',
|
|
165
|
-
},
|
|
145
|
+
open: {
|
|
146
|
+
$value: '{fgColor.success}',
|
|
147
|
+
$type: 'color',
|
|
148
|
+
$extensions: {
|
|
149
|
+
'org.primer.figma': {
|
|
150
|
+
collection: 'mode',
|
|
151
|
+
mode: 'light',
|
|
152
|
+
group: 'semantic',
|
|
153
|
+
scopes: ['fgColor'],
|
|
154
|
+
codeSyntax: {
|
|
155
|
+
web: 'var(--fgColor-open) /* utility class: .color-fg-open */',
|
|
166
156
|
},
|
|
167
157
|
},
|
|
168
158
|
},
|
|
169
159
|
},
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
'
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
web: 'var(--fgColor-severe) /* utility class: .color-fg-severe */',
|
|
182
|
-
},
|
|
160
|
+
attention: {
|
|
161
|
+
$value: '{base.color.yellow.5}',
|
|
162
|
+
$type: 'color',
|
|
163
|
+
$extensions: {
|
|
164
|
+
'org.primer.figma': {
|
|
165
|
+
collection: 'mode',
|
|
166
|
+
mode: 'light',
|
|
167
|
+
group: 'semantic',
|
|
168
|
+
scopes: ['fgColor'],
|
|
169
|
+
codeSyntax: {
|
|
170
|
+
web: 'var(--fgColor-attention) /* utility class: .color-fg-attention */',
|
|
183
171
|
},
|
|
184
172
|
},
|
|
185
173
|
},
|
|
186
174
|
},
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
'
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
web: 'var(--fgColor-danger) /* utility class: .color-fg-danger */',
|
|
199
|
-
},
|
|
175
|
+
severe: {
|
|
176
|
+
$value: '{base.color.orange.5}',
|
|
177
|
+
$type: 'color',
|
|
178
|
+
$extensions: {
|
|
179
|
+
'org.primer.figma': {
|
|
180
|
+
collection: 'mode',
|
|
181
|
+
mode: 'light',
|
|
182
|
+
group: 'semantic',
|
|
183
|
+
scopes: ['fgColor'],
|
|
184
|
+
codeSyntax: {
|
|
185
|
+
web: 'var(--fgColor-severe) /* utility class: .color-fg-severe */',
|
|
200
186
|
},
|
|
201
187
|
},
|
|
202
|
-
mix: {
|
|
203
|
-
color: '{base.color.red.4}',
|
|
204
|
-
weight: 0.05,
|
|
205
|
-
},
|
|
206
188
|
},
|
|
207
189
|
},
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
'
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
web: 'var(--fgColor-open) /* utility class: .color-fg-open */',
|
|
220
|
-
},
|
|
190
|
+
danger: {
|
|
191
|
+
$value: '{base.color.red.5}',
|
|
192
|
+
$type: 'color',
|
|
193
|
+
$extensions: {
|
|
194
|
+
'org.primer.figma': {
|
|
195
|
+
collection: 'mode',
|
|
196
|
+
mode: 'light',
|
|
197
|
+
group: 'semantic',
|
|
198
|
+
scopes: ['fgColor'],
|
|
199
|
+
codeSyntax: {
|
|
200
|
+
web: 'var(--fgColor-danger) /* utility class: .color-fg-danger */',
|
|
221
201
|
},
|
|
222
202
|
},
|
|
223
203
|
},
|
|
204
|
+
mix: {
|
|
205
|
+
color: '{base.color.red.4}',
|
|
206
|
+
weight: 0.05,
|
|
207
|
+
},
|
|
224
208
|
},
|
|
225
209
|
closed: {
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
'
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
web: 'var(--fgColor-closed) /* utility class: .color-fg-closed */',
|
|
237
|
-
},
|
|
210
|
+
$value: '{fgColor.danger}',
|
|
211
|
+
$type: 'color',
|
|
212
|
+
$extensions: {
|
|
213
|
+
'org.primer.figma': {
|
|
214
|
+
collection: 'mode',
|
|
215
|
+
mode: 'light',
|
|
216
|
+
group: 'semantic',
|
|
217
|
+
scopes: ['fgColor'],
|
|
218
|
+
codeSyntax: {
|
|
219
|
+
web: 'var(--fgColor-closed) /* utility class: .color-fg-closed */',
|
|
238
220
|
},
|
|
239
221
|
},
|
|
240
222
|
},
|
|
241
223
|
},
|
|
242
224
|
done: {
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
'
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
web: 'var(--fgColor-done) /* utility class: .color-fg-done */',
|
|
254
|
-
},
|
|
225
|
+
$value: '{base.color.purple.5}',
|
|
226
|
+
$type: 'color',
|
|
227
|
+
$extensions: {
|
|
228
|
+
'org.primer.figma': {
|
|
229
|
+
collection: 'mode',
|
|
230
|
+
mode: 'light',
|
|
231
|
+
group: 'semantic',
|
|
232
|
+
scopes: ['fgColor'],
|
|
233
|
+
codeSyntax: {
|
|
234
|
+
web: 'var(--fgColor-done) /* utility class: .color-fg-done */',
|
|
255
235
|
},
|
|
256
236
|
},
|
|
257
237
|
},
|
|
258
238
|
},
|
|
259
239
|
upsell: {
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
'
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
web: 'var(--fgColor-upsell)',
|
|
271
|
-
},
|
|
240
|
+
$value: '{fgColor.done}',
|
|
241
|
+
$type: 'color',
|
|
242
|
+
$extensions: {
|
|
243
|
+
'org.primer.figma': {
|
|
244
|
+
collection: 'mode',
|
|
245
|
+
mode: 'light',
|
|
246
|
+
group: 'semantic',
|
|
247
|
+
scopes: ['fgColor'],
|
|
248
|
+
codeSyntax: {
|
|
249
|
+
web: 'var(--fgColor-upsell)',
|
|
272
250
|
},
|
|
273
251
|
},
|
|
274
252
|
},
|
|
275
253
|
},
|
|
276
254
|
sponsors: {
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
'
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
web: 'var(--fgColor-sponsors) /* utility class: .color-fg-sponsors */',
|
|
288
|
-
},
|
|
255
|
+
$value: '{base.color.pink.5}',
|
|
256
|
+
$type: 'color',
|
|
257
|
+
$extensions: {
|
|
258
|
+
'org.primer.figma': {
|
|
259
|
+
collection: 'mode',
|
|
260
|
+
mode: 'light',
|
|
261
|
+
group: 'semantic',
|
|
262
|
+
scopes: ['fgColor'],
|
|
263
|
+
codeSyntax: {
|
|
264
|
+
web: 'var(--fgColor-sponsors) /* utility class: .color-fg-sponsors */',
|
|
289
265
|
},
|
|
290
266
|
},
|
|
291
267
|
},
|
|
@@ -511,9 +487,9 @@
|
|
|
511
487
|
},
|
|
512
488
|
},
|
|
513
489
|
},
|
|
514
|
-
|
|
490
|
+
open: {
|
|
515
491
|
muted: {
|
|
516
|
-
$value: '{
|
|
492
|
+
$value: '{bgColor.success.muted}',
|
|
517
493
|
$type: 'color',
|
|
518
494
|
$extensions: {
|
|
519
495
|
'org.primer.figma': {
|
|
@@ -522,13 +498,13 @@
|
|
|
522
498
|
group: 'semantic',
|
|
523
499
|
scopes: ['bgColor'],
|
|
524
500
|
codeSyntax: {
|
|
525
|
-
web: 'var(--bgColor-
|
|
501
|
+
web: 'var(--bgColor-success-muted) /* utility class: .color-bg-success */',
|
|
526
502
|
},
|
|
527
503
|
},
|
|
528
504
|
},
|
|
529
505
|
},
|
|
530
506
|
emphasis: {
|
|
531
|
-
$value: '{
|
|
507
|
+
$value: '{bgColor.success.emphasis}',
|
|
532
508
|
$type: 'color',
|
|
533
509
|
$extensions: {
|
|
534
510
|
'org.primer.figma': {
|
|
@@ -537,15 +513,15 @@
|
|
|
537
513
|
group: 'semantic',
|
|
538
514
|
scopes: ['bgColor'],
|
|
539
515
|
codeSyntax: {
|
|
540
|
-
web: 'var(--bgColor-
|
|
516
|
+
web: 'var(--bgColor-success-emphasis) /* utility class: .color-bg-success-emphasis */',
|
|
541
517
|
},
|
|
542
518
|
},
|
|
543
519
|
},
|
|
544
520
|
},
|
|
545
521
|
},
|
|
546
|
-
|
|
522
|
+
attention: {
|
|
547
523
|
muted: {
|
|
548
|
-
$value: '{base.color.
|
|
524
|
+
$value: '{base.color.yellow.0}',
|
|
549
525
|
$type: 'color',
|
|
550
526
|
$extensions: {
|
|
551
527
|
'org.primer.figma': {
|
|
@@ -554,13 +530,13 @@
|
|
|
554
530
|
group: 'semantic',
|
|
555
531
|
scopes: ['bgColor'],
|
|
556
532
|
codeSyntax: {
|
|
557
|
-
web: 'var(--bgColor-
|
|
533
|
+
web: 'var(--bgColor-attention-muted) /* utility class: .color-bg-attention */',
|
|
558
534
|
},
|
|
559
535
|
},
|
|
560
536
|
},
|
|
561
537
|
},
|
|
562
538
|
emphasis: {
|
|
563
|
-
$value: '{base.color.
|
|
539
|
+
$value: '{base.color.yellow.5}',
|
|
564
540
|
$type: 'color',
|
|
565
541
|
$extensions: {
|
|
566
542
|
'org.primer.figma': {
|
|
@@ -569,15 +545,15 @@
|
|
|
569
545
|
group: 'semantic',
|
|
570
546
|
scopes: ['bgColor'],
|
|
571
547
|
codeSyntax: {
|
|
572
|
-
web: 'var(--bgColor-
|
|
548
|
+
web: 'var(--bgColor-attention-emphasis) /* utility class: .color-bg-attention-emphasis */',
|
|
573
549
|
},
|
|
574
550
|
},
|
|
575
551
|
},
|
|
576
552
|
},
|
|
577
553
|
},
|
|
578
|
-
|
|
554
|
+
severe: {
|
|
579
555
|
muted: {
|
|
580
|
-
$value: '{base.color.
|
|
556
|
+
$value: '{base.color.orange.0}',
|
|
581
557
|
$type: 'color',
|
|
582
558
|
$extensions: {
|
|
583
559
|
'org.primer.figma': {
|
|
@@ -586,13 +562,13 @@
|
|
|
586
562
|
group: 'semantic',
|
|
587
563
|
scopes: ['bgColor'],
|
|
588
564
|
codeSyntax: {
|
|
589
|
-
web: 'var(--bgColor-
|
|
565
|
+
web: 'var(--bgColor-severe-muted) /* utility class: .color-bg-severe */',
|
|
590
566
|
},
|
|
591
567
|
},
|
|
592
568
|
},
|
|
593
569
|
},
|
|
594
570
|
emphasis: {
|
|
595
|
-
$value: '{base.color.
|
|
571
|
+
$value: '{base.color.orange.5}',
|
|
596
572
|
$type: 'color',
|
|
597
573
|
$extensions: {
|
|
598
574
|
'org.primer.figma': {
|
|
@@ -601,15 +577,15 @@
|
|
|
601
577
|
group: 'semantic',
|
|
602
578
|
scopes: ['bgColor'],
|
|
603
579
|
codeSyntax: {
|
|
604
|
-
web: 'var(--bgColor-
|
|
580
|
+
web: 'var(--bgColor-severe-emphasis) /* utility class: .color-bg-severe-emphasis */',
|
|
605
581
|
},
|
|
606
582
|
},
|
|
607
583
|
},
|
|
608
584
|
},
|
|
609
585
|
},
|
|
610
|
-
|
|
586
|
+
danger: {
|
|
611
587
|
muted: {
|
|
612
|
-
$value: '{
|
|
588
|
+
$value: '{base.color.red.0}',
|
|
613
589
|
$type: 'color',
|
|
614
590
|
$extensions: {
|
|
615
591
|
'org.primer.figma': {
|
|
@@ -618,13 +594,13 @@
|
|
|
618
594
|
group: 'semantic',
|
|
619
595
|
scopes: ['bgColor'],
|
|
620
596
|
codeSyntax: {
|
|
621
|
-
web: 'var(--bgColor-
|
|
597
|
+
web: 'var(--bgColor-danger-muted) /* utility class: .color-bg-danger */',
|
|
622
598
|
},
|
|
623
599
|
},
|
|
624
600
|
},
|
|
625
601
|
},
|
|
626
602
|
emphasis: {
|
|
627
|
-
$value: '{
|
|
603
|
+
$value: '{base.color.red.5}',
|
|
628
604
|
$type: 'color',
|
|
629
605
|
$extensions: {
|
|
630
606
|
'org.primer.figma': {
|
|
@@ -633,7 +609,7 @@
|
|
|
633
609
|
group: 'semantic',
|
|
634
610
|
scopes: ['bgColor'],
|
|
635
611
|
codeSyntax: {
|
|
636
|
-
web: 'var(--bgColor-
|
|
612
|
+
web: 'var(--bgColor-danger-emphasis) /* utility class: .color-bg-danger-emphasis */',
|
|
637
613
|
},
|
|
638
614
|
},
|
|
639
615
|
},
|
|
@@ -641,7 +617,7 @@
|
|
|
641
617
|
},
|
|
642
618
|
closed: {
|
|
643
619
|
muted: {
|
|
644
|
-
$value: '{
|
|
620
|
+
$value: '{bgColor.danger.muted}',
|
|
645
621
|
$type: 'color',
|
|
646
622
|
$extensions: {
|
|
647
623
|
'org.primer.figma': {
|
|
@@ -656,7 +632,7 @@
|
|
|
656
632
|
},
|
|
657
633
|
},
|
|
658
634
|
emphasis: {
|
|
659
|
-
$value: '{
|
|
635
|
+
$value: '{bgColor.danger.emphasis}',
|
|
660
636
|
$type: 'color',
|
|
661
637
|
$extensions: {
|
|
662
638
|
'org.primer.figma': {
|
|
@@ -705,7 +681,7 @@
|
|
|
705
681
|
},
|
|
706
682
|
upsell: {
|
|
707
683
|
muted: {
|
|
708
|
-
$value: '{
|
|
684
|
+
$value: '{bgColor.done.muted}',
|
|
709
685
|
$type: 'color',
|
|
710
686
|
$extensions: {
|
|
711
687
|
'org.primer.figma': {
|
|
@@ -720,7 +696,7 @@
|
|
|
720
696
|
},
|
|
721
697
|
},
|
|
722
698
|
emphasis: {
|
|
723
|
-
$value: '{
|
|
699
|
+
$value: '{bgColor.done.emphasis}',
|
|
724
700
|
$type: 'color',
|
|
725
701
|
$extensions: {
|
|
726
702
|
'org.primer.figma': {
|
|
@@ -942,9 +918,9 @@
|
|
|
942
918
|
},
|
|
943
919
|
},
|
|
944
920
|
},
|
|
945
|
-
|
|
921
|
+
open: {
|
|
946
922
|
muted: {
|
|
947
|
-
$value: '{
|
|
923
|
+
$value: '{borderColor.success.muted}',
|
|
948
924
|
$type: 'color',
|
|
949
925
|
$extensions: {
|
|
950
926
|
'org.primer.figma': {
|
|
@@ -953,14 +929,14 @@
|
|
|
953
929
|
group: 'semantic',
|
|
954
930
|
scopes: ['borderColor'],
|
|
955
931
|
codeSyntax: {
|
|
956
|
-
web: 'var(--borderColor-
|
|
932
|
+
web: 'var(--borderColor-open-muted) /* utility class: .color-border-open */',
|
|
957
933
|
},
|
|
958
934
|
},
|
|
959
935
|
},
|
|
960
936
|
alpha: 0.4,
|
|
961
937
|
},
|
|
962
938
|
emphasis: {
|
|
963
|
-
$value: '{
|
|
939
|
+
$value: '{borderColor.success.emphasis}',
|
|
964
940
|
$type: 'color',
|
|
965
941
|
$extensions: {
|
|
966
942
|
'org.primer.figma': {
|
|
@@ -969,15 +945,15 @@
|
|
|
969
945
|
group: 'semantic',
|
|
970
946
|
scopes: ['borderColor'],
|
|
971
947
|
codeSyntax: {
|
|
972
|
-
web: 'var(--borderColor-
|
|
948
|
+
web: 'var(--borderColor-open-emphasis) /* utility class: .color-border-open-emphasis */',
|
|
973
949
|
},
|
|
974
950
|
},
|
|
975
951
|
},
|
|
976
952
|
},
|
|
977
953
|
},
|
|
978
|
-
|
|
954
|
+
attention: {
|
|
979
955
|
muted: {
|
|
980
|
-
$value: '{base.color.
|
|
956
|
+
$value: '{base.color.yellow.3}',
|
|
981
957
|
$type: 'color',
|
|
982
958
|
$extensions: {
|
|
983
959
|
'org.primer.figma': {
|
|
@@ -986,14 +962,14 @@
|
|
|
986
962
|
group: 'semantic',
|
|
987
963
|
scopes: ['borderColor'],
|
|
988
964
|
codeSyntax: {
|
|
989
|
-
web: 'var(--borderColor-
|
|
965
|
+
web: 'var(--borderColor-attention-muted) /* utility class: .color-border-attention */',
|
|
990
966
|
},
|
|
991
967
|
},
|
|
992
968
|
},
|
|
993
969
|
alpha: 0.4,
|
|
994
970
|
},
|
|
995
971
|
emphasis: {
|
|
996
|
-
$value: '{base.color.
|
|
972
|
+
$value: '{base.color.yellow.4}',
|
|
997
973
|
$type: 'color',
|
|
998
974
|
$extensions: {
|
|
999
975
|
'org.primer.figma': {
|
|
@@ -1002,15 +978,15 @@
|
|
|
1002
978
|
group: 'semantic',
|
|
1003
979
|
scopes: ['borderColor'],
|
|
1004
980
|
codeSyntax: {
|
|
1005
|
-
web: 'var(--borderColor-
|
|
981
|
+
web: 'var(--borderColor-attention-emphasis) /* utility class: .color-border-attention-emphasis */',
|
|
1006
982
|
},
|
|
1007
983
|
},
|
|
1008
984
|
},
|
|
1009
985
|
},
|
|
1010
986
|
},
|
|
1011
|
-
|
|
987
|
+
severe: {
|
|
1012
988
|
muted: {
|
|
1013
|
-
$value: '{base.color.
|
|
989
|
+
$value: '{base.color.orange.3}',
|
|
1014
990
|
$type: 'color',
|
|
1015
991
|
$extensions: {
|
|
1016
992
|
'org.primer.figma': {
|
|
@@ -1019,14 +995,14 @@
|
|
|
1019
995
|
group: 'semantic',
|
|
1020
996
|
scopes: ['borderColor'],
|
|
1021
997
|
codeSyntax: {
|
|
1022
|
-
web: 'var(--borderColor-
|
|
998
|
+
web: 'var(--borderColor-severe-muted) /* utility class: .color-border-severe */',
|
|
1023
999
|
},
|
|
1024
1000
|
},
|
|
1025
1001
|
},
|
|
1026
1002
|
alpha: 0.4,
|
|
1027
1003
|
},
|
|
1028
1004
|
emphasis: {
|
|
1029
|
-
$value: '{base.color.
|
|
1005
|
+
$value: '{base.color.orange.5}',
|
|
1030
1006
|
$type: 'color',
|
|
1031
1007
|
$extensions: {
|
|
1032
1008
|
'org.primer.figma': {
|
|
@@ -1035,15 +1011,15 @@
|
|
|
1035
1011
|
group: 'semantic',
|
|
1036
1012
|
scopes: ['borderColor'],
|
|
1037
1013
|
codeSyntax: {
|
|
1038
|
-
web: 'var(--borderColor-
|
|
1014
|
+
web: 'var(--borderColor-severe-emphasis) /* utility class: .color-border-severe-emphasis */',
|
|
1039
1015
|
},
|
|
1040
1016
|
},
|
|
1041
1017
|
},
|
|
1042
1018
|
},
|
|
1043
1019
|
},
|
|
1044
|
-
|
|
1020
|
+
danger: {
|
|
1045
1021
|
muted: {
|
|
1046
|
-
$value: '{
|
|
1022
|
+
$value: '{base.color.red.3}',
|
|
1047
1023
|
$type: 'color',
|
|
1048
1024
|
$extensions: {
|
|
1049
1025
|
'org.primer.figma': {
|
|
@@ -1052,13 +1028,14 @@
|
|
|
1052
1028
|
group: 'semantic',
|
|
1053
1029
|
scopes: ['borderColor'],
|
|
1054
1030
|
codeSyntax: {
|
|
1055
|
-
web: 'var(--borderColor-
|
|
1031
|
+
web: 'var(--borderColor-danger-muted) /* utility class: .color-border-danger */',
|
|
1056
1032
|
},
|
|
1057
1033
|
},
|
|
1058
1034
|
},
|
|
1035
|
+
alpha: 0.4,
|
|
1059
1036
|
},
|
|
1060
1037
|
emphasis: {
|
|
1061
|
-
$value: '{
|
|
1038
|
+
$value: '{base.color.red.5}',
|
|
1062
1039
|
$type: 'color',
|
|
1063
1040
|
$extensions: {
|
|
1064
1041
|
'org.primer.figma': {
|
|
@@ -1067,7 +1044,7 @@
|
|
|
1067
1044
|
group: 'semantic',
|
|
1068
1045
|
scopes: ['borderColor'],
|
|
1069
1046
|
codeSyntax: {
|
|
1070
|
-
web: 'var(--borderColor-
|
|
1047
|
+
web: 'var(--borderColor-danger-emphasis) /* utility class: .color-border-danger-emphasis */',
|
|
1071
1048
|
},
|
|
1072
1049
|
},
|
|
1073
1050
|
},
|
|
@@ -1141,7 +1118,7 @@
|
|
|
1141
1118
|
},
|
|
1142
1119
|
upsell: {
|
|
1143
1120
|
muted: {
|
|
1144
|
-
$value: '{
|
|
1121
|
+
$value: '{borderColor.done.muted}',
|
|
1145
1122
|
$type: 'color',
|
|
1146
1123
|
$extensions: {
|
|
1147
1124
|
'org.primer.figma': {
|
|
@@ -1157,7 +1134,7 @@
|
|
|
1157
1134
|
alpha: 0.4,
|
|
1158
1135
|
},
|
|
1159
1136
|
emphasis: {
|
|
1160
|
-
$value: '{
|
|
1137
|
+
$value: '{borderColor.done.emphasis}',
|
|
1161
1138
|
$type: 'color',
|
|
1162
1139
|
$extensions: {
|
|
1163
1140
|
'org.primer.figma': {
|