@patternfly/patternfly 6.0.0-alpha.159 → 6.0.0-alpha.160

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 (27) hide show
  1. package/base/patternfly-variables.css +216 -198
  2. package/base/patternfly-variables.scss +1 -1
  3. package/base/tokens/tokens-charts-dark.scss +1 -1
  4. package/base/tokens/tokens-charts.scss +1 -1
  5. package/base/tokens/tokens-dark.scss +31 -31
  6. package/base/tokens/tokens-default.scss +58 -40
  7. package/base/tokens/tokens-palette.scss +1 -1
  8. package/components/Banner/banner.css +10 -10
  9. package/components/Banner/banner.scss +10 -10
  10. package/components/Label/label.css +34 -34
  11. package/components/Label/label.scss +36 -36
  12. package/components/_index.css +44 -44
  13. package/docs/components/Banner/examples/Banner.md +6 -6
  14. package/docs/components/Content/examples/Content.md +1 -1
  15. package/docs/components/Label/examples/Label.md +193 -185
  16. package/docs/components/Table/examples/Table.md +40 -40
  17. package/docs/demos/Card/examples/Card.md +3 -3
  18. package/docs/demos/Dashboard/examples/Dashboard.md +1 -1
  19. package/docs/demos/DescriptionList/examples/DescriptionList.md +1 -1
  20. package/docs/demos/Tabs/examples/Tabs.md +2 -2
  21. package/package.json +1 -1
  22. package/patternfly-base-no-globals.css +216 -198
  23. package/patternfly-base.css +216 -198
  24. package/patternfly-no-globals.css +260 -242
  25. package/patternfly.css +260 -242
  26. package/patternfly.min.css +1 -1
  27. package/patternfly.min.css.map +1 -1
package/components/Label/label.scss CHANGED
@@ -61,15 +61,15 @@
61
61
  --#{$label}--m-orangered--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--default);
62
62
  --#{$label}--m-orangered--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--hover);
63
63
 
64
- // Gold
65
- --#{$label}--m-gold--BackgroundColor: var(--pf-t--global--color--nonstatus--gold--default);
66
- --#{$label}--m-gold--Color: var(--pf-t--global--text--color--nonstatus--on-gold--default);
67
- --#{$label}--m-gold__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gold--default);
68
- --#{$label}--m-gold--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--gold--hover);
69
- --#{$label}--m-gold--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-gold--hover);
70
- --#{$label}--m-gold--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gold--hover);
71
- --#{$label}--m-gold--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--gold--default);
72
- --#{$label}--m-gold--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--gold--hover);
64
+ // Yellow
65
+ --#{$label}--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
66
+ --#{$label}--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
67
+ --#{$label}--m-yellow__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--default);
68
+ --#{$label}--m-yellow--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--hover);
69
+ --#{$label}--m-yellow--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--hover);
70
+ --#{$label}--m-yellow--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--hover);
71
+ --#{$label}--m-yellow--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--default);
72
+ --#{$label}--m-yellow--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--hover);
73
73
 
74
74
  // Green
75
75
  --#{$label}--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
@@ -81,15 +81,15 @@
81
81
  --#{$label}--m-green--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--green--default);
82
82
  --#{$label}--m-green--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--green--hover);
83
83
 
84
- // Cyan
85
- --#{$label}--m-cyan--BackgroundColor: var(--pf-t--global--color--nonstatus--cyan--default);
86
- --#{$label}--m-cyan--Color: var(--pf-t--global--text--color--nonstatus--on-cyan--default);
87
- --#{$label}--m-cyan__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-cyan--default);
88
- --#{$label}--m-cyan--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--cyan--hover);
89
- --#{$label}--m-cyan--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-cyan--hover);
90
- --#{$label}--m-cyan--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-cyan--hover);
91
- --#{$label}--m-cyan--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--cyan--default);
92
- --#{$label}--m-cyan--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--cyan--hover);
84
+ // Teal
85
+ --#{$label}--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
86
+ --#{$label}--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
87
+ --#{$label}--m-teal__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--default);
88
+ --#{$label}--m-teal--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--hover);
89
+ --#{$label}--m-teal--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-teal--hover);
90
+ --#{$label}--m-teal--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--hover);
91
+ --#{$label}--m-teal--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--default);
92
+ --#{$label}--m-teal--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--hover);
93
93
 
