@patternfly/design-tokens 1.13.1 → 1.14.0

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.
Files changed (36) hide show
  1. package/build/css/tokens-charts-dark.scss +2 -2
  2. package/build/css/tokens-charts.scss +2 -2
  3. package/build/css/tokens-dark.scss +21 -5
  4. package/build/css/tokens-default.scss +90 -30
  5. package/build/css/tokens-highcontrast-dark.scss +392 -0
  6. package/build/css/tokens-highcontrast.scss +427 -0
  7. package/build/css/tokens-palette.scss +8 -2
  8. package/build.js +15 -1
  9. package/config.highcontrast.dark.json +23 -0
  10. package/config.highcontrast.json +24 -0
  11. package/config.palette-colors.json +1 -1
  12. package/package.json +1 -1
  13. package/patternfly-docs/content/token-layers-dark.json +4308 -966
  14. package/patternfly-docs/content/token-layers-default.json +4382 -1485
  15. package/patternfly-docs/content/tokensTable.css +16 -3
  16. package/patternfly-docs/content/tokensTable.js +7 -5
  17. package/plugins/export-patternfly-tokens/dist/code.js +87 -0
  18. package/plugins/export-patternfly-tokens/dist/ui.html +34212 -0
  19. package/plugins/export-patternfly-tokens/src/ui.tsx +12 -4
  20. package/tokens/dark/base.dark.json +36 -0
  21. package/tokens/dark/charts.dark.json +8 -8
  22. package/tokens/dark/palette.color.json +24 -0
  23. package/tokens/dark/semantic.dark.json +51 -9
  24. package/tokens/default/base.dimension.json +38 -6
  25. package/tokens/default/base.json +171 -3
  26. package/tokens/default/charts.json +8 -8
  27. package/tokens/default/palette.color.json +24 -0
  28. package/tokens/default/semantic.dimension.json +69 -48
  29. package/tokens/default/semantic.json +51 -9
  30. package/tokens/default/semantic.motion.json +28 -28
  31. package/tokens/highcontrast/base.json +559 -0
  32. package/tokens/highcontrast/palette.color.json +319 -0
  33. package/tokens/highcontrast/semantic.highcontrast.json +1758 -0
  34. package/tokens/highcontrast-dark/base.dark.json +421 -0
  35. package/tokens/highcontrast-dark/palette.color.json +319 -0
  36. package/tokens/highcontrast-dark/semantic.highcontrast.dark.json +1758 -0
