@pantheon-systems/pds-design-tokens 1.0.0-dev.141 → 1.0.0-dev.142

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.
@@ -1,343 +1,521 @@
1
1
  /**
2
- *
2
+ *
3
3
  * Pantheon Systems
4
- *
4
+ *
5
5
  * !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
6
6
  * !! DO NOT EDIT THIS FILE DIRECTLY !!
7
7
  * !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
8
- *
8
+ *
9
9
  * This file has been generated automatically.
10
10
  */
11
11
 
12
12
  :root {
13
- --pds-color-background-brand-secondary: #dfd8f5;
14
- --pds-color-background-default: #ffffff;
15
- --pds-color-background-default-secondary: #f8f8f8;
16
- --pds-color-background-reverse: #23232d;
17
- --pds-color-badge-indicator-critical-background: #ca3521;
18
- --pds-color-badge-indicator-critical-foreground: #ffffff;
19
- --pds-color-badge-indicator-diamond-background: #cfe1fc;
20
- --pds-color-badge-indicator-diamond-foreground: #035ad3;
21
- --pds-color-badge-indicator-gold-background: #ffe668;
22
- --pds-color-badge-indicator-gold-foreground: #705e00;
23
- --pds-color-badge-indicator-info-background: #1d7afc;
24
- --pds-color-badge-indicator-info-foreground: #ffffff;
25
- --pds-color-badge-indicator-neutral-background: #6d6d78;
26
- --pds-color-badge-indicator-neutral-foreground: #ffffff;
27
- --pds-color-badge-indicator-platinum-background: #dfd8f5;
28
- --pds-color-badge-indicator-platinum-foreground: #3017a1;
29
- --pds-color-badge-indicator-silver-background: #cfcfd3;
30
- --pds-color-badge-indicator-silver-foreground: #23232d;
31
- --pds-color-badge-indicator-success-background: #218c5f;
32
- --pds-color-badge-indicator-success-foreground: #ffffff;
33
- --pds-color-badge-indicator-warning-background: #d97008;
34
- --pds-color-badge-indicator-warning-foreground: #ffffff;
35
- --pds-color-badge-status-dot-critical: var(--pds-color-semantic-critical-foreground);
36
- --pds-color-badge-status-dot-default: #cfcfd3;
37
- --pds-color-badge-status-dot-disabled: #cfcfd3;
38
- --pds-color-badge-status-dot-discovery: var(--pds-color-semantic-discovery-foreground);
39
- --pds-color-badge-status-dot-frozen: #dfd8f5;
40
- --pds-color-badge-status-dot-info: var(--pds-color-semantic-info-foreground);
41
- --pds-color-badge-status-dot-success: var(--pds-color-semantic-success-foreground);
42
- --pds-color-badge-status-dot-warning: var(--pds-color-semantic-warning-foreground);
43
- --pds-color-badge-status-neutral-background: var(--pds-color-background-default);
44
- --pds-color-badge-status-neutral-border: var(--pds-color-border-default);
45
- --pds-color-badge-status-neutral-label: var(--pds-color-text-default-secondary);
46
- --pds-color-badge-status-reverse-background: var(--pds-color-background-reverse);
47
- --pds-color-badge-status-reverse-border: var(--pds-color-background-reverse);
48
- --pds-color-badge-status-reverse-label: var(--pds-color-text-reverse);
49
- --pds-color-badge-status-transparent-background: rgba(0, 0, 0, 0);
50
- --pds-color-badge-status-transparent-border: var(--pds-color-border-default);
51
- --pds-color-badge-status-transparent-label: var(--pds-color-text-default-secondary);
52
- --pds-color-banner-critical-background: linear-gradient(135deg, #CA3521 0%, #B95898 100%);
53
- --pds-color-banner-critical-foreground: #ffffff;
54
- --pds-color-banner-info-background: linear-gradient(315deg, #1265DA 0%, #5F41E5 100%);
55
- --pds-color-banner-info-foreground: #ffffff;
56
- --pds-color-banner-warning-background: linear-gradient(135deg, #DDBD16 0%, #DB7612 100%);
57
- --pds-color-banner-warning-foreground: #23232d;
58
- --pds-color-border-default: rgba(0, 0, 0, 0.11);
59
- --pds-color-brand-accent-100: #ffe5f6;
60
- --pds-color-brand-accent-200: #ff99dc;
61
- --pds-color-brand-accent-300: #ff4cc3;
62
- --pds-color-brand-accent-400: #de0093;
63
- --pds-color-brand-accent-500: #9a0066;
64
- --pds-color-brand-accent-600: #560039;
65
- --pds-color-brand-accent-default: #de0093;
66
- --pds-color-brand-primary-100: #fffbe9;
67
- --pds-color-brand-primary-200: #fff1a9;
68
- --pds-color-brand-primary-300: #ffe668;
69
- --pds-color-brand-primary-400: #ffdc28;
70
- --pds-color-brand-primary-500: #ddbd16;
71
- --pds-color-brand-primary-600: #705e00;
72
- --pds-color-brand-primary-default: #ffdc28;
73
- --pds-color-brand-secondary-100: #f0edfb;
74
- --pds-color-brand-secondary-200: #dfd8f5;
75
- --pds-color-brand-secondary-300: #5e45cf;
76
- --pds-color-brand-secondary-400: #3017a1;
77
- --pds-color-brand-secondary-500: #200c7f;
78
- --pds-color-brand-secondary-default: #3017a1;
79
- --pds-color-breadcrumb-link: var(--pds-color-interactive-link-default);
80
- --pds-color-breadcrumb-separator: #cfcfd3;
81
- --pds-color-breadcrumb-text: var(--pds-color-text-default-secondary);
82
- --pds-color-button-brand-background-active: #ddbd16;
83
- --pds-color-button-brand-background-default: #ffdc28;
84
- --pds-color-button-brand-background-hover: #ffe668;
85
- --pds-color-button-brand-border-active: #ddbd16;
86
- --pds-color-button-brand-border-default: #ffdc28;
87
- --pds-color-button-brand-border-hover: #ffe668;
88
- --pds-color-button-brand-foreground-active: #23232d;
89
- --pds-color-button-brand-foreground-default: #23232d;
90
- --pds-color-button-brand-foreground-hover: #23232d;
91
- --pds-color-button-brand-secondary-background-active: #f1f1f1;
92
- --pds-color-button-brand-secondary-background-default: rgba(0, 0, 0, 0);
93
- --pds-color-button-brand-secondary-background-hover: #f8f8f8;
94
- --pds-color-button-brand-secondary-border-active: #23232d;
95
- --pds-color-button-brand-secondary-border-default: #6d6d78;
96
- --pds-color-button-brand-secondary-border-hover: #23232d;
97
- --pds-color-button-brand-secondary-foreground-active: #23232d;
98
- --pds-color-button-brand-secondary-foreground-default: #23232d;
99
- --pds-color-button-brand-secondary-foreground-hover: #23232d;
100
- --pds-color-button-critical-background-active: #ffdcd8;
101
- --pds-color-button-critical-background-default: var(--pds-color-background-default);
102
- --pds-color-button-critical-background-hover: var(--pds-color-semantic-critical-background);
103
- --pds-color-button-critical-border-active: #b52f1d;
104
- --pds-color-button-critical-border-default: var(--pds-color-semantic-critical-foreground);
105
- --pds-color-button-critical-border-hover: var(--pds-color-semantic-critical-foreground);
106
- --pds-color-button-critical-foreground-active: #b52f1d;
107
- --pds-color-button-critical-foreground-default: var(--pds-color-semantic-critical-foreground);
108
- --pds-color-button-critical-foreground-hover: var(--pds-color-semantic-critical-foreground);
109
- --pds-color-button-navbar-foreground-active: var(--pds-color-interactive-link-active);
110
- --pds-color-button-navbar-foreground-default: var(--pds-color-foreground-default);
111
- --pds-color-button-navbar-foreground-hover: var(--pds-color-interactive-link-hover);
112
- --pds-color-button-primary-background-active: #200c7f;
113
- --pds-color-button-primary-background-default: #3017a1;
114
- --pds-color-button-primary-background-hover: #5e45cf;
115
- --pds-color-button-primary-border-active: #200c7f;
116
- --pds-color-button-primary-border-default: #3017a1;
117
- --pds-color-button-primary-border-hover: #5e45cf;
118
- --pds-color-button-primary-foreground-active: #ffffff;
119
- --pds-color-button-primary-foreground-default: #ffffff;
120
- --pds-color-button-primary-foreground-hover: #ffffff;
121
- --pds-color-button-secondary-background-active: #dfd8f5;
122
- --pds-color-button-secondary-background-default: rgba(0, 0, 0, 0);
123
- --pds-color-button-secondary-background-hover: #f0edfb;
124
- --pds-color-button-secondary-border-active: #200c7f;
125
- --pds-color-button-secondary-border-default: #3017a1;
126
- --pds-color-button-secondary-border-hover: #5e45cf;
127
- --pds-color-button-secondary-foreground-active: #200c7f;
128
- --pds-color-button-secondary-foreground-default: #3017a1;
129
- --pds-color-button-secondary-foreground-hover: #3017a1;
130
- --pds-color-button-subtle-background-default: rgba(0, 0, 0, 0);
131
- --pds-color-button-subtle-border-default: rgba(0, 0, 0, 0);
132
- --pds-color-button-subtle-foreground-active: #200c7f;
133
- --pds-color-button-subtle-foreground-default: #3017a1;
134
- --pds-color-button-subtle-foreground-hover: #5e45cf;
135
- --pds-color-card-border: var(--pds-color-border-default);
136
- --pds-color-code-inline-background: #f0edfb;
137
- --pds-color-code-inline-border: #dfd8f5;
138
- --pds-color-code-inline-text: #000000;
139
- --pds-color-dashboard-nav-background: var(--pds-color-background-default-secondary);
140
- --pds-color-dashboard-nav-item-background-active: var(--pds-color-background-reverse);
141
- --pds-color-dashboard-nav-item-background-default: rgba(0, 0, 0, 0);
142
- --pds-color-dashboard-nav-item-background-hover: #e8e8e9;
143
- --pds-color-dashboard-nav-item-foreground-active: var(--pds-color-foreground-reverse);
144
- --pds-color-dashboard-nav-item-foreground-default: var(--pds-color-foreground-default);
145
- --pds-color-dashboard-nav-item-foreground-hover: var(--pds-color-foreground-default);
146
- --pds-color-dashboard-toggle-button-background: var(--pds-color-background-reverse);
147
- --pds-color-dashboard-toggle-button-foreground: var(--pds-color-foreground-reverse);
148
- --pds-color-expansion-panel-hover: #f1f1f1;
149
- --pds-color-expansion-panel-open: #f1f1f1;
150
- --pds-color-foreground-default: #23232d;
151
- --pds-color-foreground-reverse: #ffffff;
152
- --pds-color-gradient-after-hours: linear-gradient(228.64deg, #1B0874 41.87%, #29B2FF 100%);
153
- --pds-color-gradient-avatar-dawn: linear-gradient(315deg, #FFDC28 0%, #A2CFFF 100%);
154
- --pds-color-gradient-avatar-dragonfruit: linear-gradient(315deg, #D0C6FF 0%, #DE0093 100%);
155
- --pds-color-gradient-avatar-dusk: linear-gradient(315deg, #01EFFE 0%, #FF00C5 100%);
156
- --pds-color-gradient-avatar-earth: linear-gradient(315deg, #6BC5FC 0%, #218C5F 100%);
157
- --pds-color-gradient-avatar-fall: linear-gradient(135deg, #CC36C9 0%, #FFFF11 100%);
158
- --pds-color-gradient-avatar-grape: linear-gradient(315deg, #DE0093 0%, #5F41E5 100%);
159
- --pds-color-gradient-avatar-midnight: linear-gradient(315deg, #5F41E5 0%, #141013 100%);
160
- --pds-color-gradient-avatar-moon: linear-gradient(315deg, #A2CFFF 0%, #8A70FF 100%);
161
- --pds-color-gradient-avatar-plum: linear-gradient(135deg, #000006 0%, #782EA9 76.76%);
162
- --pds-color-gradient-avatar-spring: linear-gradient(315deg, #FFDC28 0%, #218C5F 100%);
163
- --pds-color-gradient-avatar-summer: linear-gradient(135deg, #FF00C5 0%, #F09737 100%);
164
- --pds-color-gradient-avatar-sun: linear-gradient(135deg, #E65F35 0%, #FFFF11 100%);
165
- --pds-color-gradient-avatar-sundown: linear-gradient(135deg, #4BCE97 0%, #A2CFFF 50%, #F9DFCF 100%);
166
- --pds-color-gradient-avatar-sunrise: linear-gradient(135deg, #3017A1 0%, #F09737 100%);
167
- --pds-color-gradient-avatar-twilight: linear-gradient(315deg, #C72FA2 0%, #1B0874 100%);
168
- --pds-color-gradient-avatar-winter: linear-gradient(315deg, #FFDC28 0%, #5F41E5 100%);
169
- --pds-color-gradient-card-fog: linear-gradient(45deg, #EAD7D3 0%, #A2DCFF 100%);
170
- --pds-color-gradient-card-lavender: linear-gradient(225deg, #8A70FF 0%, #BFB1FF 100%);
171
- --pds-color-gradient-card-mint: linear-gradient(225deg, #4BCE97 0%, #BAF3DB 100%);
172
- --pds-color-gradient-card-royal: linear-gradient(225deg, #3017A1 0%, #8A70FF 100%);
173
- --pds-color-gradient-card-sundown: linear-gradient(225deg, #4BCE97 0%, #A2CFFF 50%, #F9DFCF 100%);
174
- --pds-color-gradient-card-yellow: linear-gradient(225deg, #FFCB45 0%, #FFDC28 50%, #FFF1A9 100%);
175
- --pds-color-gradient-midnight: linear-gradient(228.64deg, #1B0874 46.34%, #00E0C3 100%);
176
- --pds-color-gradient-pastel-1: linear-gradient(175deg, #DFD8F55C 15%, #FFFFFF00 80%);
177
- --pds-color-gradient-sunrise: linear-gradient(227.79deg, #1B0874 38.28%, #E65F35 100%);
178
- --pds-color-gradient-sunset: linear-gradient(48.24deg, #EF13AD 0%, #1B0874 66.25%);
179
- --pds-color-icon-button-critical-background-active: #fcc5be;
180
- --pds-color-icon-button-critical-background-default: rgba(0, 0, 0, 0);
181
- --pds-color-icon-button-critical-background-hover: #ffedeb;
182
- --pds-color-icon-button-critical-foreground-default: #ca3521;
183
- --pds-color-icon-button-standard-background-active: #cfcfd3;
184
- --pds-color-icon-button-standard-background-default: rgba(0, 0, 0, 0);
185
- --pds-color-icon-button-standard-background-hover: #f1f1f1;
186
- --pds-color-icon-button-standard-foreground-default: #6d6d78;
187
- --pds-color-input-action-background-hover: #f8f8f8;
188
- --pds-color-input-background-critical: #ffedeb;
189
- --pds-color-input-background-default: #ffffff;
190
- --pds-color-input-background-hover: #f0edfb;
191
- --pds-color-input-border-critical: #ca3521;
192
- --pds-color-input-border-default: #cfcfd3;
193
- --pds-color-input-border-hover: #5e45cf;
194
- --pds-color-input-border-success: #218c5f;
195
- --pds-color-input-checked-background: var(--pds-color-interactive-focus);
196
- --pds-color-input-checked-foreground: #ffffff;
197
- --pds-color-input-file-upload-button-background-default: #f1f1f1;
198
- --pds-color-input-file-upload-button-background-hover: #e6e6e7;
199
- --pds-color-input-foreground-critical: #ca3521;
200
- --pds-color-input-foreground-default: #23232d;
201
- --pds-color-input-foreground-success: #218c5f;
202
- --pds-color-input-placeholder-text: #6d6d78;
203
- --pds-color-input-toggle-switch-icon: #ffffff;
204
- --pds-color-input-toggle-switch-off: #6d6d78;
205
- --pds-color-input-toggle-switch-on: var(--pds-color-interactive-focus);
206
- --pds-color-interactive-focus: #0f62fe;
207
- --pds-color-interactive-link-active: #3017a1;
208
- --pds-color-interactive-link-default: #0f62fe;
209
- --pds-color-interactive-link-hover: #5e45cf;
210
- --pds-color-interactive-link-visited: #5e45cf;
211
- --pds-color-interactive-reverse-focus: #36a3ff;
212
- --pds-color-interactive-reverse-link-active: #ad9bff;
213
- --pds-color-interactive-reverse-link-default: #36a3ff;
214
- --pds-color-interactive-reverse-link-hover: #8a70ff;
215
- --pds-color-interactive-reverse-link-visited: #8a70ff;
216
- --pds-color-link-cta-active: #200c7f;
217
- --pds-color-link-cta-default: #3017a1;
218
- --pds-color-link-cta-hover: #5e45cf;
219
- --pds-color-logo-carousel-background: #5e45cf;
220
- --pds-color-logo-carousel-foreground: var(--pds-color-foreground-reverse);
221
- --pds-color-menu-background: #ffffff;
222
- --pds-color-menu-item-background-active: #f1f1f1;
223
- --pds-color-menu-item-background-default: #ffffff;
224
- --pds-color-menu-item-background-hover: #f1f1f1;
225
- --pds-color-menu-item-description-text: #6d6d78;
226
- --pds-color-menu-item-foreground: #23232d;
227
- --pds-color-menu-item-heading-text: #6d6d78;
228
- --pds-color-neutral-000: #ffffff;
229
- --pds-color-neutral-100: #f8f8f8;
230
- --pds-color-neutral-200: #f1f1f1;
231
- --pds-color-neutral-300: #cfcfd3;
232
- --pds-color-neutral-400: #6d6d78;
233
- --pds-color-neutral-500: #23232d;
234
- --pds-color-overlay: rgba(9, 0, 48, 0.45);
235
- --pds-color-pager-background-active: #f0edfb;
236
- --pds-color-pager-background-hover: #f1f1f1;
237
- --pds-color-pager-foreground-active: #5e45cf;
238
- --pds-color-panel-critical-border: #ca3521;
239
- --pds-color-panel-default-background: var(--pds-color-background-default);
240
- --pds-color-panel-default-border: var(--pds-color-border-default);
241
- --pds-color-panel-sunken-background: #f1f1f1;
242
- --pds-color-partner-bitbucket: #004dc0;
243
- --pds-color-partner-drupal: #009cde;
244
- --pds-color-partner-gatsby: #663399;
245
- --pds-color-partner-gitlab: #ffedfb;
246
- --pds-color-partner-nextjs: #000000;
247
- --pds-color-partner-wordpress: #0073aa;
248
- --pds-color-progress-complete: #218c5f;
249
- --pds-color-progress-empty: #cfcfd3;
250
- --pds-color-progress-partial: #1d7afc;
251
- --pds-color-segmented-button-background-active: #f0edfb;
252
- --pds-color-segmented-button-background-default: #ffffff;
253
- --pds-color-segmented-button-background-hover: #f8f8f8;
254
- --pds-color-segmented-button-border-active: #3017a1;
255
- --pds-color-segmented-button-border-default: #cfcfd3;
256
- --pds-color-segmented-button-foreground-active: #3017a1;
257
- --pds-color-segmented-button-foreground-default: #6d6d78;
258
- --pds-color-semantic-critical-background: #ffedeb;
259
- --pds-color-semantic-critical-foreground: #ca3521;
260
- --pds-color-semantic-critical-utility: #f35945;
261
- --pds-color-semantic-critical-utility-light: #fcc5be;
262
- --pds-color-semantic-discovery-background: #eae6ff;
263
- --pds-color-semantic-discovery-foreground: #8270db;
264
- --pds-color-semantic-info-background: #e9f2ff;
265
- --pds-color-semantic-info-foreground: #1d7afc;
266
- --pds-color-semantic-neutral-background: #cfcfd3;
267
- --pds-color-semantic-neutral-foreground: #23232d;
268
- --pds-color-semantic-neutral-utility: #6d6d78;
269
- --pds-color-semantic-success-background: #e3fcef;
270
- --pds-color-semantic-success-foreground: #218c5f;
271
- --pds-color-semantic-success-utility: #35ae7b;
272
- --pds-color-semantic-warning-background: #fff7d6;
273
- --pds-color-semantic-warning-foreground: #d97008;
274
- --pds-color-side-nav-background-hover: #f0edfb;
275
- --pds-color-social-rss: #f26522;
276
- --pds-color-stepper-completed: #3017a1;
277
- --pds-color-stepper-current: #3017a1;
278
- --pds-color-stepper-default: #cfcfd3;
279
- --pds-color-stepper-error: #ca3521;
280
- --pds-color-strength-fair: #d97008;
281
- --pds-color-strength-strong: #218c5f;
282
- --pds-color-strength-very-weak: #cfcfd3;
283
- --pds-color-strength-weak: #ca3521;
284
- --pds-color-table-sort-arrow-active: #5e45cf;
285
- --pds-color-table-sort-arrow-inactive: #cfcfd3;
286
- --pds-color-tabs-accent: #5e45cf;
287
- --pds-color-tag-1-background: #ded8fa;
288
- --pds-color-tag-1-foreground: #5c4fac;
289
- --pds-color-tag-10-background: #d0dffc;
290
- --pds-color-tag-10-foreground: #2254c5;
291
- --pds-color-tag-11-background: #72cb9b;
292
- --pds-color-tag-11-foreground: #264a37;
293
- --pds-color-tag-12-background: #81c1dd;
294
- --pds-color-tag-12-foreground: #234453;
295
- --pds-color-tag-13-background: #689bf8;
296
- --pds-color-tag-13-foreground: #163168;
297
- --pds-color-tag-14-background: #9c90e9;
298
- --pds-color-tag-14-foreground: #342c60;
299
- --pds-color-tag-15-background: #e7796d;
300
- --pds-color-tag-15-foreground: #54221c;
301
- --pds-color-tag-16-background: #f1a76e;
302
- --pds-color-tag-16-foreground: #68320f;
303
- --pds-color-tag-17-background: #d87ab8;
304
- --pds-color-tag-17-foreground: #49273e;
305
- --pds-color-tag-18-background: #efce60;
306
- --pds-color-tag-18-foreground: #504012;
307
- --pds-color-tag-19-background: #9fc65b;
308
- --pds-color-tag-19-foreground: #3f4d27;
309
- --pds-color-tag-2-background: #f8d7d3;
310
- --pds-color-tag-2-foreground: #a0392c;
311
- --pds-color-tag-20-background: #8790a0;
312
- --pds-color-tag-20-foreground: #0e1e40;
313
- --pds-color-tag-3-background: #f5e7a8;
314
- --pds-color-tag-3-foreground: #7b611e;
315
- --pds-color-tag-4-background: #f7d7ec;
316
- --pds-color-tag-4-foreground: #894271;
317
- --pds-color-tag-5-background: #d9f0af;
318
- --pds-color-tag-5-foreground: #536a2b;
319
- --pds-color-tag-6-background: #dddfe3;
320
- --pds-color-tag-6-foreground: #47546d;
321
- --pds-color-tag-7-background: #c6f1dc;
322
- --pds-color-tag-7-foreground: #3e7256;
323
- --pds-color-tag-8-background: #f9dfcb;
324
- --pds-color-tag-8-foreground: #9a4e1c;
325
- --pds-color-tag-9-background: #ceecf9;
326
- --pds-color-tag-9-foreground: #366880;
327
- --pds-color-text-default: var(--pds-color-foreground-default);
328
- --pds-color-text-default-secondary: #6d6d78;
329
- --pds-color-text-reverse: var(--pds-color-foreground-reverse);
330
- --pds-color-tile-background-active: #f1f1f1;
331
- --pds-color-tile-background-hover: #f8f8f8;
332
- --pds-color-tile-separator: #cfcfd3;
333
- --pds-color-toggle-button-background-off: #f1f1f1;
334
- --pds-color-toggle-button-foreground-off: #6d6d78;
335
- --pds-color-tooltip-background: #23232d;
336
- --pds-color-tooltip-text: #ffffff;
337
- --pds-color-tooltip-trigger-icon-critical: #ca3521;
338
- --pds-color-tooltip-trigger-icon-default: #23232d;
339
- --pds-elevation-active: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 6px 14px 0px rgba(0, 0, 0, 0.08);
340
- --pds-elevation-dropdown: 0px 1px 0px 1px rgba(0, 0, 0, 0.08), 0px 6px 14px 0px rgba(0, 0, 0, 0.08);
341
- --pds-elevation-overlay: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.02), 0px 8px 16px -4px rgba(0, 0, 0, 0.04), 0px 24px 32px -8px rgba(0, 0, 0, 0.06);
342
- --pds-elevation-raised: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 2px 2px 0px rgba(0, 0, 0, 0.04), 0px 8px 8px -8px rgba(0, 0, 0, 0.04);
13
+ --pds-color-background-brand-secondary: #dfd8f5;
14
+ --pds-color-background-default: #ffffff;
15
+ --pds-color-background-default-secondary: #f8f8f8;
16
+ --pds-color-background-reverse: #23232d;
17
+ --pds-color-badge-indicator-brand-background: #5e45cf;
18
+ --pds-color-badge-indicator-brand-foreground: #ffffff;
19
+ --pds-color-badge-indicator-critical-background: #ca3521;
20
+ --pds-color-badge-indicator-critical-foreground: #ffffff;
21
+ --pds-color-badge-indicator-diamond-background: #cfe1fc;
22
+ --pds-color-badge-indicator-diamond-foreground: #035ad3;
23
+ --pds-color-badge-indicator-gold-background: #ffe668;
24
+ --pds-color-badge-indicator-gold-foreground: #705e00;
25
+ --pds-color-badge-indicator-info-background: #1d7afc;
26
+ --pds-color-badge-indicator-info-foreground: #ffffff;
27
+ --pds-color-badge-indicator-neutral-background: #6d6d78;
28
+ --pds-color-badge-indicator-neutral-foreground: #ffffff;
29
+ --pds-color-badge-indicator-platinum-background: #dfd8f5;
30
+ --pds-color-badge-indicator-platinum-foreground: #3017a1;
31
+ --pds-color-badge-indicator-silver-background: #cfcfd3;
32
+ --pds-color-badge-indicator-silver-foreground: #23232d;
33
+ --pds-color-badge-indicator-success-background: #218c5f;
34
+ --pds-color-badge-indicator-success-foreground: #ffffff;
35
+ --pds-color-badge-indicator-warning-background: #d97008;
36
+ --pds-color-badge-indicator-warning-foreground: #ffffff;
37
+ --pds-color-badge-status-dot-critical: var(
38
+ --pds-color-semantic-critical-foreground
39
+ );
40
+ --pds-color-badge-status-dot-default: #cfcfd3;
41
+ --pds-color-badge-status-dot-disabled: #cfcfd3;
42
+ --pds-color-badge-status-dot-discovery: var(
43
+ --pds-color-semantic-discovery-foreground
44
+ );
45
+ --pds-color-badge-status-dot-frozen: #dfd8f5;
46
+ --pds-color-badge-status-dot-info: var(--pds-color-semantic-info-foreground);
47
+ --pds-color-badge-status-dot-success: var(
48
+ --pds-color-semantic-success-foreground
49
+ );
50
+ --pds-color-badge-status-dot-warning: var(
51
+ --pds-color-semantic-warning-foreground
52
+ );
53
+ --pds-color-badge-status-neutral-background: var(
54
+ --pds-color-background-default
55
+ );
56
+ --pds-color-badge-status-neutral-border: var(--pds-color-border-default);
57
+ --pds-color-badge-status-neutral-label: var(
58
+ --pds-color-text-default-secondary
59
+ );
60
+ --pds-color-badge-status-reverse-background: var(
61
+ --pds-color-background-reverse
62
+ );
63
+ --pds-color-badge-status-reverse-border: var(--pds-color-background-reverse);
64
+ --pds-color-badge-status-reverse-label: var(--pds-color-text-reverse);
65
+ --pds-color-badge-status-transparent-background: rgba(0, 0, 0, 0);
66
+ --pds-color-badge-status-transparent-border: var(--pds-color-border-default);
67
+ --pds-color-badge-status-transparent-label: var(
68
+ --pds-color-text-default-secondary
69
+ );
70
+ --pds-color-banner-critical-background: linear-gradient(
71
+ 135deg,
72
+ #ca3521 0%,
73
+ #b95898 100%
74
+ );
75
+ --pds-color-banner-critical-foreground: #ffffff;
76
+ --pds-color-banner-info-background: linear-gradient(
77
+ 315deg,
78
+ #1265da 0%,
79
+ #5f41e5 100%
80
+ );
81
+ --pds-color-banner-info-foreground: #ffffff;
82
+ --pds-color-banner-warning-background: linear-gradient(
83
+ 135deg,
84
+ #ddbd16 0%,
85
+ #db7612 100%
86
+ );
87
+ --pds-color-banner-warning-foreground: #23232d;
88
+ --pds-color-border-default: rgba(0, 0, 0, 0.11);
89
+ --pds-color-brand-accent-100: #ffe5f6;
90
+ --pds-color-brand-accent-200: #ff99dc;
91
+ --pds-color-brand-accent-300: #ff4cc3;
92
+ --pds-color-brand-accent-400: #de0093;
93
+ --pds-color-brand-accent-500: #9a0066;
94
+ --pds-color-brand-accent-600: #560039;
95
+ --pds-color-brand-accent-default: #de0093;
96
+ --pds-color-brand-primary-100: #fffbe9;
97
+ --pds-color-brand-primary-200: #fff1a9;
98
+ --pds-color-brand-primary-300: #ffe668;
99
+ --pds-color-brand-primary-400: #ffdc28;
100
+ --pds-color-brand-primary-500: #ddbd16;
101
+ --pds-color-brand-primary-600: #705e00;
102
+ --pds-color-brand-primary-default: #ffdc28;
103
+ --pds-color-brand-secondary-100: #f0edfb;
104
+ --pds-color-brand-secondary-200: #dfd8f5;
105
+ --pds-color-brand-secondary-300: #5e45cf;
106
+ --pds-color-brand-secondary-400: #3017a1;
107
+ --pds-color-brand-secondary-500: #200c7f;
108
+ --pds-color-brand-secondary-default: #3017a1;
109
+ --pds-color-breadcrumb-link: var(--pds-color-interactive-link-default);
110
+ --pds-color-breadcrumb-separator: #cfcfd3;
111
+ --pds-color-breadcrumb-text: var(--pds-color-text-default-secondary);
112
+ --pds-color-button-brand-background-active: #ddbd16;
113
+ --pds-color-button-brand-background-default: #ffdc28;
114
+ --pds-color-button-brand-background-hover: #ffe668;
115
+ --pds-color-button-brand-border-active: #ddbd16;
116
+ --pds-color-button-brand-border-default: #ffdc28;
117
+ --pds-color-button-brand-border-hover: #ffe668;
118
+ --pds-color-button-brand-foreground-active: #23232d;
119
+ --pds-color-button-brand-foreground-default: #23232d;
120
+ --pds-color-button-brand-foreground-hover: #23232d;
121
+ --pds-color-button-brand-secondary-background-active: #f1f1f1;
122
+ --pds-color-button-brand-secondary-background-default: rgba(0, 0, 0, 0);
123
+ --pds-color-button-brand-secondary-background-hover: #f8f8f8;
124
+ --pds-color-button-brand-secondary-border-active: #23232d;
125
+ --pds-color-button-brand-secondary-border-default: #6d6d78;
126
+ --pds-color-button-brand-secondary-border-hover: #23232d;
127
+ --pds-color-button-brand-secondary-foreground-active: #23232d;
128
+ --pds-color-button-brand-secondary-foreground-default: #23232d;
129
+ --pds-color-button-brand-secondary-foreground-hover: #23232d;
130
+ --pds-color-button-critical-background-active: #ffdcd8;
131
+ --pds-color-button-critical-background-default: var(
132
+ --pds-color-background-default
133
+ );
134
+ --pds-color-button-critical-background-hover: var(
135
+ --pds-color-semantic-critical-background
136
+ );
137
+ --pds-color-button-critical-border-active: #b52f1d;
138
+ --pds-color-button-critical-border-default: var(
139
+ --pds-color-semantic-critical-foreground
140
+ );
141
+ --pds-color-button-critical-border-hover: var(
142
+ --pds-color-semantic-critical-foreground
143
+ );
144
+ --pds-color-button-critical-foreground-active: #b52f1d;
145
+ --pds-color-button-critical-foreground-default: var(
146
+ --pds-color-semantic-critical-foreground
147
+ );
148
+ --pds-color-button-critical-foreground-hover: var(
149
+ --pds-color-semantic-critical-foreground
150
+ );
151
+ --pds-color-button-navbar-foreground-active: var(
152
+ --pds-color-interactive-link-active
153
+ );
154
+ --pds-color-button-navbar-foreground-default: var(
155
+ --pds-color-foreground-default
156
+ );
157
+ --pds-color-button-navbar-foreground-hover: var(
158
+ --pds-color-interactive-link-hover
159
+ );
160
+ --pds-color-button-primary-background-active: #200c7f;
161
+ --pds-color-button-primary-background-default: #3017a1;
162
+ --pds-color-button-primary-background-hover: #5e45cf;
163
+ --pds-color-button-primary-border-active: #200c7f;
164
+ --pds-color-button-primary-border-default: #3017a1;
165
+ --pds-color-button-primary-border-hover: #5e45cf;
166
+ --pds-color-button-primary-foreground-active: #ffffff;
167
+ --pds-color-button-primary-foreground-default: #ffffff;
168
+ --pds-color-button-primary-foreground-hover: #ffffff;
169
+ --pds-color-button-secondary-background-active: #dfd8f5;
170
+ --pds-color-button-secondary-background-default: rgba(0, 0, 0, 0);
171
+ --pds-color-button-secondary-background-hover: #f0edfb;
172
+ --pds-color-button-secondary-border-active: #200c7f;
173
+ --pds-color-button-secondary-border-default: #3017a1;
174
+ --pds-color-button-secondary-border-hover: #5e45cf;
175
+ --pds-color-button-secondary-foreground-active: #200c7f;
176
+ --pds-color-button-secondary-foreground-default: #3017a1;
177
+ --pds-color-button-secondary-foreground-hover: #3017a1;
178
+ --pds-color-button-subtle-background-default: rgba(0, 0, 0, 0);
179
+ --pds-color-button-subtle-border-default: rgba(0, 0, 0, 0);
180
+ --pds-color-button-subtle-foreground-active: #200c7f;
181
+ --pds-color-button-subtle-foreground-default: #3017a1;
182
+ --pds-color-button-subtle-foreground-hover: #5e45cf;
183
+ --pds-color-card-border: var(--pds-color-border-default);
184
+ --pds-color-code-inline-background: #f0edfb;
185
+ --pds-color-code-inline-border: #dfd8f5;
186
+ --pds-color-code-inline-text: #000000;
187
+ --pds-color-dashboard-nav-background: var(
188
+ --pds-color-background-default-secondary
189
+ );
190
+ --pds-color-dashboard-nav-item-background-active: var(
191
+ --pds-color-background-reverse
192
+ );
193
+ --pds-color-dashboard-nav-item-background-default: rgba(0, 0, 0, 0);
194
+ --pds-color-dashboard-nav-item-background-hover: #e8e8e9;
195
+ --pds-color-dashboard-nav-item-foreground-active: var(
196
+ --pds-color-foreground-reverse
197
+ );
198
+ --pds-color-dashboard-nav-item-foreground-default: var(
199
+ --pds-color-foreground-default
200
+ );
201
+ --pds-color-dashboard-nav-item-foreground-hover: var(
202
+ --pds-color-foreground-default
203
+ );
204
+ --pds-color-dashboard-toggle-button-background: var(
205
+ --pds-color-background-reverse
206
+ );
207
+ --pds-color-dashboard-toggle-button-foreground: var(
208
+ --pds-color-foreground-reverse
209
+ );
210
+ --pds-color-expansion-panel-hover: #f1f1f1;
211
+ --pds-color-expansion-panel-open: #f1f1f1;
212
+ --pds-color-foreground-default: #23232d;
213
+ --pds-color-foreground-reverse: #ffffff;
214
+ --pds-color-gradient-after-hours: linear-gradient(
215
+ 228.64deg,
216
+ #1b0874 41.87%,
217
+ #29b2ff 100%
218
+ );
219
+ --pds-color-gradient-avatar-dawn: linear-gradient(
220
+ 315deg,
221
+ #ffdc28 0%,
222
+ #a2cfff 100%
223
+ );
224
+ --pds-color-gradient-avatar-dragonfruit: linear-gradient(
225
+ 315deg,
226
+ #d0c6ff 0%,
227
+ #de0093 100%
228
+ );
229
+ --pds-color-gradient-avatar-dusk: linear-gradient(
230
+ 315deg,
231
+ #01effe 0%,
232
+ #ff00c5 100%
233
+ );
234
+ --pds-color-gradient-avatar-earth: linear-gradient(
235
+ 315deg,
236
+ #6bc5fc 0%,
237
+ #218c5f 100%
238
+ );
239
+ --pds-color-gradient-avatar-fall: linear-gradient(
240
+ 135deg,
241
+ #cc36c9 0%,
242
+ #ffff11 100%
243
+ );
244
+ --pds-color-gradient-avatar-grape: linear-gradient(
245
+ 315deg,
246
+ #de0093 0%,
247
+ #5f41e5 100%
248
+ );
249
+ --pds-color-gradient-avatar-midnight: linear-gradient(
250
+ 315deg,
251
+ #5f41e5 0%,
252
+ #141013 100%
253
+ );
254
+ --pds-color-gradient-avatar-moon: linear-gradient(
255
+ 315deg,
256
+ #a2cfff 0%,
257
+ #8a70ff 100%
258
+ );
259
+ --pds-color-gradient-avatar-plum: linear-gradient(
260
+ 135deg,
261
+ #000006 0%,
262
+ #782ea9 76.76%
263
+ );
264
+ --pds-color-gradient-avatar-spring: linear-gradient(
265
+ 315deg,
266
+ #ffdc28 0%,
267
+ #218c5f 100%
268
+ );
269
+ --pds-color-gradient-avatar-summer: linear-gradient(
270
+ 135deg,
271
+ #ff00c5 0%,
272
+ #f09737 100%
273
+ );
274
+ --pds-color-gradient-avatar-sun: linear-gradient(
275
+ 135deg,
276
+ #e65f35 0%,
277
+ #ffff11 100%
278
+ );
279
+ --pds-color-gradient-avatar-sundown: linear-gradient(
280
+ 135deg,
281
+ #4bce97 0%,
282
+ #a2cfff 50%,
283
+ #f9dfcf 100%
284
+ );
285
+ --pds-color-gradient-avatar-sunrise: linear-gradient(
286
+ 135deg,
287
+ #3017a1 0%,
288
+ #f09737 100%
289
+ );
290
+ --pds-color-gradient-avatar-twilight: linear-gradient(
291
+ 315deg,
292
+ #c72fa2 0%,
293
+ #1b0874 100%
294
+ );
295
+ --pds-color-gradient-avatar-winter: linear-gradient(
296
+ 315deg,
297
+ #ffdc28 0%,
298
+ #5f41e5 100%
299
+ );
300
+ --pds-color-gradient-card-fog: linear-gradient(
301
+ 45deg,
302
+ #ead7d3 0%,
303
+ #a2dcff 100%
304
+ );
305
+ --pds-color-gradient-card-lavender: linear-gradient(
306
+ 225deg,
307
+ #8a70ff 0%,
308
+ #bfb1ff 100%
309
+ );
310
+ --pds-color-gradient-card-mint: linear-gradient(
311
+ 225deg,
312
+ #4bce97 0%,
313
+ #baf3db 100%
314
+ );
315
+ --pds-color-gradient-card-royal: linear-gradient(
316
+ 225deg,
317
+ #3017a1 0%,
318
+ #8a70ff 100%
319
+ );
320
+ --pds-color-gradient-card-sundown: linear-gradient(
321
+ 225deg,
322
+ #4bce97 0%,
323
+ #a2cfff 50%,
324
+ #f9dfcf 100%
325
+ );
326
+ --pds-color-gradient-card-yellow: linear-gradient(
327
+ 225deg,
328
+ #ffcb45 0%,
329
+ #ffdc28 50%,
330
+ #fff1a9 100%
331
+ );
332
+ --pds-color-gradient-midnight: linear-gradient(
333
+ 228.64deg,
334
+ #1b0874 46.34%,
335
+ #00e0c3 100%
336
+ );
337
+ --pds-color-gradient-pastel-1: linear-gradient(
338
+ 175deg,
339
+ #dfd8f55c 15%,
340
+ #ffffff00 80%
341
+ );
342
+ --pds-color-gradient-sunrise: linear-gradient(
343
+ 227.79deg,
344
+ #1b0874 38.28%,
345
+ #e65f35 100%
346
+ );
347
+ --pds-color-gradient-sunset: linear-gradient(
348
+ 48.24deg,
349
+ #ef13ad 0%,
350
+ #1b0874 66.25%
351
+ );
352
+ --pds-color-icon-button-critical-background-active: #fcc5be;
353
+ --pds-color-icon-button-critical-background-default: rgba(0, 0, 0, 0);
354
+ --pds-color-icon-button-critical-background-hover: #ffedeb;
355
+ --pds-color-icon-button-critical-foreground-default: #ca3521;
356
+ --pds-color-icon-button-standard-background-active: #cfcfd3;
357
+ --pds-color-icon-button-standard-background-default: rgba(0, 0, 0, 0);
358
+ --pds-color-icon-button-standard-background-hover: #f1f1f1;
359
+ --pds-color-icon-button-standard-foreground-default: #6d6d78;
360
+ --pds-color-input-action-background-hover: #f8f8f8;
361
+ --pds-color-input-background-critical: #ffedeb;
362
+ --pds-color-input-background-default: #ffffff;
363
+ --pds-color-input-background-hover: #f0edfb;
364
+ --pds-color-input-border-critical: #ca3521;
365
+ --pds-color-input-border-default: #cfcfd3;
366
+ --pds-color-input-border-hover: #5e45cf;
367
+ --pds-color-input-border-success: #218c5f;
368
+ --pds-color-input-checked-background: var(--pds-color-interactive-focus);
369
+ --pds-color-input-checked-foreground: #ffffff;
370
+ --pds-color-input-file-upload-button-background-default: #f1f1f1;
371
+ --pds-color-input-file-upload-button-background-hover: #e6e6e7;
372
+ --pds-color-input-foreground-critical: #ca3521;
373
+ --pds-color-input-foreground-default: #23232d;
374
+ --pds-color-input-foreground-success: #218c5f;
375
+ --pds-color-input-placeholder-text: #6d6d78;
376
+ --pds-color-input-toggle-switch-icon: #ffffff;
377
+ --pds-color-input-toggle-switch-off: #6d6d78;
378
+ --pds-color-input-toggle-switch-on: var(--pds-color-interactive-focus);
379
+ --pds-color-interactive-focus: #0f62fe;
380
+ --pds-color-interactive-link-active: #3017a1;
381
+ --pds-color-interactive-link-default: #0f62fe;
382
+ --pds-color-interactive-link-hover: #5e45cf;
383
+ --pds-color-interactive-link-visited: #5e45cf;
384
+ --pds-color-interactive-reverse-focus: #36a3ff;
385
+ --pds-color-interactive-reverse-link-active: #ad9bff;
386
+ --pds-color-interactive-reverse-link-default: #36a3ff;
387
+ --pds-color-interactive-reverse-link-hover: #8a70ff;
388
+ --pds-color-interactive-reverse-link-visited: #8a70ff;
389
+ --pds-color-link-cta-active: #200c7f;
390
+ --pds-color-link-cta-default: #3017a1;
391
+ --pds-color-link-cta-hover: #5e45cf;
392
+ --pds-color-logo-carousel-background: #5e45cf;
393
+ --pds-color-logo-carousel-foreground: var(--pds-color-foreground-reverse);
394
+ --pds-color-menu-background: #ffffff;
395
+ --pds-color-menu-item-background-active: #f1f1f1;
396
+ --pds-color-menu-item-background-default: #ffffff;
397
+ --pds-color-menu-item-background-hover: #f1f1f1;
398
+ --pds-color-menu-item-description-text: #6d6d78;
399
+ --pds-color-menu-item-foreground: #23232d;
400
+ --pds-color-menu-item-heading-text: #6d6d78;
401
+ --pds-color-neutral-000: #ffffff;
402
+ --pds-color-neutral-100: #f8f8f8;
403
+ --pds-color-neutral-200: #f1f1f1;
404
+ --pds-color-neutral-300: #cfcfd3;
405
+ --pds-color-neutral-400: #6d6d78;
406
+ --pds-color-neutral-500: #23232d;
407
+ --pds-color-overlay: rgba(9, 0, 48, 0.45);
408
+ --pds-color-pager-background-active: #f0edfb;
409
+ --pds-color-pager-background-hover: #f1f1f1;
410
+ --pds-color-pager-foreground-active: #5e45cf;
411
+ --pds-color-panel-critical-border: #ca3521;
412
+ --pds-color-panel-default-background: var(--pds-color-background-default);
413
+ --pds-color-panel-default-border: var(--pds-color-border-default);
414
+ --pds-color-panel-sunken-background: #f1f1f1;
415
+ --pds-color-partner-bitbucket: #004dc0;
416
+ --pds-color-partner-drupal: #009cde;
417
+ --pds-color-partner-gatsby: #663399;
418
+ --pds-color-partner-gitlab: #ffedfb;
419
+ --pds-color-partner-nextjs: #000000;
420
+ --pds-color-partner-wordpress: #0073aa;
421
+ --pds-color-progress-complete: #218c5f;
422
+ --pds-color-progress-empty: #cfcfd3;
423
+ --pds-color-progress-partial: #1d7afc;
424
+ --pds-color-segmented-button-background-active: #f0edfb;
425
+ --pds-color-segmented-button-background-default: #ffffff;
426
+ --pds-color-segmented-button-background-hover: #f8f8f8;
427
+ --pds-color-segmented-button-border-active: #3017a1;
428
+ --pds-color-segmented-button-border-default: #cfcfd3;
429
+ --pds-color-segmented-button-foreground-active: #3017a1;
430
+ --pds-color-segmented-button-foreground-default: #6d6d78;
431
+ --pds-color-semantic-critical-background: #ffedeb;
432
+ --pds-color-semantic-critical-foreground: #ca3521;
433
+ --pds-color-semantic-critical-utility: #f35945;
434
+ --pds-color-semantic-critical-utility-light: #fcc5be;
435
+ --pds-color-semantic-discovery-background: #eae6ff;
436
+ --pds-color-semantic-discovery-foreground: #8270db;
437
+ --pds-color-semantic-info-background: #e9f2ff;
438
+ --pds-color-semantic-info-foreground: #1d7afc;
439
+ --pds-color-semantic-neutral-background: #cfcfd3;
440
+ --pds-color-semantic-neutral-foreground: #23232d;
441
+ --pds-color-semantic-neutral-utility: #6d6d78;
442
+ --pds-color-semantic-success-background: #e3fcef;
443
+ --pds-color-semantic-success-foreground: #218c5f;
444
+ --pds-color-semantic-success-utility: #35ae7b;
445
+ --pds-color-semantic-warning-background: #fff7d6;
446
+ --pds-color-semantic-warning-foreground: #d97008;
447
+ --pds-color-side-nav-background-hover: #f0edfb;
448
+ --pds-color-social-rss: #f26522;
449
+ --pds-color-stepper-completed: #3017a1;
450
+ --pds-color-stepper-current: #3017a1;
451
+ --pds-color-stepper-default: #cfcfd3;
452
+ --pds-color-stepper-error: #ca3521;
453
+ --pds-color-strength-fair: #d97008;
454
+ --pds-color-strength-strong: #218c5f;
455
+ --pds-color-strength-very-weak: #cfcfd3;
456
+ --pds-color-strength-weak: #ca3521;
457
+ --pds-color-table-sort-arrow-active: #5e45cf;
458
+ --pds-color-table-sort-arrow-inactive: #cfcfd3;
459
+ --pds-color-tabs-accent: #5e45cf;
460
+ --pds-color-tag-1-background: #ded8fa;
461
+ --pds-color-tag-1-foreground: #5c4fac;
462
+ --pds-color-tag-10-background: #d0dffc;
463
+ --pds-color-tag-10-foreground: #2254c5;
464
+ --pds-color-tag-11-background: #72cb9b;
465
+ --pds-color-tag-11-foreground: #264a37;
466
+ --pds-color-tag-12-background: #81c1dd;
467
+ --pds-color-tag-12-foreground: #234453;
468
+ --pds-color-tag-13-background: #689bf8;
469
+ --pds-color-tag-13-foreground: #163168;
470
+ --pds-color-tag-14-background: #9c90e9;
471
+ --pds-color-tag-14-foreground: #342c60;
472
+ --pds-color-tag-15-background: #e7796d;
473
+ --pds-color-tag-15-foreground: #54221c;
474
+ --pds-color-tag-16-background: #f1a76e;
475
+ --pds-color-tag-16-foreground: #68320f;
476
+ --pds-color-tag-17-background: #d87ab8;
477
+ --pds-color-tag-17-foreground: #49273e;
478
+ --pds-color-tag-18-background: #efce60;
479
+ --pds-color-tag-18-foreground: #504012;
480
+ --pds-color-tag-19-background: #9fc65b;
481
+ --pds-color-tag-19-foreground: #3f4d27;
482
+ --pds-color-tag-2-background: #f8d7d3;
483
+ --pds-color-tag-2-foreground: #a0392c;
484
+ --pds-color-tag-20-background: #8790a0;
485
+ --pds-color-tag-20-foreground: #0e1e40;
486
+ --pds-color-tag-3-background: #f5e7a8;
487
+ --pds-color-tag-3-foreground: #7b611e;
488
+ --pds-color-tag-4-background: #f7d7ec;
489
+ --pds-color-tag-4-foreground: #894271;
490
+ --pds-color-tag-5-background: #d9f0af;
491
+ --pds-color-tag-5-foreground: #536a2b;
492
+ --pds-color-tag-6-background: #dddfe3;
493
+ --pds-color-tag-6-foreground: #47546d;
494
+ --pds-color-tag-7-background: #c6f1dc;
495
+ --pds-color-tag-7-foreground: #3e7256;
496
+ --pds-color-tag-8-background: #f9dfcb;
497
+ --pds-color-tag-8-foreground: #9a4e1c;
498
+ --pds-color-tag-9-background: #ceecf9;
499
+ --pds-color-tag-9-foreground: #366880;
500
+ --pds-color-text-default: var(--pds-color-foreground-default);
501
+ --pds-color-text-default-secondary: #6d6d78;
502
+ --pds-color-text-reverse: var(--pds-color-foreground-reverse);
503
+ --pds-color-tile-background-active: #f1f1f1;
504
+ --pds-color-tile-background-hover: #f8f8f8;
505
+ --pds-color-tile-separator: #cfcfd3;
506
+ --pds-color-toggle-button-background-off: #f1f1f1;
507
+ --pds-color-toggle-button-foreground-off: #6d6d78;
508
+ --pds-color-tooltip-background: #23232d;
509
+ --pds-color-tooltip-text: #ffffff;
510
+ --pds-color-tooltip-trigger-icon-critical: #ca3521;
511
+ --pds-color-tooltip-trigger-icon-default: #23232d;
512
+ --pds-elevation-active: 0px 0px 0px 1px rgba(0, 0, 0, 0.08),
513
+ 0px 6px 14px 0px rgba(0, 0, 0, 0.08);
514
+ --pds-elevation-dropdown: 0px 1px 0px 1px rgba(0, 0, 0, 0.08),
515
+ 0px 6px 14px 0px rgba(0, 0, 0, 0.08);
516
+ --pds-elevation-overlay: 0px 0px 0px 1px rgba(0, 0, 0, 0.08),
517
+ 0px 1px 1px 0px rgba(0, 0, 0, 0.02), 0px 8px 16px -4px rgba(0, 0, 0, 0.04),
518
+ 0px 24px 32px -8px rgba(0, 0, 0, 0.06);
519
+ --pds-elevation-raised: 0px 0px 0px 1px rgba(0, 0, 0, 0.08),
520
+ 0px 2px 2px 0px rgba(0, 0, 0, 0.04), 0px 8px 8px -8px rgba(0, 0, 0, 0.04);
343
521
  }
@@ -11984,6 +11984,64 @@
11984
11984
  ]
11985
11985
  }
11986
11986
  },
11987
+ "warning": {
11988
+ "background": {
11989
+ "value": "#d97008",
11990
+ "public": true,
11991
+ "isReferenceToInternal": true,
11992
+ "filePath": "tokens/color/alias/badge.light.json",
11993
+ "isSource": true,
11994
+ "original": {
11995
+ "value": "{color.light-mode.semantic.warning.foreground.value}",
11996
+ "public": true,
11997
+ "isReferenceToInternal": true
11998
+ },
11999
+ "name": "color-light-mode-badge-indicator-warning-background",
12000
+ "attributes": {
12001
+ "category": "color",
12002
+ "type": "light-mode",
12003
+ "item": "badge",
12004
+ "subitem": "indicator",
12005
+ "state": "warning"
12006
+ },
12007
+ "path": [
12008
+ "color",
12009
+ "light-mode",
12010
+ "badge",
12011
+ "indicator",
12012
+ "warning",
12013
+ "background"
12014
+ ]
12015
+ },
12016
+ "foreground": {
12017
+ "value": "#ffffff",
12018
+ "public": true,
12019
+ "isReferenceToInternal": true,
12020
+ "filePath": "tokens/color/alias/badge.light.json",
12021
+ "isSource": true,
12022
+ "original": {
12023
+ "value": "{color.light-mode.neutral.000.value}",
12024
+ "public": true,
12025
+ "isReferenceToInternal": true
12026
+ },
12027
+ "name": "color-light-mode-badge-indicator-warning-foreground",
12028
+ "attributes": {
12029
+ "category": "color",
12030
+ "type": "light-mode",
12031
+ "item": "badge",
12032
+ "subitem": "indicator",
12033
+ "state": "warning"
12034
+ },
12035
+ "path": [
12036
+ "color",
12037
+ "light-mode",
12038
+ "badge",
12039
+ "indicator",
12040
+ "warning",
12041
+ "foreground"
12042
+ ]
12043
+ }
12044
+ },
11987
12045
  "neutral": {
11988
12046
  "background": {
11989
12047
  "value": "#6d6d78",
@@ -12042,32 +12100,32 @@
12042
12100
  ]
12043
12101
  }
12044
12102
  },
12045
- "warning": {
12103
+ "brand": {
12046
12104
  "background": {
12047
- "value": "#d97008",
12105
+ "value": "#5e45cf",
12048
12106
  "public": true,
12049
12107
  "isReferenceToInternal": true,
12050
12108
  "filePath": "tokens/color/alias/badge.light.json",
12051
12109
  "isSource": true,
12052
12110
  "original": {
12053
- "value": "{color.light-mode.semantic.warning.foreground.value}",
12111
+ "value": "{color.light-mode.brand.secondary.300.value}",
12054
12112
  "public": true,
12055
12113
  "isReferenceToInternal": true
12056
12114
  },
12057
- "name": "color-light-mode-badge-indicator-warning-background",
12115
+ "name": "color-light-mode-badge-indicator-brand-background",
12058
12116
  "attributes": {
12059
12117
  "category": "color",
12060
12118
  "type": "light-mode",
12061
12119
  "item": "badge",
12062
12120
  "subitem": "indicator",
12063
- "state": "warning"
12121
+ "state": "brand"
12064
12122
  },
12065
12123
  "path": [
12066
12124
  "color",
12067
12125
  "light-mode",
12068
12126
  "badge",
12069
12127
  "indicator",
12070
- "warning",
12128
+ "brand",
12071
12129
  "background"
12072
12130
  ]
12073
12131
  },
@@ -12082,20 +12140,20 @@
12082
12140
  "public": true,
12083
12141
  "isReferenceToInternal": true
12084
12142
  },
12085
- "name": "color-light-mode-badge-indicator-warning-foreground",
12143
+ "name": "color-light-mode-badge-indicator-brand-foreground",
12086
12144
  "attributes": {
12087
12145
  "category": "color",
12088
12146
  "type": "light-mode",
12089
12147
  "item": "badge",
12090
12148
  "subitem": "indicator",
12091
- "state": "warning"
12149
+ "state": "brand"
12092
12150
  },
12093
12151
  "path": [
12094
12152
  "color",
12095
12153
  "light-mode",
12096
12154
  "badge",
12097
12155
  "indicator",
12098
- "warning",
12156
+ "brand",
12099
12157
  "foreground"
12100
12158
  ]
12101
12159
  }
@@ -865,6 +865,64 @@
865
865
  ]
866
866
  }
867
867
  },
868
+ "warning": {
869
+ "background": {
870
+ "value": "#d97008",
871
+ "public": true,
872
+ "isReferenceToInternal": true,
873
+ "filePath": "tokens/color/alias/badge.light.json",
874
+ "isSource": true,
875
+ "original": {
876
+ "value": "{color.light-mode.semantic.warning.foreground.value}",
877
+ "public": true,
878
+ "isReferenceToInternal": true
879
+ },
880
+ "name": "color-light-mode-badge-indicator-warning-background",
881
+ "attributes": {
882
+ "category": "color",
883
+ "type": "light-mode",
884
+ "item": "badge",
885
+ "subitem": "indicator",
886
+ "state": "warning"
887
+ },
888
+ "path": [
889
+ "color",
890
+ "light-mode",
891
+ "badge",
892
+ "indicator",
893
+ "warning",
894
+ "background"
895
+ ]
896
+ },
897
+ "foreground": {
898
+ "value": "#ffffff",
899
+ "public": true,
900
+ "isReferenceToInternal": true,
901
+ "filePath": "tokens/color/alias/badge.light.json",
902
+ "isSource": true,
903
+ "original": {
904
+ "value": "{color.light-mode.neutral.000.value}",
905
+ "public": true,
906
+ "isReferenceToInternal": true
907
+ },
908
+ "name": "color-light-mode-badge-indicator-warning-foreground",
909
+ "attributes": {
910
+ "category": "color",
911
+ "type": "light-mode",
912
+ "item": "badge",
913
+ "subitem": "indicator",
914
+ "state": "warning"
915
+ },
916
+ "path": [
917
+ "color",
918
+ "light-mode",
919
+ "badge",
920
+ "indicator",
921
+ "warning",
922
+ "foreground"
923
+ ]
924
+ }
925
+ },
868
926
  "neutral": {
869
927
  "background": {
870
928
  "value": "#6d6d78",
@@ -923,32 +981,32 @@
923
981
  ]
924
982
  }
925
983
  },
926
- "warning": {
984
+ "brand": {
927
985
  "background": {
928
- "value": "#d97008",
986
+ "value": "#5e45cf",
929
987
  "public": true,
930
988
  "isReferenceToInternal": true,
931
989
  "filePath": "tokens/color/alias/badge.light.json",
932
990
  "isSource": true,
933
991
  "original": {
934
- "value": "{color.light-mode.semantic.warning.foreground.value}",
992
+ "value": "{color.light-mode.brand.secondary.300.value}",
935
993
  "public": true,
936
994
  "isReferenceToInternal": true
937
995
  },
938
- "name": "color-light-mode-badge-indicator-warning-background",
996
+ "name": "color-light-mode-badge-indicator-brand-background",
939
997
  "attributes": {
940
998
  "category": "color",
941
999
  "type": "light-mode",
942
1000
  "item": "badge",
943
1001
  "subitem": "indicator",
944
- "state": "warning"
1002
+ "state": "brand"
945
1003
  },
946
1004
  "path": [
947
1005
  "color",
948
1006
  "light-mode",
949
1007
  "badge",
950
1008
  "indicator",
951
- "warning",
1009
+ "brand",
952
1010
  "background"
953
1011
  ]
954
1012
  },
@@ -963,20 +1021,20 @@
963
1021
  "public": true,
964
1022
  "isReferenceToInternal": true
965
1023
  },
966
- "name": "color-light-mode-badge-indicator-warning-foreground",
1024
+ "name": "color-light-mode-badge-indicator-brand-foreground",
967
1025
  "attributes": {
968
1026
  "category": "color",
969
1027
  "type": "light-mode",
970
1028
  "item": "badge",
971
1029
  "subitem": "indicator",
972
- "state": "warning"
1030
+ "state": "brand"
973
1031
  },
974
1032
  "path": [
975
1033
  "color",
976
1034
  "light-mode",
977
1035
  "badge",
978
1036
  "indicator",
979
- "warning",
1037
+ "brand",
980
1038
  "foreground"
981
1039
  ]
982
1040
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pantheon-systems/pds-design-tokens",
3
- "version": "1.0.0-dev.141",
3
+ "version": "1.0.0-dev.142",
4
4
  "description": "Design Tokens for the Pantheon Design System",
5
5
  "homepage": "https://pantheon.io",
6
6
  "keywords": [