94
94
  // Purple
95
95
  --#{$label}--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
@@ -307,15 +307,15 @@
307
307
  --#{$label}--m-outline--m-clickable--hover--BorderColor: var(--#{$label}--m-orangered--m-outline--m-clickable--hover--BorderColor);
308
308
  }
309
309
 
310
- &.pf-m-gold {
311
- --#{$label}--BackgroundColor: var(--#{$label}--m-gold--BackgroundColor);
312
- --#{$label}--Color: var(--#{$label}--m-gold--Color);
313
- --#{$label}__icon--Color: var(--#{$label}--m-gold__icon--Color);
314
- --#{$label}--m-clickable--hover--BackgroundColor: var(--#{$label}--m-gold--m-clickable--hover--BackgroundColor);
315
- --#{$label}--m-clickable--hover--Color: var(--#{$label}--m-gold--m-clickable--hover--Color);
316
- --#{$label}--m-clickable--hover__icon--Color: var(--#{$label}--m-gold--m-clickable--hover__icon--Color);
317
- --#{$label}--m-outline--BorderColor: var(--#{$label}--m-gold--m-outline--BorderColor);
318
- --#{$label}--m-outline--m-clickable--hover--BorderColor: var(--#{$label}--m-gold--m-outline--m-clickable--hover--BorderColor);
310
+ &.pf-m-yellow {
311
+ --#{$label}--BackgroundColor: var(--#{$label}--m-yellow--BackgroundColor);
312
+ --#{$label}--Color: var(--#{$label}--m-yellow--Color);
313
+ --#{$label}__icon--Color: var(--#{$label}--m-yellow__icon--Color);
314
+ --#{$label}--m-clickable--hover--BackgroundColor: var(--#{$label}--m-yellow--m-clickable--hover--BackgroundColor);
315
+ --#{$label}--m-clickable--hover--Color: var(--#{$label}--m-yellow--m-clickable--hover--Color);
316
+ --#{$label}--m-clickable--hover__icon--Color: var(--#{$label}--m-yellow--m-clickable--hover__icon--Color);
317
+ --#{$label}--m-outline--BorderColor: var(--#{$label}--m-yellow--m-outline--BorderColor);
318
+ --#{$label}--m-outline--m-clickable--hover--BorderColor: var(--#{$label}--m-yellow--m-outline--m-clickable--hover--BorderColor);
319
319
  }
320
320
 
321
321
  &.pf-m-green {
@@ -329,15 +329,15 @@
329
329
  --#{$label}--m-outline--m-clickable--hover--BorderColor: var(--#{$label}--m-green--m-outline--m-clickable--hover--BorderColor);
330
330
  }
331
331
 
332
- &.pf-m-cyan {
333
- --#{$label}--BackgroundColor: var(--#{$label}--m-cyan--BackgroundColor);
334
- --#{$label}--Color: var(--#{$label}--m-cyan--Color);
335
- --#{$label}__icon--Color: var(--#{$label}--m-cyan__icon--Color);
336
- --#{$label}--m-clickable--hover--BackgroundColor: var(--#{$label}--m-cyan--m-clickable--hover--BackgroundColor);
337
- --#{$label}--m-clickable--hover--Color: var(--#{$label}--m-cyan--m-clickable--hover--Color);
338
- --#{$label}--m-clickable--hover__icon--Color: var(--#{$label}--m-cyan--m-clickable--hover__icon--Color);
339
- --#{$label}--m-outline--BorderColor: var(--#{$label}--m-cyan--m-outline--BorderColor);
340
- --#{$label}--m-outline--m-clickable--hover--BorderColor: var(--#{$label}--m-cyan--m-outline--m-clickable--hover--BorderColor);
332
+ &.pf-m-teal {
333
+ --#{$label}--BackgroundColor: var(--#{$label}--m-teal--BackgroundColor);
334
+ --#{$label}--Color: var(--#{$label}--m-teal--Color);
335
+ --#{$label}__icon--Color: var(--#{$label}--m-teal__icon--Color);
336
+ --#{$label}--m-clickable--hover--BackgroundColor: var(--#{$label}--m-teal--m-clickable--hover--BackgroundColor);
337
+ --#{$label}--m-clickable--hover--Color: var(--#{$label}--m-teal--m-clickable--hover--Color);
338
+ --#{$label}--m-clickable--hover__icon--Color: var(--#{$label}--m-teal--m-clickable--hover__icon--Color);
339
+ --#{$label}--m-outline--BorderColor: var(--#{$label}--m-teal--m-outline--BorderColor);
340
+ --#{$label}--m-outline--m-clickable--hover--BorderColor: var(--#{$label}--m-teal--m-outline--m-clickable--hover--BorderColor);
341
341
  }
342
342
 
343
343
  &.pf-m-purple {
package/components/_index.css CHANGED
@@ -1073,12 +1073,12 @@
1073
1073
  --pf-v6-c-banner--m-orangered--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--default);
1074
1074
  --pf-v6-c-banner--m-orange--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--default);
1075
1075
  --pf-v6-c-banner--m-orange--Color: var(--pf-t--global--text--color--nonstatus--on-orange--default);
1076
- --pf-v6-c-banner--m-gold--BackgroundColor: var(--pf-t--global--color--nonstatus--gold--default);
1077
- --pf-v6-c-banner--m-gold--Color: var(--pf-t--global--text--color--nonstatus--on-gold--default);
1076
+ --pf-v6-c-banner--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
1077
+ --pf-v6-c-banner--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
1078
1078
  --pf-v6-c-banner--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
1079
1079
  --pf-v6-c-banner--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
1080
- --pf-v6-c-banner--m-cyan--BackgroundColor: var(--pf-t--global--color--nonstatus--cyan--default);
1081
- --pf-v6-c-banner--m-cyan--Color: var(--pf-t--global--text--color--nonstatus--on-cyan--default);
1080
+ --pf-v6-c-banner--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
1081
+ --pf-v6-c-banner--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
1082
1082
  --pf-v6-c-banner--m-blue--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--default);
