@pantheon-systems/pds-design-tokens 1.0.0-dev.119 → 1.0.0-dev.120

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,235 +1,298 @@
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: #4e39a8;
14
- --pds-color-background-default: #1d1d29;
15
- --pds-color-background-default-secondary: #282839;
16
- --pds-color-background-reverse: #e7e7eb;
17
- --pds-color-badge-indicator-diamond-background: #f0fdff;
18
- --pds-color-badge-indicator-diamond-foreground: #388bff;
19
- --pds-color-badge-indicator-gold-background: #fff1a9;
20
- --pds-color-badge-indicator-gold-foreground: #705e00;
21
- --pds-color-badge-indicator-info-background: #388bff;
22
- --pds-color-badge-indicator-info-foreground: #ffffff;
23
- --pds-color-badge-indicator-neutral-background: #504e62;
24
- --pds-color-badge-indicator-neutral-foreground: #ffffff;
25
- --pds-color-badge-indicator-platinum-background: #d0c6ff;
26
- --pds-color-badge-indicator-platinum-foreground: #4e39a8;
27
- --pds-color-badge-indicator-silver-background: #a6a3b4;
28
- --pds-color-badge-indicator-silver-foreground: var(--pds-color-text-default-secondary);
29
- --pds-color-badge-indicator-success-background: #2abb7f;
30
- --pds-color-badge-indicator-success-foreground: #ffffff;
31
- --pds-color-badge-status-dot-critical: var(--pds-color-semantic-critical-foreground);
32
- --pds-color-badge-status-dot-default: #858299;
33
- --pds-color-badge-status-dot-disabled: #858299;
34
- --pds-color-badge-status-dot-discovery: var(--pds-color-semantic-discovery-foreground);
35
- --pds-color-badge-status-dot-frozen: #d0c6ff;
36
- --pds-color-badge-status-dot-info: var(--pds-color-semantic-info-foreground);
37
- --pds-color-badge-status-dot-success: var(--pds-color-semantic-success-foreground);
38
- --pds-color-badge-status-dot-warning: var(--pds-color-semantic-warning-foreground);
39
- --pds-color-badge-status-neutral-background: var(--pds-color-background-default);
40
- --pds-color-badge-status-neutral-border: var(--pds-color-border-default);
41
- --pds-color-badge-status-neutral-label: var(--pds-color-text-default-secondary);
42
- --pds-color-badge-status-reverse-background: var(--pds-color-background-reverse);
43
- --pds-color-badge-status-reverse-border: var(--pds-color-background-reverse);
44
- --pds-color-badge-status-reverse-label: var(--pds-color-text-reverse);
45
- --pds-color-badge-status-transparent-background: rgba(0, 0, 0, 0);
46
- --pds-color-badge-status-transparent-border: var(--pds-color-border-default);
47
- --pds-color-badge-status-transparent-label: var(--pds-color-text-default-secondary);
48
- --pds-color-banner-critical-background: linear-gradient(135deg, #CA3521 0%, #B95898 100%);
49
- --pds-color-banner-critical-foreground: #ffffff;
50
- --pds-color-banner-info-background: linear-gradient(315deg, #1265DA 0%, #5F41E5 100%);
51
- --pds-color-banner-info-foreground: #ffffff;
52
- --pds-color-banner-warning-background: linear-gradient(135deg, #DDBD16 0%, #DB7612 100%);
53
- --pds-color-banner-warning-foreground: #121219;
54
- --pds-color-border-default: #504e62;
55
- --pds-color-brand-accent-default: #de0093;
56
- --pds-color-brand-primary-default: #ffdc28;
57
- --pds-color-brand-secondary-default: #8a70ff;
58
- --pds-color-breadcrumb-link: var(--pds-color-link-default);
59
- --pds-color-breadcrumb-separator: #858299;
60
- --pds-color-breadcrumb-text: var(--pds-color-text-default-secondary);
61
- --pds-color-button-brand-background-active: #ddbd16;
62
- --pds-color-button-brand-background-default: #ffdc28;
63
- --pds-color-button-brand-background-hover: #ffe668;
64
- --pds-color-button-brand-border-active: #ddbd16;
65
- --pds-color-button-brand-border-default: #ffdc28;
66
- --pds-color-button-brand-border-hover: #ffe668;
67
- --pds-color-button-brand-foreground-active: #121219;
68
- --pds-color-button-brand-foreground-default: #121219;
69
- --pds-color-button-brand-foreground-hover: #121219;
70
- --pds-color-button-brand-secondary-background-active: #282839;
71
- --pds-color-button-brand-secondary-background-default: rgba(0, 0, 0, 0);
72
- --pds-color-button-brand-secondary-background-hover: #504e62;
73
- --pds-color-button-brand-secondary-border-active: #504e62;
74
- --pds-color-button-brand-secondary-border-default: #a6a3b4;
75
- --pds-color-button-brand-secondary-border-hover: #ffffff;
76
- --pds-color-button-brand-secondary-foreground-active: #e7e7eb;
77
- --pds-color-button-brand-secondary-foreground-default: #e7e7eb;
78
- --pds-color-button-brand-secondary-foreground-hover: #ffffff;
79
- --pds-color-button-critical-background-active: #4b2d28;
80
- --pds-color-button-critical-background-default: var(--pds-color-background-default);
81
- --pds-color-button-critical-background-hover: var(--pds-color-semantic-critical-background);
82
- --pds-color-button-critical-border-active: var(--pds-color-semantic-critical-foreground);
83
- --pds-color-button-critical-border-default: var(--pds-color-semantic-critical-foreground);
84
- --pds-color-button-critical-border-hover: var(--pds-color-semantic-critical-foreground);
85
- --pds-color-button-critical-foreground-active: var(--pds-color-semantic-critical-foreground);
86
- --pds-color-button-critical-foreground-default: var(--pds-color-semantic-critical-foreground);
87
- --pds-color-button-critical-foreground-hover: var(--pds-color-semantic-critical-foreground);
88
- --pds-color-button-navbar-foreground-active: var(--pds-color-link-active);
89
- --pds-color-button-navbar-foreground-default: #ffffff;
90
- --pds-color-button-navbar-foreground-hover: var(--pds-color-link-hover);
91
- --pds-color-button-primary-background-active: #4e39a8;
92
- --pds-color-button-primary-background-default: #8a70ff;
93
- --pds-color-button-primary-background-hover: #ad9bff;
94
- --pds-color-button-primary-border-active: #4e39a8;
95
- --pds-color-button-primary-border-default: #8a70ff;
96
- --pds-color-button-primary-border-hover: #ad9bff;
97
- --pds-color-button-primary-foreground-active: #ffffff;
98
- --pds-color-button-primary-foreground-default: #ffffff;
99
- --pds-color-button-primary-foreground-hover: #ffffff;
100
- --pds-color-button-secondary-background-active: #282839;
101
- --pds-color-button-secondary-background-default: rgba(0, 0, 0, 0);
102
- --pds-color-button-secondary-background-hover: #504e62;
103
- --pds-color-button-secondary-border-active: #504e62;
104
- --pds-color-button-secondary-border-default: #a6a3b4;
105
- --pds-color-button-secondary-border-hover: #ffffff;
106
- --pds-color-button-secondary-foreground-active: #e7e7eb;
107
- --pds-color-button-secondary-foreground-default: #e7e7eb;
108
- --pds-color-button-secondary-foreground-hover: #ffffff;
109
- --pds-color-button-subtle-background-default: rgba(0, 0, 0, 0);
110
- --pds-color-button-subtle-border-default: rgba(0, 0, 0, 0);
111
- --pds-color-button-subtle-foreground-active: var(--pds-color-link-active);
112
- --pds-color-button-subtle-foreground-default: #d0c6ff;
113
- --pds-color-button-subtle-foreground-hover: var(--pds-color-link-hover);
114
- --pds-color-card-border: #504e62;
115
- --pds-color-code-inline-background: #282839;
116
- --pds-color-code-inline-border: #504e62;
117
- --pds-color-code-inline-text: #ffffff;
118
- --pds-color-expansion-panel-hover: #282839;
119
- --pds-color-expansion-panel-open: #282839;
120
- --pds-color-foreground-default: #ffffff;
121
- --pds-color-foreground-reverse: #1d1d29;
122
- --pds-color-gradient-after-hours: linear-gradient(228.64deg, #1B0874 41.87%, #29B2FF 100%);
123
- --pds-color-gradient-midnight: linear-gradient(228.64deg, #1B0874 46.34%, #00E0C3 100%);
124
- --pds-color-gradient-sunrise: linear-gradient(227.79deg, #1B0874 38.28%, #E65F35 100%);
125
- --pds-color-gradient-sunset: linear-gradient(48.24deg, #EF13AD 0%, #1B0874 66.25%);
126
- --pds-color-icon-button-background-active: #858299;
127
- --pds-color-icon-button-background-default: rgba(0, 0, 0, 0);
128
- --pds-color-icon-button-background-hover: #a6a3b4;
129
- --pds-color-icon-button-foreground-default: #ffffff;
130
- --pds-color-input-action-background-hover: #504e62;
131
- --pds-color-input-background-critical: #1d1d29;
132
- --pds-color-input-background-default: #1d1d29;
133
- --pds-color-input-background-hover: #282839;
134
- --pds-color-input-border-critical: #ef5c48;
135
- --pds-color-input-border-default: #858299;
136
- --pds-color-input-border-hover: #ad9bff;
137
- --pds-color-input-border-success: #2abb7f;
138
- --pds-color-input-checked-background: var(--pds-color-interactive-focus);
139
- --pds-color-input-checked-foreground: #ffffff;
140
- --pds-color-input-foreground-critical: #ef5c48;
141
- --pds-color-input-foreground-default: #ffffff;
142
- --pds-color-input-foreground-success: #2abb7f;
143
- --pds-color-input-placeholder-text: #a6a3b4;
144
- --pds-color-input-toggle-switch-icon: #ffffff;
145
- --pds-color-input-toggle-switch-off: #504e62;
146
- --pds-color-input-toggle-switch-on: var(--pds-color-interactive-focus);
147
- --pds-color-interactive-focus: #36a3ff;
148
- --pds-color-interactive-link: #36a3ff;
149
- --pds-color-interactive-reverse-focus: #36a3ff;
150
- --pds-color-interactive-reverse-link: #36a3ff;
151
- --pds-color-link-active: #8a70ff;
152
- --pds-color-link-cta-active: #d0c6ff;
153
- --pds-color-link-cta-default: #8a70ff;
154
- --pds-color-link-cta-hover: #ad9bff;
155
- --pds-color-link-default: #36a3ff;
156
- --pds-color-link-hover: #8a70ff;
157
- --pds-color-link-visited: #8a70ff;
158
- --pds-color-menu-background: #282839;
159
- --pds-color-menu-item-background-active: #858299;
160
- --pds-color-menu-item-background-default: #282839;
161
- --pds-color-menu-item-background-hover: #504e62;
162
- --pds-color-menu-item-description-text: #a6a3b4;
163
- --pds-color-menu-item-foreground: #ffffff;
164
- --pds-color-menu-item-heading-text: #a6a3b4;
165
- --pds-color-overlay: rgba(9, 0, 48, 0.45);
166
- --pds-color-panel-default-background: var(--pds-color-background-default);
167
- --pds-color-panel-default-border: var(--pds-color-border-default);
168
- --pds-color-panel-sunken-background: #121219;
169
- --pds-color-partner-bitbucket: #004dc0;
170
- --pds-color-partner-drupal: #009cde;
171
- --pds-color-partner-gatsby: #663399;
172
- --pds-color-partner-gitlab: #ffedfb;
173
- --pds-color-partner-nextjs: #000000;
174
- --pds-color-partner-wordpress: #0073aa;
175
- --pds-color-progress-complete: #2abb7f;
176
- --pds-color-progress-empty: #a6a3b4;
177
- --pds-color-progress-partial: #388bff;
178
- --pds-color-semantic-critical-background: #391813;
179
- --pds-color-semantic-critical-foreground: #ef5c48;
180
- --pds-color-semantic-discovery-background: #231c3f;
181
- --pds-color-semantic-discovery-foreground: #8f7ee7;
182
- --pds-color-semantic-info-background: #082145;
183
- --pds-color-semantic-info-foreground: #388bff;
184
- --pds-color-semantic-success-background: #133527;
185
- --pds-color-semantic-success-foreground: #2abb7f;
186
- --pds-color-semantic-warning-background: #3d2e00;
187
- --pds-color-semantic-warning-foreground: #cf9f02;
188
- --pds-color-stepper-completed: #8a70ff;
189
- --pds-color-stepper-current: #8a70ff;
190
- --pds-color-stepper-default: #858299;
191
- --pds-color-stepper-error: #ef5c48;
192
- --pds-color-strength-fair: #cf9f02;
193
- --pds-color-strength-strong: #2abb7f;
194
- --pds-color-strength-very-weak: #a6a3b4;
195
- --pds-color-strength-weak: #ef5c48;
196
- --pds-color-table-sort-arrow-active: #8a70ff;
197
- --pds-color-table-sort-arrow-inactive: #a6a3b4;
198
- --pds-color-tabs-accent: #ad9bff;
199
- --pds-color-tag-1-background: #705e00;
200
- --pds-color-tag-1-foreground: #fffbe9;
201
- --pds-color-tag-10-background: #5b440a;
202
- --pds-color-tag-10-foreground: #efeadf;
203
- --pds-color-tag-2-background: #4e39a8;
204
- --pds-color-tag-2-foreground: #f3f0ff;
205
- --pds-color-tag-3-background: #560039;
206
- --pds-color-tag-3-foreground: #ffe5f6;
207
- --pds-color-tag-4-background: #504e62;
208
- --pds-color-tag-4-foreground: #e7e7eb;
209
- --pds-color-tag-5-background: #700000;
210
- --pds-color-tag-5-foreground: #ffebeb;
211
- --pds-color-tag-6-background: #b15902;
212
- --pds-color-tag-6-foreground: #fffae6;
213
- --pds-color-tag-7-background: #164b35;
214
- --pds-color-tag-7-foreground: #dffcf0;
215
- --pds-color-tag-8-background: #0f5f6a;
216
- --pds-color-tag-8-foreground: #f0fdff;
217
- --pds-color-tag-9-background: #0155cc;
218
- --pds-color-tag-9-foreground: #082145;
219
- --pds-color-tag-remove-button: #a6a3b4;
220
- --pds-color-text-default: var(--pds-color-foreground-default);
221
- --pds-color-text-default-secondary: #a6a3b4;
222
- --pds-color-text-reverse: var(--pds-color-foreground-reverse);
223
- --pds-color-tile-background-active: #858299;
224
- --pds-color-tile-background-hover: #504e62;
225
- --pds-color-tile-separator: #504e62;
226
- --pds-color-toggle-button-background-off: #504e62;
227
- --pds-color-toggle-button-foreground-off: #e7e7eb;
228
- --pds-color-tooltip-background: #a6a3b4;
229
- --pds-color-tooltip-text: #121219;
230
- --pds-color-tooltip-trigger-icon-critical: #ef5c48;
231
- --pds-color-tooltip-trigger-icon-default: #e7e7eb;
232
- --pds-elevation-dropdown: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
233
- --pds-elevation-overlay: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
234
- --pds-elevation-raised: 0px 1px 1px 0px rgba(18, 18, 25, 0.95);
13
+ --pds-color-background-brand-secondary: #4e39a8;
14
+ --pds-color-background-default: #1d1d29;
15
+ --pds-color-background-default-secondary: #282839;
16
+ --pds-color-background-reverse: #e7e7eb;
17
+ --pds-color-badge-indicator-diamond-background: #f0fdff;
18
+ --pds-color-badge-indicator-diamond-foreground: #388bff;
19
+ --pds-color-badge-indicator-gold-background: #fff1a9;
20
+ --pds-color-badge-indicator-gold-foreground: #705e00;
21
+ --pds-color-badge-indicator-info-background: #388bff;
22
+ --pds-color-badge-indicator-info-foreground: #ffffff;
23
+ --pds-color-badge-indicator-neutral-background: #504e62;
24
+ --pds-color-badge-indicator-neutral-foreground: #ffffff;
25
+ --pds-color-badge-indicator-platinum-background: #d0c6ff;
26
+ --pds-color-badge-indicator-platinum-foreground: #4e39a8;
27
+ --pds-color-badge-indicator-silver-background: #a6a3b4;
28
+ --pds-color-badge-indicator-silver-foreground: var(
29
+ --pds-color-text-default-secondary
30
+ );
31
+ --pds-color-badge-indicator-success-background: #2abb7f;
32
+ --pds-color-badge-indicator-success-foreground: #ffffff;
33
+ --pds-color-badge-status-dot-critical: var(
34
+ --pds-color-semantic-critical-foreground
35
+ );
36
+ --pds-color-badge-status-dot-default: #858299;
37
+ --pds-color-badge-status-dot-disabled: #858299;
38
+ --pds-color-badge-status-dot-discovery: var(
39
+ --pds-color-semantic-discovery-foreground
40
+ );
41
+ --pds-color-badge-status-dot-frozen: #d0c6ff;
42
+ --pds-color-badge-status-dot-info: var(--pds-color-semantic-info-foreground);
43
+ --pds-color-badge-status-dot-success: var(
44
+ --pds-color-semantic-success-foreground
45
+ );
46
+ --pds-color-badge-status-dot-warning: var(
47
+ --pds-color-semantic-warning-foreground
48
+ );
49
+ --pds-color-badge-status-neutral-background: var(
50
+ --pds-color-background-default
51
+ );
52
+ --pds-color-badge-status-neutral-border: var(--pds-color-border-default);
53
+ --pds-color-badge-status-neutral-label: var(
54
+ --pds-color-text-default-secondary
55
+ );
56
+ --pds-color-badge-status-reverse-background: var(
57
+ --pds-color-background-reverse
58
+ );
59
+ --pds-color-badge-status-reverse-border: var(--pds-color-background-reverse);
60
+ --pds-color-badge-status-reverse-label: var(--pds-color-text-reverse);
61
+ --pds-color-badge-status-transparent-background: rgba(0, 0, 0, 0);
62
+ --pds-color-badge-status-transparent-border: var(--pds-color-border-default);
63
+ --pds-color-badge-status-transparent-label: var(
64
+ --pds-color-text-default-secondary
65
+ );
66
+ --pds-color-banner-critical-background: linear-gradient(
67
+ 135deg,
68
+ #ca3521 0%,
69
+ #b95898 100%
70
+ );
71
+ --pds-color-banner-critical-foreground: #ffffff;
72
+ --pds-color-banner-info-background: linear-gradient(
73
+ 315deg,
74
+ #1265da 0%,
75
+ #5f41e5 100%
76
+ );
77
+ --pds-color-banner-info-foreground: #ffffff;
78
+ --pds-color-banner-warning-background: linear-gradient(
79
+ 135deg,
80
+ #ddbd16 0%,
81
+ #db7612 100%
82
+ );
83
+ --pds-color-banner-warning-foreground: #121219;
84
+ --pds-color-border-default: #504e62;
85
+ --pds-color-brand-accent-default: #de0093;
86
+ --pds-color-brand-primary-default: #ffdc28;
87
+ --pds-color-brand-secondary-default: #8a70ff;
88
+ --pds-color-breadcrumb-link: var(--pds-color-link-default);
89
+ --pds-color-breadcrumb-separator: #858299;
90
+ --pds-color-breadcrumb-text: var(--pds-color-text-default-secondary);
91
+ --pds-color-button-brand-background-active: #ddbd16;
92
+ --pds-color-button-brand-background-default: #ffdc28;
93
+ --pds-color-button-brand-background-hover: #ffe668;
94
+ --pds-color-button-brand-border-active: #ddbd16;
95
+ --pds-color-button-brand-border-default: #ffdc28;
96
+ --pds-color-button-brand-border-hover: #ffe668;
97
+ --pds-color-button-brand-foreground-active: #121219;
98
+ --pds-color-button-brand-foreground-default: #121219;
99
+ --pds-color-button-brand-foreground-hover: #121219;
100
+ --pds-color-button-brand-secondary-background-active: #282839;
101
+ --pds-color-button-brand-secondary-background-default: rgba(0, 0, 0, 0);
102
+ --pds-color-button-brand-secondary-background-hover: #504e62;
103
+ --pds-color-button-brand-secondary-border-active: #504e62;
104
+ --pds-color-button-brand-secondary-border-default: #a6a3b4;
105
+ --pds-color-button-brand-secondary-border-hover: #ffffff;
106
+ --pds-color-button-brand-secondary-foreground-active: #e7e7eb;
107
+ --pds-color-button-brand-secondary-foreground-default: #e7e7eb;
108
+ --pds-color-button-brand-secondary-foreground-hover: #ffffff;
109
+ --pds-color-button-critical-background-active: #4b2d28;
110
+ --pds-color-button-critical-background-default: var(
111
+ --pds-color-background-default
112
+ );
113
+ --pds-color-button-critical-background-hover: var(
114
+ --pds-color-semantic-critical-background
115
+ );
116
+ --pds-color-button-critical-border-active: var(
117
+ --pds-color-semantic-critical-foreground
118
+ );
119
+ --pds-color-button-critical-border-default: var(
120
+ --pds-color-semantic-critical-foreground
121
+ );
122
+ --pds-color-button-critical-border-hover: var(
123
+ --pds-color-semantic-critical-foreground
124
+ );
125
+ --pds-color-button-critical-foreground-active: var(
126
+ --pds-color-semantic-critical-foreground
127
+ );
128
+ --pds-color-button-critical-foreground-default: var(
129
+ --pds-color-semantic-critical-foreground
130
+ );
131
+ --pds-color-button-critical-foreground-hover: var(
132
+ --pds-color-semantic-critical-foreground
133
+ );
134
+ --pds-color-button-navbar-foreground-active: var(--pds-color-link-active);
135
+ --pds-color-button-navbar-foreground-default: #ffffff;
136
+ --pds-color-button-navbar-foreground-hover: var(--pds-color-link-hover);
137
+ --pds-color-button-primary-background-active: #4e39a8;
138
+ --pds-color-button-primary-background-default: #8a70ff;
139
+ --pds-color-button-primary-background-hover: #ad9bff;
140
+ --pds-color-button-primary-border-active: #4e39a8;
141
+ --pds-color-button-primary-border-default: #8a70ff;
142
+ --pds-color-button-primary-border-hover: #ad9bff;
143
+ --pds-color-button-primary-foreground-active: #ffffff;
144
+ --pds-color-button-primary-foreground-default: #ffffff;
145
+ --pds-color-button-primary-foreground-hover: #ffffff;
146
+ --pds-color-button-secondary-background-active: #282839;
147
+ --pds-color-button-secondary-background-default: rgba(0, 0, 0, 0);
148
+ --pds-color-button-secondary-background-hover: #504e62;
149
+ --pds-color-button-secondary-border-active: #504e62;
150
+ --pds-color-button-secondary-border-default: #a6a3b4;
151
+ --pds-color-button-secondary-border-hover: #ffffff;
152
+ --pds-color-button-secondary-foreground-active: #e7e7eb;
153
+ --pds-color-button-secondary-foreground-default: #e7e7eb;
154
+ --pds-color-button-secondary-foreground-hover: #ffffff;
155
+ --pds-color-button-subtle-background-default: rgba(0, 0, 0, 0);
156
+ --pds-color-button-subtle-border-default: rgba(0, 0, 0, 0);
157
+ --pds-color-button-subtle-foreground-active: var(--pds-color-link-active);
158
+ --pds-color-button-subtle-foreground-default: #d0c6ff;
159
+ --pds-color-button-subtle-foreground-hover: var(--pds-color-link-hover);
160
+ --pds-color-card-border: #504e62;
161
+ --pds-color-code-inline-background: #282839;
162
+ --pds-color-code-inline-border: #504e62;
163
+ --pds-color-code-inline-text: #ffffff;
164
+ --pds-color-expansion-panel-hover: #282839;
165
+ --pds-color-expansion-panel-open: #282839;
166
+ --pds-color-foreground-default: #ffffff;
167
+ --pds-color-foreground-reverse: #1d1d29;
168
+ --pds-color-gradient-after-hours: linear-gradient(
169
+ 228.64deg,
170
+ #1b0874 41.87%,
171
+ #29b2ff 100%
172
+ );
173
+ --pds-color-gradient-midnight: linear-gradient(
174
+ 228.64deg,
175
+ #1b0874 46.34%,
176
+ #00e0c3 100%
177
+ );
178
+ --pds-color-gradient-sunrise: linear-gradient(
179
+ 227.79deg,
180
+ #1b0874 38.28%,
181
+ #e65f35 100%
182
+ );
183
+ --pds-color-gradient-sunset: linear-gradient(
184
+ 48.24deg,
185
+ #ef13ad 0%,
186
+ #1b0874 66.25%
187
+ );
188
+ --pds-color-icon-button-background-active: #858299;
189
+ --pds-color-icon-button-background-default: rgba(0, 0, 0, 0);
190
+ --pds-color-icon-button-background-hover: #a6a3b4;
191
+ --pds-color-icon-button-foreground-default: #ffffff;
192
+ --pds-color-input-action-background-hover: #504e62;
193
+ --pds-color-input-background-critical: #1d1d29;
194
+ --pds-color-input-background-default: #1d1d29;
195
+ --pds-color-input-background-hover: #282839;
196
+ --pds-color-input-border-critical: #ef5c48;
197
+ --pds-color-input-border-default: #858299;
198
+ --pds-color-input-border-hover: #ad9bff;
199
+ --pds-color-input-border-success: #2abb7f;
200
+ --pds-color-input-checked-background: var(--pds-color-interactive-focus);
201
+ --pds-color-input-checked-foreground: #ffffff;
202
+ --pds-color-input-foreground-critical: #ef5c48;
203
+ --pds-color-input-foreground-default: #ffffff;
204
+ --pds-color-input-foreground-success: #2abb7f;
205
+ --pds-color-input-placeholder-text: #a6a3b4;
206
+ --pds-color-input-toggle-switch-icon: #ffffff;
207
+ --pds-color-input-toggle-switch-off: #504e62;
208
+ --pds-color-input-toggle-switch-on: var(--pds-color-interactive-focus);
209
+ --pds-color-interactive-focus: #36a3ff;
210
+ --pds-color-interactive-link: #36a3ff;
211
+ --pds-color-interactive-reverse-focus: #36a3ff;
212
+ --pds-color-interactive-reverse-link: #36a3ff;
213
+ --pds-color-link-active: #8a70ff;
214
+ --pds-color-link-cta-active: #d0c6ff;
215
+ --pds-color-link-cta-default: #8a70ff;
216
+ --pds-color-link-cta-hover: #ad9bff;
217
+ --pds-color-link-default: #36a3ff;
218
+ --pds-color-link-hover: #8a70ff;
219
+ --pds-color-link-visited: #8a70ff;
220
+ --pds-color-menu-background: #282839;
221
+ --pds-color-menu-item-background-active: #858299;
222
+ --pds-color-menu-item-background-default: #282839;
223
+ --pds-color-menu-item-background-hover: #504e62;
224
+ --pds-color-menu-item-description-text: #a6a3b4;
225
+ --pds-color-menu-item-foreground: #ffffff;
226
+ --pds-color-menu-item-heading-text: #a6a3b4;
227
+ --pds-color-overlay: rgba(9, 0, 48, 0.45);
228
+ --pds-color-panel-default-background: var(--pds-color-background-default);
229
+ --pds-color-panel-default-border: var(--pds-color-border-default);
230
+ --pds-color-panel-sunken-background: #121219;
231
+ --pds-color-partner-bitbucket: #004dc0;
232
+ --pds-color-partner-drupal: #009cde;
233
+ --pds-color-partner-gatsby: #663399;
234
+ --pds-color-partner-gitlab: #ffedfb;
235
+ --pds-color-partner-nextjs: #000000;
236
+ --pds-color-partner-wordpress: #0073aa;
237
+ --pds-color-progress-complete: #2abb7f;
238
+ --pds-color-progress-empty: #a6a3b4;
239
+ --pds-color-progress-partial: #388bff;
240
+ --pds-color-semantic-critical-background: #391813;
241
+ --pds-color-semantic-critical-foreground: #ef5c48;
242
+ --pds-color-semantic-discovery-background: #231c3f;
243
+ --pds-color-semantic-discovery-foreground: #8f7ee7;
244
+ --pds-color-semantic-info-background: #082145;
245
+ --pds-color-semantic-info-foreground: #388bff;
246
+ --pds-color-semantic-success-background: #133527;
247
+ --pds-color-semantic-success-foreground: #2abb7f;
248
+ --pds-color-semantic-warning-background: #3d2e00;
249
+ --pds-color-semantic-warning-foreground: #cf9f02;
250
+ --pds-color-side-nav-background-hover: #282839;
251
+ --pds-color-stepper-completed: #8a70ff;
252
+ --pds-color-stepper-current: #8a70ff;
253
+ --pds-color-stepper-default: #858299;
254
+ --pds-color-stepper-error: #ef5c48;
255
+ --pds-color-strength-fair: #cf9f02;
256
+ --pds-color-strength-strong: #2abb7f;
257
+ --pds-color-strength-very-weak: #a6a3b4;
258
+ --pds-color-strength-weak: #ef5c48;
259
+ --pds-color-table-sort-arrow-active: #8a70ff;
260
+ --pds-color-table-sort-arrow-inactive: #a6a3b4;
261
+ --pds-color-tabs-accent: #ad9bff;
262
+ --pds-color-tag-1-background: #705e00;
263
+ --pds-color-tag-1-foreground: #fffbe9;
264
+ --pds-color-tag-10-background: #5b440a;
265
+ --pds-color-tag-10-foreground: #efeadf;
266
+ --pds-color-tag-2-background: #4e39a8;
267
+ --pds-color-tag-2-foreground: #f3f0ff;
268
+ --pds-color-tag-3-background: #560039;
269
+ --pds-color-tag-3-foreground: #ffe5f6;
270
+ --pds-color-tag-4-background: #504e62;
271
+ --pds-color-tag-4-foreground: #e7e7eb;
272
+ --pds-color-tag-5-background: #700000;
273
+ --pds-color-tag-5-foreground: #ffebeb;
274
+ --pds-color-tag-6-background: #b15902;
275
+ --pds-color-tag-6-foreground: #fffae6;
276
+ --pds-color-tag-7-background: #164b35;
277
+ --pds-color-tag-7-foreground: #dffcf0;
278
+ --pds-color-tag-8-background: #0f5f6a;
279
+ --pds-color-tag-8-foreground: #f0fdff;
280
+ --pds-color-tag-9-background: #0155cc;
281
+ --pds-color-tag-9-foreground: #082145;
282
+ --pds-color-tag-remove-button: #a6a3b4;
283
+ --pds-color-text-default: var(--pds-color-foreground-default);
284
+ --pds-color-text-default-secondary: #a6a3b4;
285
+ --pds-color-text-reverse: var(--pds-color-foreground-reverse);
286
+ --pds-color-tile-background-active: #858299;
287
+ --pds-color-tile-background-hover: #504e62;
288
+ --pds-color-tile-separator: #504e62;
289
+ --pds-color-toggle-button-background-off: #504e62;
290
+ --pds-color-toggle-button-foreground-off: #e7e7eb;
291
+ --pds-color-tooltip-background: #a6a3b4;
292
+ --pds-color-tooltip-text: #121219;
293
+ --pds-color-tooltip-trigger-icon-critical: #ef5c48;
294
+ --pds-color-tooltip-trigger-icon-default: #e7e7eb;
295
+ --pds-elevation-dropdown: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
296
+ --pds-elevation-overlay: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
297
+ --pds-elevation-raised: 0px 1px 1px 0px rgba(18, 18, 25, 0.95);
235
298
  }
@@ -197,6 +197,7 @@
197
197
  --pds-color-semantic-success-foreground: #218c5f;
198
198
  --pds-color-semantic-warning-background: #fff7d6;
199
199
  --pds-color-semantic-warning-foreground: #d97008;
200
+ --pds-color-side-nav-background-hover: #f0edfb;
200
201
  --pds-color-stepper-completed: #3017a1;
201
202
  --pds-color-stepper-current: #3017a1;
202
203
  --pds-color-stepper-default: #cfcfd3;
@@ -6971,6 +6971,37 @@
6971
6971
  }
6972
6972
  }
6973
6973
  },
6974
+ "side-nav": {
6975
+ "background": {
6976
+ "hover": {
6977
+ "value": "#282839",
6978
+ "public": true,
6979
+ "isReferenceToInternal": true,
6980
+ "filePath": "tokens/color/alias/menu.dark.json",
6981
+ "isSource": true,
6982
+ "original": {
6983
+ "value": "{color.dark-mode.neutral.500.value}",
6984
+ "public": true,
6985
+ "isReferenceToInternal": true
6986
+ },
6987
+ "name": "color-dark-mode-side-nav-background-hover",
6988
+ "attributes": {
6989
+ "category": "color",
6990
+ "type": "dark-mode",
6991
+ "item": "side-nav",
6992
+ "subitem": "background",
6993
+ "state": "hover"
6994
+ },
6995
+ "path": [
6996
+ "color",
6997
+ "dark-mode",
6998
+ "side-nav",
6999
+ "background",
7000
+ "hover"
7001
+ ]
7002
+ }
7003
+ }
7004
+ },
6974
7005
  "panel": {
6975
7006
  "default": {
6976
7007
  "background": {
@@ -13693,6 +13724,37 @@
13693
13724
  }
13694
13725
  }
13695
13726
  },
13727
+ "side-nav": {
13728
+ "background": {
13729
+ "hover": {
13730
+ "value": "#f0edfb",
13731
+ "public": true,
13732
+ "isReferenceToInternal": true,
13733
+ "filePath": "tokens/color/alias/menu.light.json",
13734
+ "isSource": true,
13735
+ "original": {
13736
+ "value": "{color.light-mode.brand.secondary.100.value}",
13737
+ "public": true,
13738
+ "isReferenceToInternal": true
13739
+ },
13740
+ "name": "color-light-mode-side-nav-background-hover",
13741
+ "attributes": {
13742
+ "category": "color",
13743
+ "type": "light-mode",
13744
+ "item": "side-nav",
13745
+ "subitem": "background",
13746
+ "state": "hover"
13747
+ },
13748
+ "path": [
13749
+ "color",
13750
+ "light-mode",
13751
+ "side-nav",
13752
+ "background",
13753
+ "hover"
13754
+ ]
13755
+ }
13756
+ }
13757
+ },
13696
13758
  "pager": {
13697
13759
  "background": {
13698
13760
  "hover": {
@@ -4122,6 +4122,37 @@
4122
4122
  }
4123
4123
  }
4124
4124
  },
4125
+ "side-nav": {
4126
+ "background": {
4127
+ "hover": {
4128
+ "value": "#282839",
4129
+ "public": true,
4130
+ "isReferenceToInternal": true,
4131
+ "filePath": "tokens/color/alias/menu.dark.json",
4132
+ "isSource": true,
4133
+ "original": {
4134
+ "value": "{color.dark-mode.neutral.500.value}",
4135
+ "public": true,
4136
+ "isReferenceToInternal": true
4137
+ },
4138
+ "name": "color-dark-mode-side-nav-background-hover",
4139
+ "attributes": {
4140
+ "category": "color",
4141
+ "type": "dark-mode",
4142
+ "item": "side-nav",
4143
+ "subitem": "background",
4144
+ "state": "hover"
4145
+ },
4146
+ "path": [
4147
+ "color",
4148
+ "dark-mode",
4149
+ "side-nav",
4150
+ "background",
4151
+ "hover"
4152
+ ]
4153
+ }
4154
+ }
4155
+ },
4125
4156
  "panel": {
4126
4157
  "default": {
4127
4158
  "background": {
@@ -4122,6 +4122,37 @@
4122
4122
  }
4123
4123
  }
4124
4124
  },
4125
+ "side-nav": {
4126
+ "background": {
4127
+ "hover": {
4128
+ "value": "#f0edfb",
4129
+ "public": true,
4130
+ "isReferenceToInternal": true,
4131
+ "filePath": "tokens/color/alias/menu.light.json",
4132
+ "isSource": true,
4133
+ "original": {
4134
+ "value": "{color.light-mode.brand.secondary.100.value}",
4135
+ "public": true,
4136
+ "isReferenceToInternal": true
4137
+ },
4138
+ "name": "color-light-mode-side-nav-background-hover",
4139
+ "attributes": {
4140
+ "category": "color",
4141
+ "type": "light-mode",
4142
+ "item": "side-nav",
4143
+ "subitem": "background",
4144
+ "state": "hover"
4145
+ },
4146
+ "path": [
4147
+ "color",
4148
+ "light-mode",
4149
+ "side-nav",
4150
+ "background",
4151
+ "hover"
4152
+ ]
4153
+ }
4154
+ }
4155
+ },
4125
4156
  "pager": {
4126
4157
  "background": {
4127
4158
  "hover": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pantheon-systems/pds-design-tokens",
3
- "version": "1.0.0-dev.119",
3
+ "version": "1.0.0-dev.120",
4
4
  "description": "Design Tokens for the Pantheon Design System",
5
5
  "homepage": "https://pantheon.io",
6
6
  "keywords": [