@@ -0,0 +1,392 @@
1
+
2
+ // Do not edit directly
3
+ // Generated on Thu, 29 May 2025 14:58:29 GMT
4
+
5
+ :root {
6
+ --pf-t--global--background--color--action--plain--default: rgba(0, 0, 0, 0.0000);
7
+ --pf-t--global--dark--background--color--500: rgba(21, 21, 21, 0.8000);
8
+ --pf-t--global--dark--background--color--600: rgba(199, 199, 199, 0.1500);
9
+ --pf-t--global--dark--box-shadow--color--100: rgba(0, 0, 0, 0.5000);
10
+ --pf-t--global--dark--box-shadow--color--200: rgba(0, 0, 0, 0.7000);
11
+ --pf-t--global--background--color--action--plain--clicked: var(--pf-t--global--dark--background--color--600);
12
+ --pf-t--global--background--color--action--plain--hover: var(--pf-t--global--dark--background--color--600);
13
+ --pf-t--global--background--color--backdrop--default: var(--pf-t--global--dark--background--color--500);
14
+ --pf-t--global--background--color--primary--default: var(--pf-t--color--black);
15
+ --pf-t--global--background--color--tertiary--default: var(--pf-t--global--dark--background--color--600);
16
+ --pf-t--global--border--color--default: var(--pf-t--color--gray--30);
17
+ --pf-t--global--border--color--on-secondary: var(--pf-t--color--gray--60);
18
+ --pf-t--global--box-shadow--color--lg--default: var(--pf-t--global--dark--box-shadow--color--100);
19
+ --pf-t--global--box-shadow--color--lg--directional: var(--pf-t--global--dark--box-shadow--color--200);
20
+ --pf-t--global--box-shadow--color--md--default: var(--pf-t--global--dark--box-shadow--color--100);
21
+ --pf-t--global--box-shadow--color--md--directional: var(--pf-t--global--dark--box-shadow--color--200);
22
+ --pf-t--global--box-shadow--color--sm--default: var(--pf-t--global--dark--box-shadow--color--100);
23
+ --pf-t--global--box-shadow--color--sm--directional: var(--pf-t--global--dark--box-shadow--color--200);
24
+ --pf-t--global--dark--background--color--100: var(--pf-t--color--gray--95);
25
+ --pf-t--global--dark--background--color--200: var(--pf-t--color--gray--80);
26
+ --pf-t--global--dark--background--color--300: var(--pf-t--color--gray--70);
27
+ --pf-t--global--dark--background--color--400: var(--pf-t--color--gray--10);
28
+ --pf-t--global--dark--background--color--450: var(--pf-t--color--gray--20);
29
+ --pf-t--global--dark--background--color--highlight--100: var(--pf-t--color--yellow--20);
30
+ --pf-t--global--dark--background--color--highlight--200: var(--pf-t--color--yellow--30);
31
+ --pf-t--global--dark--border--color--100: var(--pf-t--color--gray--50);
32
+ --pf-t--global--dark--border--color--200: var(--pf-t--color--gray--40);
33
+ --pf-t--global--dark--border--color--50: var(--pf-t--color--gray--60);
34
+ --pf-t--global--dark--color--brand--100: var(--pf-t--color--blue--30);
35
+ --pf-t--global--dark--color--brand--200: var(--pf-t--color--blue--20);
36
+ --pf-t--global--dark--color--brand--300: var(--pf-t--color--blue--10);
37
+ --pf-t--global--dark--color--disabled--100: var(--pf-t--color--gray--40);
38
+ --pf-t--global--dark--color--disabled--200: var(--pf-t--color--gray--50);
39
+ --pf-t--global--dark--color--disabled--300: var(--pf-t--color--gray--70);
40
+ --pf-t--global--dark--color--disabled--400: var(--pf-t--color--gray--90);
41
+ --pf-t--global--dark--color--favorite--100: var(--pf-t--color--yellow--30);
42
+ --pf-t--global--dark--color--favorite--200: var(--pf-t--color--yellow--20);
43
+ --pf-t--global--dark--color--nonstatus--blue--100: var(--pf-t--color--blue--30);
44
+ --pf-t--global--dark--color--nonstatus--blue--200: var(--pf-t--color--blue--20);
45
+ --pf-t--global--dark--color--nonstatus--blue--300: var(--pf-t--color--blue--10);
46
+ --pf-t--global--dark--color--nonstatus--gray--100: var(--pf-t--color--gray--60);
47
+ --pf-t--global--dark--color--nonstatus--gray--200: var(--pf-t--color--gray--50);
48
+ --pf-t--global--dark--color--nonstatus--gray--300: var(--pf-t--color--gray--40);
49
+ --pf-t--global--dark--color--nonstatus--gray--50: var(--pf-t--color--gray--70);
50
+ --pf-t--global--dark--color--nonstatus--green--100: var(--pf-t--color--green--30);
51
+ --pf-t--global--dark--color--nonstatus--green--200: var(--pf-t--color--green--20);
52
+ --pf-t--global--dark--color--nonstatus--green--300: var(--pf-t--color--green--10);
53
+ --pf-t--global--dark--color--nonstatus--orange--100: var(--pf-t--color--orange--30);
54
+ --pf-t--global--dark--color--nonstatus--orange--200: var(--pf-t--color--orange--20);
55
+ --pf-t--global--dark--color--nonstatus--orange--300: var(--pf-t--color--orange--10);
56
+ --pf-t--global--dark--color--nonstatus--orangered--100: var(--pf-t--color--red-orange--30);
57
+ --pf-t--global--dark--color--nonstatus--orangered--200: var(--pf-t--color--red-orange--20);
58
+ --pf-t--global--dark--color--nonstatus--orangered--300: var(--pf-t--color--red-orange--10);
59
+ --pf-t--global--dark--color--nonstatus--purple--100: var(--pf-t--color--purple--30);
60
+ --pf-t--global--dark--color--nonstatus--purple--200: var(--pf-t--color--purple--20);
61
+ --pf-t--global--dark--color--nonstatus--purple--300: var(--pf-t--color--purple--10);
62
+ --pf-t--global--dark--color--nonstatus--red--100: var(--pf-t--color--red--30);
63
+ --pf-t--global--dark--color--nonstatus--red--200: var(--pf-t--color--red--20);
64
+ --pf-t--global--dark--color--nonstatus--red--300: var(--pf-t--color--red--10);
65
+ --pf-t--global--dark--color--nonstatus--teal--100: var(--pf-t--color--teal--30);
66
+ --pf-t--global--dark--color--nonstatus--teal--200: var(--pf-t--color--teal--20);
67
+ --pf-t--global--dark--color--nonstatus--teal--300: var(--pf-t--color--teal--10);
68
+ --pf-t--global--dark--color--nonstatus--yellow--100: var(--pf-t--color--yellow--30);
69
+ --pf-t--global--dark--color--nonstatus--yellow--200: var(--pf-t--color--yellow--20);
70
+ --pf-t--global--dark--color--nonstatus--yellow--300: var(--pf-t--color--yellow--10);
71
+ --pf-t--global--dark--color--severity--critical--100: var(--pf-t--color--red-orange--50);
72
+ --pf-t--global--dark--color--severity--critical--200: var(--pf-t--color--red-orange--40);
73
+ --pf-t--global--dark--color--severity--important--100: var(--pf-t--color--orange--40);
74
+ --pf-t--global--dark--color--severity--minor--100: var(--pf-t--color--gray--30);
75
+ --pf-t--global--dark--color--severity--moderate--100: var(--pf-t--color--yellow--30);
76
+ --pf-t--global--dark--color--severity--none--100: var(--pf-t--color--blue--30);
77
+ --pf-t--global--dark--color--severity--undefined--100: var(--pf-t--color--gray--40);
78
+ --pf-t--global--dark--color--status--custom--100: var(--pf-t--color--teal--40);
79
+ --pf-t--global--dark--color--status--custom--200: var(--pf-t--color--teal--30);
80
+ --pf-t--global--dark--color--status--custom--300: var(--pf-t--color--teal--20);
81
+ --pf-t--global--dark--color--status--danger--100: var(--pf-t--color--red-orange--50);
82
+ --pf-t--global--dark--color--status--danger--200: var(--pf-t--color--red-orange--40);
83
+ --pf-t--global--dark--color--status--danger--250: var(--pf-t--color--red-orange--30);
84
+ --pf-t--global--dark--color--status--danger--300: var(--pf-t--color--red-orange--20);
85
+ --pf-t--global--dark--color--status--info--100: var(--pf-t--color--purple--30);
86
+ --pf-t--global--dark--color--status--info--200: var(--pf-t--color--purple--20);
87
+ --pf-t--global--dark--color--status--info--300: var(--pf-t--color--purple--10);
88
+ --pf-t--global--dark--color--status--success--100: var(--pf-t--color--green--40);
89
+ --pf-t--global--dark--color--status--success--200: var(--pf-t--color--green--30);
90
+ --pf-t--global--dark--color--status--success--300: var(--pf-t--color--green--20);
91
+ --pf-t--global--dark--color--status--warning--100: var(--pf-t--color--yellow--30);
92
+ --pf-t--global--dark--color--status--warning--200: var(--pf-t--color--yellow--20);
93
+ --pf-t--global--dark--icon--color--100: var(--pf-t--color--gray--10);
94
+ --pf-t--global--dark--icon--color--200: var(--pf-t--color--gray--40);
95
+ --pf-t--global--dark--icon--color--300: var(--pf-t--color--gray--90);
96
+ --pf-t--global--dark--text--color--100: var(--pf-t--color--white);
97
+ --pf-t--global--dark--text--color--200: var(--pf-t--color--gray--30);
98
+ --pf-t--global--dark--text--color--300: var(--pf-t--color--gray--90);
99
+ --pf-t--global--dark--text--color--400: var(--pf-t--color--red-orange--30);
100
+ --pf-t--global--dark--text--color--link--100: var(--pf-t--color--blue--20);
101
+ --pf-t--global--dark--text--color--link--200: var(--pf-t--color--blue--10);
102
+ --pf-t--global--dark--text--color--link--300: var(--pf-t--color--purple--30);
103
+ --pf-t--global--dark--text--color--link--400: var(--pf-t--color--purple--20);
104
+ --pf-t--global--background--color--action--plain--alt--clicked: var(--pf-t--global--background--color--primary--default);
105
+ --pf-t--global--background--color--action--plain--alt--hover: var(--pf-t--global--background--color--primary--default);
106
+ --pf-t--global--background--color--control--default: var(--pf-t--global--dark--background--color--100);
107
+ --pf-t--global--background--color--control--read-only: var(--pf-t--global--dark--background--color--300);
108
+ --pf-t--global--background--color--disabled--default: var(--pf-t--global--dark--color--disabled--200);
109
+ --pf-t--global--background--color--floating--clicked: var(--pf-t--global--dark--background--color--300);
110
+ --pf-t--global--background--color--floating--default: var(--pf-t--global--dark--background--color--200);
111
+ --pf-t--global--background--color--floating--hover: var(--pf-t--global--dark--background--color--300);
112
+ --pf-t--global--background--color--highlight--clicked: var(--pf-t--global--dark--background--color--highlight--200);
113
+ --pf-t--global--background--color--highlight--default: var(--pf-t--global--dark--background--color--highlight--100);
114
+ --pf-t--global--background--color--inverse--clicked: var(--pf-t--global--dark--background--color--450);
115
+ --pf-t--global--background--color--inverse--default: var(--pf-t--global--dark--background--color--400);
116
+ --pf-t--global--background--color--inverse--hover: var(--pf-t--global--dark--background--color--450);
117
+ --pf-t--global--background--color--primary--clicked: var(--pf-t--global--dark--background--color--100);
118
+ --pf-t--global--background--color--primary--hover: var(--pf-t--global--dark--background--color--100);
119
+ --pf-t--global--background--color--secondary--clicked: var(--pf-t--global--dark--background--color--200);
120
+ --pf-t--global--background--color--secondary--default: var(--pf-t--global--dark--background--color--100);
121
+ --pf-t--global--background--color--secondary--hover: var(--pf-t--global--dark--background--color--200);
122
+ --pf-t--global--border--color--alt: var(--pf-t--global--background--color--primary--default);
123
+ --pf-t--global--border--color--clicked: var(--pf-t--global--dark--color--brand--200);
124
+ --pf-t--global--border--color--control--read-only: var(--pf-t--global--dark--border--color--50);
125
+ --pf-t--global--border--color--disabled: var(--pf-t--global--dark--color--disabled--200);
126
+ --pf-t--global--border--color--high-contrast: var(--pf-t--global--border--color--default);
127
+ --pf-t--global--border--color--hover: var(--pf-t--global--dark--color--brand--100);
128
+ --pf-t--global--border--color--nonstatus--blue--clicked: var(--pf-t--global--dark--color--nonstatus--blue--200);
129
+ --pf-t--global--border--color--nonstatus--blue--default: var(--pf-t--global--dark--color--nonstatus--blue--100);
130
+ --pf-t--global--border--color--nonstatus--blue--hover: var(--pf-t--global--dark--color--nonstatus--blue--200);
131
+ --pf-t--global--border--color--nonstatus--gray--clicked: var(--pf-t--global--dark--color--nonstatus--gray--300);
132
+ --pf-t--global--border--color--nonstatus--gray--default: var(--pf-t--global--dark--color--nonstatus--gray--200);
133
+ --pf-t--global--border--color--nonstatus--gray--hover: var(--pf-t--global--dark--color--nonstatus--gray--300);
134
+ --pf-t--global--border--color--nonstatus--green--clicked: var(--pf-t--global--dark--color--nonstatus--green--200);
135
+ --pf-t--global--border--color--nonstatus--green--default: var(--pf-t--global--dark--color--nonstatus--green--100);
136
+ --pf-t--global--border--color--nonstatus--green--hover: var(--pf-t--global--dark--color--nonstatus--green--200);
137
+ --pf-t--global--border--color--nonstatus--orange--clicked: var(--pf-t--global--dark--color--nonstatus--orange--200);
138
+ --pf-t--global--border--color--nonstatus--orange--default: var(--pf-t--global--dark--color--nonstatus--orange--100);
139
+ --pf-t--global--border--color--nonstatus--orange--hover: var(--pf-t--global--dark--color--nonstatus--orange--200);
140
+ --pf-t--global--border--color--nonstatus--orangered--clicked: var(--pf-t--global--dark--color--nonstatus--orangered--200);
141
+ --pf-t--global--border--color--nonstatus--orangered--default: var(--pf-t--global--dark--color--nonstatus--orangered--100);
142
+ --pf-t--global--border--color--nonstatus--orangered--hover: var(--pf-t--global--dark--color--nonstatus--orangered--200);
143
+ --pf-t--global--border--color--nonstatus--purple--clicked: var(--pf-t--global--dark--color--nonstatus--purple--200);
144
+ --pf-t--global--border--color--nonstatus--purple--default: var(--pf-t--global--dark--color--nonstatus--purple--100);
145
+ --pf-t--global--border--color--nonstatus--purple--hover: var(--pf-t--global--dark--color--nonstatus--purple--200);
146
+ --pf-t--global--border--color--nonstatus--red--clicked: var(--pf-t--global--dark--color--nonstatus--red--200);
147
+ --pf-t--global--border--color--nonstatus--red--default: var(--pf-t--global--dark--color--nonstatus--red--100);
148
+ --pf-t--global--border--color--nonstatus--red--hover: var(--pf-t--global--dark--color--nonstatus--red--200);
149
+ --pf-t--global--border--color--nonstatus--teal--clicked: var(--pf-t--global--dark--color--nonstatus--teal--200);
150
+ --pf-t--global--border--color--nonstatus--teal--default: var(--pf-t--global--dark--color--nonstatus--teal--100);
151
+ --pf-t--global--border--color--nonstatus--teal--hover: var(--pf-t--global--dark--color--nonstatus--teal--200);
152
+ --pf-t--global--border--color--nonstatus--yellow--clicked: var(--pf-t--global--dark--color--nonstatus--yellow--200);
153
+ --pf-t--global--border--color--nonstatus--yellow--default: var(--pf-t--global--dark--color--nonstatus--yellow--100);
154
+ --pf-t--global--border--color--nonstatus--yellow--hover: var(--pf-t--global--dark--color--nonstatus--yellow--200);
155
+ --pf-t--global--color--brand--clicked: var(--pf-t--global--dark--color--brand--200);
156
+ --pf-t--global--color--brand--default: var(--pf-t--global--dark--color--brand--100);
157
+ --pf-t--global--color--brand--hover: var(--pf-t--global--dark--color--brand--200);
158
+ --pf-t--global--color--favorite--clicked: var(--pf-t--global--dark--color--favorite--200);
159
+ --pf-t--global--color--favorite--default: var(--pf-t--global--dark--color--favorite--100);
160
+ --pf-t--global--color--favorite--hover: var(--pf-t--global--dark--color--favorite--200);
161
+ --pf-t--global--color--nonstatus--blue--clicked: var(--pf-t--global--dark--color--nonstatus--blue--200);
162
+ --pf-t--global--color--nonstatus--blue--default: var(--pf-t--global--dark--color--nonstatus--blue--100);
163
+ --pf-t--global--color--nonstatus--blue--hover: var(--pf-t--global--dark--color--nonstatus--blue--200);
164
+ --pf-t--global--color--nonstatus--gray--clicked: var(--pf-t--global--dark--color--nonstatus--gray--100);
165
+ --pf-t--global--color--nonstatus--gray--default: var(--pf-t--global--dark--color--nonstatus--gray--50);
166
+ --pf-t--global--color--nonstatus--gray--hover: var(--pf-t--global--dark--color--nonstatus--gray--100);
167
+ --pf-t--global--color--nonstatus--green--clicked: var(--pf-t--global--dark--color--nonstatus--green--200);
168
+ --pf-t--global--color--nonstatus--green--default: var(--pf-t--global--dark--color--nonstatus--green--100);
169
+ --pf-t--global--color--nonstatus--green--hover: var(--pf-t--global--dark--color--nonstatus--green--200);
170
+ --pf-t--global--color--nonstatus--orange--clicked: var(--pf-t--global--dark--color--nonstatus--orange--200);
171
+ --pf-t--global--color--nonstatus--orange--default: var(--pf-t--global--dark--color--nonstatus--orange--100);
172
+ --pf-t--global--color--nonstatus--orange--hover: var(--pf-t--global--dark--color--nonstatus--orange--200);
173
+ --pf-t--global--color--nonstatus--orangered--clicked: var(--pf-t--global--dark--color--nonstatus--orangered--200);
174
+ --pf-t--global--color--nonstatus--orangered--default: var(--pf-t--global--dark--color--nonstatus--orangered--100);
175
+ --pf-t--global--color--nonstatus--orangered--hover: var(--pf-t--global--dark--color--nonstatus--orangered--200);
176
+ --pf-t--global--color--nonstatus--purple--clicked: var(--pf-t--global--dark--color--nonstatus--purple--200);
177
+ --pf-t--global--color--nonstatus--purple--default: var(--pf-t--global--dark--color--nonstatus--purple--100);
178
+ --pf-t--global--color--nonstatus--purple--hover: var(--pf-t--global--dark--color--nonstatus--purple--200);
179
+ --pf-t--global--color--nonstatus--red--clicked: var(--pf-t--global--dark--color--nonstatus--red--200);
180
+ --pf-t--global--color--nonstatus--red--default: var(--pf-t--global--dark--color--nonstatus--red--100);
181
+ --pf-t--global--color--nonstatus--red--hover: var(--pf-t--global--dark--color--nonstatus--red--200);
182
+ --pf-t--global--color--nonstatus--teal--clicked: var(--pf-t--global--dark--color--nonstatus--teal--200);
183
+ --pf-t--global--color--nonstatus--teal--default: var(--pf-t--global--dark--color--nonstatus--teal--100);
184
+ --pf-t--global--color--nonstatus--teal--hover: var(--pf-t--global--dark--color--nonstatus--teal--200);
185
+ --pf-t--global--color--nonstatus--yellow--clicked: var(--pf-t--global--dark--color--nonstatus--yellow--200);
186
+ --pf-t--global--color--nonstatus--yellow--default: var(--pf-t--global--dark--color--nonstatus--yellow--100);
187
+ --pf-t--global--color--nonstatus--yellow--hover: var(--pf-t--global--dark--color--nonstatus--yellow--200);
188
+ --pf-t--global--color--status--custom--clicked: var(--pf-t--global--dark--color--status--custom--300);
189
+ --pf-t--global--color--status--custom--default: var(--pf-t--global--dark--color--status--custom--200);
190
+ --pf-t--global--color--status--custom--hover: var(--pf-t--global--dark--color--status--custom--300);
191
+ --pf-t--global--color--status--danger--clicked: var(--pf-t--global--dark--color--status--danger--250);
192
+ --pf-t--global--color--status--danger--default: var(--pf-t--global--dark--color--status--danger--200);
193
+ --pf-t--global--color--status--danger--hover: var(--pf-t--global--dark--color--status--danger--250);
194
+ --pf-t--global--color--status--info--clicked: var(--pf-t--global--dark--color--status--info--200);
195
+ --pf-t--global--color--status--info--default: var(--pf-t--global--dark--color--status--info--100);
196
+ --pf-t--global--color--status--info--hover: var(--pf-t--global--dark--color--status--info--200);
197
+ --pf-t--global--color--status--success--clicked: var(--pf-t--global--dark--color--status--success--300);
198
+ --pf-t--global--color--status--success--default: var(--pf-t--global--dark--color--status--success--200);
199
+ --pf-t--global--color--status--success--hover: var(--pf-t--global--dark--color--status--success--300);
200
+ --pf-t--global--color--status--warning--clicked: var(--pf-t--global--dark--color--status--warning--200);
201
+ --pf-t--global--color--status--warning--default: var(--pf-t--global--dark--color--status--warning--100);
202
+ --pf-t--global--color--status--warning--hover: var(--pf-t--global--dark--color--status--warning--200);
203
+ --pf-t--global--icon--color--brand--clicked: var(--pf-t--global--dark--color--brand--300);
204
+ --pf-t--global--icon--color--brand--default: var(--pf-t--global--dark--color--brand--200);
205
+ --pf-t--global--icon--color--brand--hover: var(--pf-t--global--dark--color--brand--300);
206
+ --pf-t--global--icon--color--disabled: var(--pf-t--global--dark--color--disabled--200);
207
+ --pf-t--global--icon--color--inverse: var(--pf-t--global--dark--icon--color--300);
208
+ --pf-t--global--icon--color--on-disabled: var(--pf-t--global--dark--color--disabled--300);
209
+ --pf-t--global--icon--color--regular: var(--pf-t--global--dark--icon--color--100);
210
+ --pf-t--global--icon--color--severity--critical--default: var(--pf-t--global--dark--color--severity--critical--200);
211
+ --pf-t--global--icon--color--severity--important--default: var(--pf-t--global--dark--color--severity--important--100);
212
+ --pf-t--global--icon--color--severity--minor--default: var(--pf-t--global--dark--color--severity--minor--100);
213
+ --pf-t--global--icon--color--severity--moderate--default: var(--pf-t--global--dark--color--severity--moderate--100);
214
+ --pf-t--global--icon--color--severity--none--default: var(--pf-t--global--dark--color--severity--none--100);
215
+ --pf-t--global--icon--color--severity--undefined--default: var(--pf-t--global--dark--color--severity--undefined--100);
216
+ --pf-t--global--icon--color--subtle: var(--pf-t--global--dark--icon--color--200);
217
+ --pf-t--global--text--color--brand--clicked: var(--pf-t--global--dark--color--brand--300);
218
+ --pf-t--global--text--color--brand--default: var(--pf-t--global--dark--color--brand--200);
219
+ --pf-t--global--text--color--brand--hover: var(--pf-t--global--dark--color--brand--300);
220
+ --pf-t--global--text--color--disabled: var(--pf-t--global--dark--color--disabled--200);
221
+ --pf-t--global--text--color--inverse: var(--pf-t--global--dark--text--color--300);
222
+ --pf-t--global--text--color--link--default: var(--pf-t--global--dark--text--color--link--100);
223
+ --pf-t--global--text--color--link--hover: var(--pf-t--global--dark--text--color--link--200);
224
+ --pf-t--global--text--color--link--visited: var(--pf-t--global--dark--text--color--link--400);
225
+ --pf-t--global--text--color--on-disabled: var(--pf-t--global--dark--color--disabled--400);
226
+ --pf-t--global--text--color--on-highlight: var(--pf-t--global--dark--text--color--300);
227
+ --pf-t--global--text--color--regular: var(--pf-t--global--dark--text--color--100);
228
+ --pf-t--global--text--color--required: var(--pf-t--global--dark--text--color--400);
229
+ --pf-t--global--text--color--status--danger--clicked: var(--pf-t--global--dark--color--status--danger--300);
230
+ --pf-t--global--text--color--status--danger--default: var(--pf-t--global--dark--color--status--danger--300);
231
+ --pf-t--global--text--color--status--danger--hover: var(--pf-t--global--dark--color--status--danger--300);
232
+ --pf-t--global--text--color--subtle: var(--pf-t--global--dark--text--color--200);
233
+ --pf-t--global--border--color--brand--clicked: var(--pf-t--global--color--brand--clicked);
234
+ --pf-t--global--border--color--brand--default: var(--pf-t--global--color--brand--default);
235
+ --pf-t--global--border--color--brand--hover: var(--pf-t--global--color--brand--hover);
236
+ --pf-t--global--border--color--status--custom--clicked: var(--pf-t--global--color--status--custom--clicked);
237
+ --pf-t--global--border--color--status--custom--default: var(--pf-t--global--color--status--custom--default);
238
+ --pf-t--global--border--color--status--custom--hover: var(--pf-t--global--color--status--custom--hover);
239
+ --pf-t--global--border--color--status--danger--clicked: var(--pf-t--global--color--status--danger--clicked);
240
+ --pf-t--global--border--color--status--danger--default: var(--pf-t--global--color--status--danger--default);
241
+ --pf-t--global--border--color--status--danger--hover: var(--pf-t--global--color--status--danger--hover);
242
+ --pf-t--global--border--color--status--info--clicked: var(--pf-t--global--color--status--info--clicked);
243
+ --pf-t--global--border--color--status--info--default: var(--pf-t--global--color--status--info--default);
244
+ --pf-t--global--border--color--status--info--hover: var(--pf-t--global--color--status--info--hover);
245
+ --pf-t--global--border--color--status--success--clicked: var(--pf-t--global--color--status--success--clicked);
246
+ --pf-t--global--border--color--status--success--default: var(--pf-t--global--color--status--success--default);
247
+ --pf-t--global--border--color--status--success--hover: var(--pf-t--global--color--status--success--hover);
248
+ --pf-t--global--border--color--status--warning--clicked: var(--pf-t--global--color--status--warning--clicked);
249
+ --pf-t--global--border--color--status--warning--default: var(--pf-t--global--color--status--warning--default);
250
+ --pf-t--global--border--color--status--warning--hover: var(--pf-t--global--color--status--warning--hover);
251
+ --pf-t--global--color--status--read--on-primary: var(--pf-t--global--background--color--secondary--default);
252
+ --pf-t--global--color--status--read--on-secondary: var(--pf-t--global--background--color--control--default);
253
+ --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
254
+ --pf-t--global--color--status--unread--attention--default: var(--pf-t--global--color--status--danger--default);
255
+ --pf-t--global--color--status--unread--attention--hover: var(--pf-t--global--color--status--danger--hover);
256
+ --pf-t--global--color--status--unread--clicked: var(--pf-t--global--color--brand--clicked);
257
+ --pf-t--global--color--status--unread--default: var(--pf-t--global--color--brand--default);
258
+ --pf-t--global--color--status--unread--hover: var(--pf-t--global--color--brand--hover);
259
+ --pf-t--global--icon--color--favorite--clicked: var(--pf-t--global--color--favorite--clicked);
260
+ --pf-t--global--icon--color--favorite--default: var(--pf-t--global--color--favorite--default);
261
+ --pf-t--global--icon--color--favorite--hover: var(--pf-t--global--color--favorite--hover);
262
+ --pf-t--global--icon--color--nonstatus--on-blue--clicked: var(--pf-t--global--icon--color--inverse);
263
+ --pf-t--global--icon--color--nonstatus--on-blue--default: var(--pf-t--global--icon--color--inverse);
264
+ --pf-t--global--icon--color--nonstatus--on-blue--hover: var(--pf-t--global--icon--color--inverse);
265
+ --pf-t--global--icon--color--nonstatus--on-gray--clicked: var(--pf-t--global--icon--color--regular);
266
+ --pf-t--global--icon--color--nonstatus--on-gray--default: var(--pf-t--global--icon--color--regular);
267
+ --pf-t--global--icon--color--nonstatus--on-gray--hover: var(--pf-t--global--icon--color--regular);
268
+ --pf-t--global--icon--color--nonstatus--on-green--clicked: var(--pf-t--global--icon--color--inverse);
269
+ --pf-t--global--icon--color--nonstatus--on-green--default: var(--pf-t--global--icon--color--inverse);
270
+ --pf-t--global--icon--color--nonstatus--on-green--hover: var(--pf-t--global--icon--color--inverse);
271
+ --pf-t--global--icon--color--nonstatus--on-orange--clicked: var(--pf-t--global--icon--color--inverse);
272
+ --pf-t--global--icon--color--nonstatus--on-orange--default: var(--pf-t--global--icon--color--inverse);
273
+ --pf-t--global--icon--color--nonstatus--on-orange--hover: var(--pf-t--global--icon--color--inverse);
274
+ --pf-t--global--icon--color--nonstatus--on-orangered--clicked: var(--pf-t--global--icon--color--inverse);
275
+ --pf-t--global--icon--color--nonstatus--on-orangered--default: var(--pf-t--global--icon--color--inverse);
276
+ --pf-t--global--icon--color--nonstatus--on-orangered--hover: var(--pf-t--global--icon--color--inverse);
277
+ --pf-t--global--icon--color--nonstatus--on-purple--clicked: var(--pf-t--global--icon--color--inverse);
278
+ --pf-t--global--icon--color--nonstatus--on-purple--default: var(--pf-t--global--icon--color--inverse);
279
+ --pf-t--global--icon--color--nonstatus--on-purple--hover: var(--pf-t--global--icon--color--inverse);
280
+ --pf-t--global--icon--color--nonstatus--on-red--clicked: var(--pf-t--global--icon--color--inverse);
281
+ --pf-t--global--icon--color--nonstatus--on-red--default: var(--pf-t--global--icon--color--inverse);
282
+ --pf-t--global--icon--color--nonstatus--on-red--hover: var(--pf-t--global--icon--color--inverse);
283
+ --pf-t--global--icon--color--nonstatus--on-teal--clicked: var(--pf-t--global--icon--color--inverse);
284
+ --pf-t--global--icon--color--nonstatus--on-teal--default: var(--pf-t--global--icon--color--inverse);
285
+ --pf-t--global--icon--color--nonstatus--on-teal--hover: var(--pf-t--global--icon--color--inverse);
286
+ --pf-t--global--icon--color--nonstatus--on-yellow--clicked: var(--pf-t--global--icon--color--inverse);
287
+ --pf-t--global--icon--color--nonstatus--on-yellow--default: var(--pf-t--global--icon--color--inverse);
288
+ --pf-t--global--icon--color--nonstatus--on-yellow--hover: var(--pf-t--global--icon--color--inverse);
289
+ --pf-t--global--icon--color--on-brand--clicked: var(--pf-t--global--icon--color--inverse);
290
+ --pf-t--global--icon--color--on-brand--default: var(--pf-t--global--icon--color--inverse);
291
+ --pf-t--global--icon--color--on-brand--hover: var(--pf-t--global--icon--color--inverse);
292
+ --pf-t--global--icon--color--status--custom--clicked: var(--pf-t--global--color--status--custom--clicked);
293
+ --pf-t--global--icon--color--status--custom--default: var(--pf-t--global--color--status--custom--default);
294
+ --pf-t--global--icon--color--status--custom--hover: var(--pf-t--global--color--status--custom--hover);
295
+ --pf-t--global--icon--color--status--danger--clicked: var(--pf-t--global--color--status--danger--clicked);
296
+ --pf-t--global--icon--color--status--danger--default: var(--pf-t--global--color--status--danger--default);
297
+ --pf-t--global--icon--color--status--danger--hover: var(--pf-t--global--color--status--danger--hover);
298
+ --pf-t--global--icon--color--status--info--clicked: var(--pf-t--global--color--status--info--clicked);
299
+ --pf-t--global--icon--color--status--info--default: var(--pf-t--global--color--status--info--default);
300
+ --pf-t--global--icon--color--status--info--hover: var(--pf-t--global--color--status--info--hover);
301
+ --pf-t--global--icon--color--status--on-custom--clicked: var(--pf-t--global--icon--color--inverse);
302
+ --pf-t--global--icon--color--status--on-custom--default: var(--pf-t--global--icon--color--inverse);
303
+ --pf-t--global--icon--color--status--on-custom--hover: var(--pf-t--global--icon--color--inverse);
304
+ --pf-t--global--icon--color--status--on-danger--clicked: var(--pf-t--global--icon--color--inverse);
305
+ --pf-t--global--icon--color--status--on-danger--default: var(--pf-t--global--icon--color--inverse);
306
+ --pf-t--global--icon--color--status--on-danger--hover: var(--pf-t--global--icon--color--inverse);
307
+ --pf-t--global--icon--color--status--on-info--clicked: var(--pf-t--global--icon--color--inverse);
308
+ --pf-t--global--icon--color--status--on-info--default: var(--pf-t--global--icon--color--inverse);
309
+ --pf-t--global--icon--color--status--on-info--hover: var(--pf-t--global--icon--color--inverse);
310
+ --pf-t--global--icon--color--status--on-success--clicked: var(--pf-t--global--icon--color--inverse);
311
+ --pf-t--global--icon--color--status--on-success--default: var(--pf-t--global--icon--color--inverse);
312
+ --pf-t--global--icon--color--status--on-success--hover: var(--pf-t--global--icon--color--inverse);
313
+ --pf-t--global--icon--color--status--on-warning--clicked: var(--pf-t--global--icon--color--inverse);
314
+ --pf-t--global--icon--color--status--on-warning--default: var(--pf-t--global--icon--color--inverse);
315
+ --pf-t--global--icon--color--status--on-warning--hover: var(--pf-t--global--icon--color--inverse);
316
+ --pf-t--global--icon--color--status--success--clicked: var(--pf-t--global--color--status--success--clicked);
317
+ --pf-t--global--icon--color--status--success--default: var(--pf-t--global--color--status--success--default);
318
+ --pf-t--global--icon--color--status--success--hover: var(--pf-t--global--color--status--success--hover);
319
+ --pf-t--global--icon--color--status--unread--on-attention--clicked: var(--pf-t--global--icon--color--inverse);
320
+ --pf-t--global--icon--color--status--unread--on-attention--default: var(--pf-t--global--icon--color--inverse);
321
+ --pf-t--global--icon--color--status--unread--on-attention--hover: var(--pf-t--global--icon--color--inverse);
322
+ --pf-t--global--icon--color--status--unread--on-default--clicked: var(--pf-t--global--icon--color--inverse);
323
+ --pf-t--global--icon--color--status--unread--on-default--default: var(--pf-t--global--icon--color--inverse);
324
+ --pf-t--global--icon--color--status--unread--on-default--hover: var(--pf-t--global--icon--color--inverse);
325
+ --pf-t--global--icon--color--status--warning--clicked: var(--pf-t--global--color--status--warning--clicked);
326
+ --pf-t--global--icon--color--status--warning--default: var(--pf-t--global--color--status--warning--default);
327
+ --pf-t--global--icon--color--status--warning--hover: var(--pf-t--global--color--status--warning--hover);
328
+ --pf-t--global--text--color--nonstatus--on-blue--clicked: var(--pf-t--global--text--color--inverse);
329
+ --pf-t--global--text--color--nonstatus--on-blue--default: var(--pf-t--global--text--color--inverse);
330
+ --pf-t--global--text--color--nonstatus--on-blue--hover: var(--pf-t--global--text--color--inverse);
331
+ --pf-t--global--text--color--nonstatus--on-gray--clicked: var(--pf-t--global--text--color--regular);
332
+ --pf-t--global--text--color--nonstatus--on-gray--default: var(--pf-t--global--text--color--regular);
333
+ --pf-t--global--text--color--nonstatus--on-gray--hover: var(--pf-t--global--text--color--regular);
334
+ --pf-t--global--text--color--nonstatus--on-green--clicked: var(--pf-t--global--text--color--inverse);
335
+ --pf-t--global--text--color--nonstatus--on-green--default: var(--pf-t--global--text--color--inverse);
336
+ --pf-t--global--text--color--nonstatus--on-green--hover: var(--pf-t--global--text--color--inverse);
337
+ --pf-t--global--text--color--nonstatus--on-orange--clicked: var(--pf-t--global--text--color--inverse);
338
+ --pf-t--global--text--color--nonstatus--on-orange--default: var(--pf-t--global--text--color--inverse);
339
+ --pf-t--global--text--color--nonstatus--on-orange--hover: var(--pf-t--global--text--color--inverse);
340
+ --pf-t--global--text--color--nonstatus--on-orangered--clicked: var(--pf-t--global--text--color--inverse);
341
+ --pf-t--global--text--color--nonstatus--on-orangered--default: var(--pf-t--global--text--color--inverse);
342
+ --pf-t--global--text--color--nonstatus--on-orangered--hover: var(--pf-t--global--text--color--inverse);
343
+ --pf-t--global--text--color--nonstatus--on-purple--clicked: var(--pf-t--global--text--color--inverse);
344
+ --pf-t--global--text--color--nonstatus--on-purple--default: var(--pf-t--global--text--color--inverse);
345
+ --pf-t--global--text--color--nonstatus--on-purple--hover: var(--pf-t--global--text--color--inverse);
346
+ --pf-t--global--text--color--nonstatus--on-red--clicked: var(--pf-t--global--text--color--inverse);
347
+ --pf-t--global--text--color--nonstatus--on-red--default: var(--pf-t--global--text--color--inverse);
348
+ --pf-t--global--text--color--nonstatus--on-red--hover: var(--pf-t--global--text--color--inverse);
349
+ --pf-t--global--text--color--nonstatus--on-teal--clicked: var(--pf-t--global--text--color--inverse);
350
+ --pf-t--global--text--color--nonstatus--on-teal--default: var(--pf-t--global--text--color--inverse);
351
+ --pf-t--global--text--color--nonstatus--on-teal--hover: var(--pf-t--global--text--color--inverse);
352
+ --pf-t--global--text--color--nonstatus--on-yellow--clicked: var(--pf-t--global--text--color--inverse);
353
+ --pf-t--global--text--color--nonstatus--on-yellow--default: var(--pf-t--global--text--color--inverse);
354
+ --pf-t--global--text--color--nonstatus--on-yellow--hover: var(--pf-t--global--text--color--inverse);
355
+ --pf-t--global--text--color--on-brand--clicked: var(--pf-t--global--text--color--inverse);
356
+ --pf-t--global--text--color--on-brand--default: var(--pf-t--global--text--color--inverse);
357
+ --pf-t--global--text--color--on-brand--hover: var(--pf-t--global--text--color--inverse);
358
+ --pf-t--global--text--color--placeholder: var(--pf-t--global--text--color--subtle);
359
+ --pf-t--global--text--color--status--custom--clicked: var(--pf-t--global--color--status--custom--clicked);
360
+ --pf-t--global--text--color--status--custom--default: var(--pf-t--global--color--status--custom--default);
361
+ --pf-t--global--text--color--status--custom--hover: var(--pf-t--global--color--status--custom--hover);
362
+ --pf-t--global--text--color--status--info--clicked: var(--pf-t--global--color--status--info--clicked);
363
+ --pf-t--global--text--color--status--info--default: var(--pf-t--global--color--status--info--default);
364
+ --pf-t--global--text--color--status--info--hover: var(--pf-t--global--color--status--info--hover);
365
+ --pf-t--global--text--color--status--on-custom--clicked: var(--pf-t--global--text--color--inverse);
366
+ --pf-t--global--text--color--status--on-custom--default: var(--pf-t--global--text--color--inverse);
367
+ --pf-t--global--text--color--status--on-custom--hover: var(--pf-t--global--text--color--inverse);
368
+ --pf-t--global--text--color--status--on-danger--clicked: var(--pf-t--global--text--color--inverse);
369
+ --pf-t--global--text--color--status--on-danger--default: var(--pf-t--global--text--color--inverse);
370
+ --pf-t--global--text--color--status--on-danger--hover: var(--pf-t--global--text--color--inverse);
371
+ --pf-t--global--text--color--status--on-info--clicked: var(--pf-t--global--text--color--inverse);
372
+ --pf-t--global--text--color--status--on-info--default: var(--pf-t--global--text--color--inverse);
373
+ --pf-t--global--text--color--status--on-info--hover: var(--pf-t--global--text--color--inverse);
374
+ --pf-t--global--text--color--status--on-success--clicked: var(--pf-t--global--text--color--inverse);
375
+ --pf-t--global--text--color--status--on-success--default: var(--pf-t--global--text--color--inverse);
376
+ --pf-t--global--text--color--status--on-success--hover: var(--pf-t--global--text--color--inverse);
377
+ --pf-t--global--text--color--status--on-warning--clicked: var(--pf-t--global--text--color--inverse);
378
+ --pf-t--global--text--color--status--on-warning--default: var(--pf-t--global--text--color--inverse);
379
+ --pf-t--global--text--color--status--on-warning--hover: var(--pf-t--global--text--color--inverse);
380
+ --pf-t--global--text--color--status--success--clicked: var(--pf-t--global--color--status--success--clicked);
381
+ --pf-t--global--text--color--status--success--default: var(--pf-t--global--color--status--success--default);
382
+ --pf-t--global--text--color--status--success--hover: var(--pf-t--global--color--status--success--hover);
383
+ --pf-t--global--text--color--status--unread--on-attention--clicked: var(--pf-t--global--text--color--inverse);
384
+ --pf-t--global--text--color--status--unread--on-attention--default: var(--pf-t--global--text--color--inverse);
385
+ --pf-t--global--text--color--status--unread--on-attention--hover: var(--pf-t--global--text--color--inverse);
386
+ --pf-t--global--text--color--status--unread--on-default--clicked: var(--pf-t--global--text--color--inverse);
387
+ --pf-t--global--text--color--status--unread--on-default--default: var(--pf-t--global--text--color--inverse);
388
+ --pf-t--global--text--color--status--unread--on-default--hover: var(--pf-t--global--text--color--inverse);
389
+ --pf-t--global--text--color--status--warning--clicked: var(--pf-t--global--color--status--warning--clicked);
390
+ --pf-t--global--text--color--status--warning--default: var(--pf-t--global--color--status--warning--default);
391
+ --pf-t--global--text--color--status--warning--hover: var(--pf-t--global--color--status--warning--hover);
392
+ }