1083
1083
  --pf-v6-c-banner--m-blue--Color: var(--pf-t--global--text--color--nonstatus--on-blue--default);
1084
1084
  --pf-v6-c-banner--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
@@ -1134,17 +1134,17 @@
1134
1134
  --pf-v6-c-banner--BackgroundColor: var(--pf-v6-c-banner--m-orange--BackgroundColor);
1135
1135
  --pf-v6-c-banner--Color: var(--pf-v6-c-banner--m-orange--Color);
1136
1136
  }
1137
- .pf-v6-c-banner.pf-m-gold {
1138
- --pf-v6-c-banner--BackgroundColor: var(--pf-v6-c-banner--m-gold--BackgroundColor);
1139
- --pf-v6-c-banner--Color: var(--pf-v6-c-banner--m-gold--Color);
1137
+ .pf-v6-c-banner.pf-m-yellow {
1138
+ --pf-v6-c-banner--BackgroundColor: var(--pf-v6-c-banner--m-yellow--BackgroundColor);
1139
+ --pf-v6-c-banner--Color: var(--pf-v6-c-banner--m-yellow--Color);
1140
1140
  }
1141
1141
  .pf-v6-c-banner.pf-m-green {
1142
1142
  --pf-v6-c-banner--BackgroundColor: var(--pf-v6-c-banner--m-green--BackgroundColor);
1143
1143
  --pf-v6-c-banner--Color: var(--pf-v6-c-banner--m-green--Color);
1144
1144
  }
1145
- .pf-v6-c-banner.pf-m-cyan {
1146
- --pf-v6-c-banner--BackgroundColor: var(--pf-v6-c-banner--m-cyan--BackgroundColor);
1147
- --pf-v6-c-banner--Color: var(--pf-v6-c-banner--m-cyan--Color);
1145
+ .pf-v6-c-banner.pf-m-teal {
1146
+ --pf-v6-c-banner--BackgroundColor: var(--pf-v6-c-banner--m-teal--BackgroundColor);
1147
+ --pf-v6-c-banner--Color: var(--pf-v6-c-banner--m-teal--Color);
1148
1148
  }
1149
1149
  .pf-v6-c-banner.pf-m-blue {
1150
1150
  --pf-v6-c-banner--BackgroundColor: var(--pf-v6-c-banner--m-blue--BackgroundColor);
@@ -7858,14 +7858,14 @@ label.pf-v6-c-input-group__text {
7858
7858
  --pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--hover);
7859
7859
  --pf-v6-c-label--m-orangered--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--default);
7860
7860
  --pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--hover);
7861
- --pf-v6-c-label--m-gold--BackgroundColor: var(--pf-t--global--color--nonstatus--gold--default);
7862
- --pf-v6-c-label--m-gold--Color: var(--pf-t--global--text--color--nonstatus--on-gold--default);
7863
- --pf-v6-c-label--m-gold__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gold--default);
7864
- --pf-v6-c-label--m-gold--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--gold--hover);
7865
- --pf-v6-c-label--m-gold--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-gold--hover);
7866
- --pf-v6-c-label--m-gold--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gold--hover);
7867
- --pf-v6-c-label--m-gold--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--gold--default);
7868
- --pf-v6-c-label--m-gold--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--gold--hover);
7861
+ --pf-v6-c-label--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
7862
+ --pf-v6-c-label--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
7863
+ --pf-v6-c-label--m-yellow__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--default);
7864
+ --pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--hover);
7865
+ --pf-v6-c-label--m-yellow--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--hover);
7866
+ --pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--hover);
7867
+ --pf-v6-c-label--m-yellow--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--default);
7868
+ --pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--hover);
7869
7869
  --pf-v6-c-label--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
7870
7870
  --pf-v6-c-label--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
7871
7871
  --pf-v6-c-label--m-green__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--default);
@@ -7874,14 +7874,14 @@ label.pf-v6-c-input-group__text {
7874
7874
  --pf-v6-c-label--m-green--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--hover);
7875
7875
  --pf-v6-c-label--m-green--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--green--default);
7876
7876
  --pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--green--hover);
7877
- --pf-v6-c-label--m-cyan--BackgroundColor: var(--pf-t--global--color--nonstatus--cyan--default);
7878
- --pf-v6-c-label--m-cyan--Color: var(--pf-t--global--text--color--nonstatus--on-cyan--default);
7879
- --pf-v6-c-label--m-cyan__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-cyan--default);
7880
- --pf-v6-c-label--m-cyan--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--cyan--hover);
7881
- --pf-v6-c-label--m-cyan--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-cyan--hover);
7882
- --pf-v6-c-label--m-cyan--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-cyan--hover);
7883
- --pf-v6-c-label--m-cyan--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--cyan--default);
7884
- --pf-v6-c-label--m-cyan--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--cyan--hover);
7877
+ --pf-v6-c-label--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
7878
+ --pf-v6-c-label--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
7879
+ --pf-v6-c-label--m-teal__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--default);
7880
+ --pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--hover);
7881
+ --pf-v6-c-label--m-teal--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-teal--hover);
7882
+ --pf-v6-c-label--m-teal--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--hover);
7883
+ --pf-v6-c-label--m-teal--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--default);
7884
+ --pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--hover);
7885
7885
  --pf-v6-c-label--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
7886
7886
  --pf-v6-c-label--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
7887
7887
  --pf-v6-c-label--m-purple__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--default);
@@ -8055,15 +8055,15 @@ label.pf-v6-c-input-group__text {
8055
8055
  --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--BorderColor);
8056
8056
  --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor);
8057
8057
  }
8058
- .pf-v6-c-label.pf-m-gold {
8059
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-gold--BackgroundColor);
8060
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-gold--Color);
8061
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-gold__icon--Color);
8062
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-gold--m-clickable--hover--BackgroundColor);
8063
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-gold--m-clickable--hover--Color);
8064
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-gold--m-clickable--hover__icon--Color);
8065
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-gold--m-outline--BorderColor);
8066
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-gold--m-outline--m-clickable--hover--BorderColor);
8058
+ .pf-v6-c-label.pf-m-yellow {
8059
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-yellow--BackgroundColor);
8060
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-yellow--Color);
8061
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-yellow__icon--Color);
8062
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor);
8063
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover--Color);
8064
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color);
8065
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--BorderColor);
8066
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor);
8067
8067
  }
8068
8068
  .pf-v6-c-label.pf-m-green {
8069
8069
  --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-green--BackgroundColor);
@@ -8075,15 +8075,15 @@ label.pf-v6-c-input-group__text {
8075
8075
  --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-green--m-outline--BorderColor);
8076
8076
  --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor);
8077
8077
  }
8078
- .pf-v6-c-label.pf-m-cyan {
8079
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-cyan--BackgroundColor);
8080
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-cyan--Color);
8081
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-cyan__icon--Color);
8082
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-cyan--m-clickable--hover--BackgroundColor);
8083
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-cyan--m-clickable--hover--Color);
8084
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-cyan--m-clickable--hover__icon--Color);
8085
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-cyan--m-outline--BorderColor);
8086
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-cyan--m-outline--m-clickable--hover--BorderColor);
8078
+ .pf-v6-c-label.pf-m-teal {
8079
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-teal--BackgroundColor);
8080
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-teal--Color);
8081
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-teal__icon--Color);
8082
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor);
8083
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover--Color);
8084
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover__icon--Color);
8085
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--BorderColor);
8086
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor);
8087
8087
  }
8088
8088
  .pf-v6-c-label.pf-m-purple {
8089
8089
  --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-purple--BackgroundColor);
package/docs/components/Banner/examples/Banner.md CHANGED
@@ -25,7 +25,7 @@ Banners can be styled with one of 9 different nonstatus colors. A nonstatus bann
25
25
 
26
26
  <br />
27
27
 
28
- <div class="pf-v6-c-banner pf-m-gold">Gold banner</div>
28
+ <div class="pf-v6-c-banner pf-m-yellow">Yellow banner</div>
29
29
 
30
30
  <br />
31
31
 
@@ -33,7 +33,7 @@ Banners can be styled with one of 9 different nonstatus colors. A nonstatus bann
33
33
 
34
34
  <br />
35
35
 
36
- <div class="pf-v6-c-banner pf-m-cyan">Cyan banner</div>
36
+ <div class="pf-v6-c-banner pf-m-teal">Teal banner</div>
37
37
 
38
38
  <br />
39
39
 
@@ -72,8 +72,8 @@ Banners can be styled with one of 9 different nonstatus colors. A nonstatus bann
72
72
  >inline link button</button>
73
73
  </div>
74
74
  <br />
75
- <div class="pf-v6-c-banner pf-m-gold">
76
- Gold banner with an
75
+ <div class="pf-v6-c-banner pf-m-yellow">
76
+ Yellow banner with an
77
77
  <a
78
78
  class="pf-v6-c-button pf-m-inline pf-m-link"
79
79
  href="https://www.w3.org/TR/WCAG20-TECHS/ARIA8.html#ARIA8-examples"
@@ -171,9 +171,9 @@ When a banner is used to convey status, it is advised to add an icon that also c
171
171
  | `.pf-m-red` | `.pf-v6-c-banner` | Modifies banner for red styling. |
172
172
  | `.pf-m-orangered` | `.pf-v6-c-banner` | Modifies banner for orangered styling. |
173
173
  | `.pf-m-orange` | `.pf-v6-c-banner` | Modifies banner for orange styling. |
174
- | `.pf-m-gold` | `.pf-v6-c-banner` | Modifies banner for gold styling. |
174
+ | `.pf-m-yellow` | `.pf-v6-c-banner` | Modifies banner for yellow styling. |
175
175
  | `.pf-m-green` | `.pf-v6-c-banner` | Modifies banner for green styling. |
176
- | `.pf-m-cyan` | `.pf-v6-c-banner` | Modifies banner for cyan styling. |
176
+ | `.pf-m-teal` | `.pf-v6-c-banner` | Modifies banner for teal styling. |
177
177
  | `.pf-m-blue` | `.pf-v6-c-banner` | Modifies banner for blue styling. |
178
178
  | `.pf-m-purple` | `.pf-v6-c-banner` | Modifies banner for purple styling. |
179
179
  | `.pf-m-success` | `.pf-v6-c-banner` | Modifies banner for success status styling. |
package/docs/components/Content/examples/Content.md CHANGED
@@ -1,5 +1,5 @@
1
1
  ---
2
- id: Text
2
+ id: Content
3
3
  section: components
4
4
  cssPrefix: pf-v6-c-content
5
5
  ---## Examples