@patternfly/patternfly 6.0.0-alpha.123 → 6.0.0-alpha.124

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 +30 -4
  2. package/base/tokens/tokens-charts-dark.scss +1 -1
  3. package/base/tokens/tokens-charts.scss +1 -1
  4. package/base/tokens/tokens-dark.scss +16 -3
  5. package/base/tokens/tokens-default.scss +16 -3
  6. package/base/tokens/tokens-palette.scss +1 -1
  7. package/components/DataList/data-list.css +2 -2
  8. package/components/DataList/data-list.scss +2 -2
  9. package/components/Page/page.css +2 -230
  10. package/components/Page/page.scss +3 -158
  11. package/components/_index.css +4 -232
  12. package/docs/components/Nav/examples/Navigation.css +0 -5
  13. package/docs/utilities/Alignment/examples/Alignment.css +2 -2
  14. package/docs/utilities/Display/examples/Display.css +2 -2
  15. package/docs/utilities/Flex/examples/Flex.css +2 -2
  16. package/docs/utilities/Float/examples/Float.css +3 -3
  17. package/docs/utilities/Sizing/examples/Sizing.css +2 -2
  18. package/docs/utilities/Spacing/examples/Spacing.css +2 -2
  19. package/package.json +1 -1
  20. package/patternfly-base-no-globals.css +30 -4
  21. package/patternfly-base.css +30 -4
  22. package/patternfly-no-globals.css +34 -236
  23. package/patternfly.css +34 -236
  24. package/patternfly.min.css +1 -1
  25. package/patternfly.min.css.map +1 -1
  26. package/docs/components/Page/deprecated/PageHeader.css +0 -17
  27. package/docs/components/Page/deprecated/PageHeader.md +0 -275
package/patternfly-base.css CHANGED
@@ -5224,6 +5224,12 @@ h6) {
5224
5224
  --pf-t--global--color--nonstatus--red--300: var(--pf-t--color--red--40);
5225
5225
  --pf-t--global--color--nonstatus--red--200: var(--pf-t--color--red--30);
5226
5226
  --pf-t--global--color--nonstatus--red--100: var(--pf-t--color--red--20);
5227
+ --pf-t--global--color--severity--critical--100: var(--pf-t--color--red-orange--60);
5228
+ --pf-t--global--color--severity--important--100: var(--pf-t--color--orange--50);
5229
+ --pf-t--global--color--severity--moderate--100: var(--pf-t--color--yellow--40);
5230
+ --pf-t--global--color--severity--minor--100: var(--pf-t--color--gray--50);
5231
+ --pf-t--global--color--severity--none--100: var(--pf-t--color--blue--40);
5232
+ --pf-t--global--color--severity--undefined--100: var(--pf-t--color--gray--30);
5227
5233
  --pf-t--global--color--status--custom--200: var(--pf-t--color--teal--70);
5228
5234
  --pf-t--global--color--status--custom--100: var(--pf-t--color--teal--60);
5229
5235
  --pf-t--global--color--status--info--200: var(--pf-t--color--purple--60);
@@ -5364,6 +5370,7 @@ h6) {
5364
5370
  --pf-t--global--text--color--status--warning--clicked: var(--pf-t--global--color--status--warning--300);
5365
5371
  --pf-t--global--text--color--status--warning--hover: var(--pf-t--global--color--status--warning--300);
5366
5372
  --pf-t--global--text--color--status--warning--default: var(--pf-t--global--color--status--warning--200);
5373
+ --pf-t--global--text--color--on-highlight: var(--pf-t--global--text--color--100);
5367
5374
  --pf-t--global--text--color--required: var(--pf-t--global--text--color--400);
5368
5375
  --pf-t--global--text--color--on-disabled: var(--pf-t--global--color--disabled--300);
5369
5376
  --pf-t--global--text--color--disabled: var(--pf-t--global--color--disabled--200);
@@ -5473,12 +5480,19 @@ h6) {
5473
5480
  --pf-t--global--border--color--nonstatus--red--hover: var(--pf-t--global--color--nonstatus--red--300);
5474
5481
  --pf-t--global--border--color--nonstatus--red--default: var(--pf-t--global--color--nonstatus--red--200);
5475
5482
  --pf-t--global--border--color--on-secondary: var(--pf-t--global--border--color--300);
5483
+ --pf-t--global--border--color--disabled: var(--pf-t--global--color--disabled--200);
5476
5484
  --pf-t--global--border--color--clicked: var(--pf-t--global--color--brand--200);
5477
5485
  --pf-t--global--border--color--hover: var(--pf-t--global--color--brand--100);
5478
5486
  --pf-t--global--border--color--default: var(--pf-t--global--border--color--100);
5479
5487
  --pf-t--global--border--color--status--warning--clicked: var(--pf-t--global--color--status--warning--300);
5480
5488
  --pf-t--global--border--color--status--warning--hover: var(--pf-t--global--color--status--warning--300);
5481
5489
  --pf-t--global--border--color--status--warning--default: var(--pf-t--global--color--status--warning--200);
5490
+ --pf-t--global--icon--color--severity--critical--default: var(--pf-t--global--color--severity--critical--100);
5491
+ --pf-t--global--icon--color--severity--important--default: var(--pf-t--global--color--severity--important--100);
5492
+ --pf-t--global--icon--color--severity--moderate--default: var(--pf-t--global--color--severity--moderate--100);
5493
+ --pf-t--global--icon--color--severity--minor--default: var(--pf-t--global--color--severity--minor--100);
5494
+ --pf-t--global--icon--color--severity--none--default: var(--pf-t--global--color--severity--none--100);
5495
+ --pf-t--global--icon--color--severity--undefined--default: var(--pf-t--global--color--severity--undefined--100);
5482
5496
  --pf-t--global--icon--color--on-disabled: var(--pf-t--global--color--disabled--300);
5483
5497
  --pf-t--global--icon--color--disabled: var(--pf-t--global--color--disabled--200);
5484
5498
  --pf-t--global--icon--color--inverse: var(--pf-t--global--icon--color--300);
@@ -5563,15 +5577,14 @@ h6) {
5563
5577
  --pf-t--global--text--color--on-brand--hover: var(--pf-t--global--text--color--inverse);
5564
5578
  --pf-t--global--text--color--on-brand--default: var(--pf-t--global--text--color--inverse);
5565
5579
  --pf-t--global--color--status--read--on-primary: var(--pf-t--global--background--color--secondary--default);
5566
- --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
5567
5580
  --pf-t--global--color--status--unread--attention--hover: var(--pf-t--global--color--status--danger--hover);
5581
+ --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
5568
5582
  --pf-t--global--color--status--unread--attention--default: var(--pf-t--global--color--status--danger--default);
5569
5583
  --pf-t--global--color--status--unread--default--clicked: var(--pf-t--global--color--brand--clicked);
5570
5584
  --pf-t--global--color--status--unread--default--hover: var(--pf-t--global--color--brand--hover);
5571
5585
  --pf-t--global--color--status--unread--default--default: var(--pf-t--global--color--brand--default);
5572
5586
  --pf-t--global--background--color--control--default: var(--pf-t--global--background--color--primary--default);
5573
5587
  --pf-t--global--border--color--alt: var(--pf-t--global--background--color--primary--default);
5574
- --pf-t--global--border--color--disabled: var(--pf-t--global--background--color--disabled--default);
5575
5588
  --pf-t--global--border--color--status--custom--clicked: var(--pf-t--global--color--status--custom--clicked);
5576
5589
  --pf-t--global--border--color--status--custom--hover: var(--pf-t--global--color--status--custom--hover);
5577
5590
  --pf-t--global--border--color--status--custom--default: var(--pf-t--global--color--status--custom--default);
@@ -5730,6 +5743,12 @@ h6) {
5730
5743
  --pf-t--global--dark--color--status--warning--100: var(--pf-t--color--yellow--30);
5731
5744
  --pf-t--global--dark--color--status--success--200: var(--pf-t--color--green--30);
5732
5745
  --pf-t--global--dark--color--status--success--100: var(--pf-t--color--green--40);
5746
+ --pf-t--global--dark--color--severity--critical--100: var(--pf-t--color--red-orange--50);
5747
+ --pf-t--global--dark--color--severity--important--100: var(--pf-t--color--orange--40);
5748
+ --pf-t--global--dark--color--severity--moderate--100: var(--pf-t--color--yellow--30);
5749
+ --pf-t--global--dark--color--severity--minor--100: var(--pf-t--color--gray--30);
5750
+ --pf-t--global--dark--color--severity--none--100: var(--pf-t--color--blue--30);
5751
+ --pf-t--global--dark--color--severity--undefined--100: var(--pf-t--color--gray--40);
5733
5752
  --pf-t--global--dark--color--favorite--200: var(--pf-t--color--yellow--20);
5734
5753
  --pf-t--global--dark--color--favorite--100: var(--pf-t--color--yellow--30);
5735
5754
  --pf-t--global--dark--color--disabled--300: var(--pf-t--color--gray--70);
@@ -5747,6 +5766,7 @@ h6) {
5747
5766
  --pf-t--global--text--color--status--danger--clicked: var(--pf-t--global--dark--color--status--danger--300);
5748
5767
  --pf-t--global--text--color--status--danger--hover: var(--pf-t--global--dark--color--status--danger--300);
5749
5768
  --pf-t--global--text--color--status--danger--default: var(--pf-t--global--dark--color--status--danger--250);
5769
+ --pf-t--global--text--color--on-highlight: var(--pf-t--global--dark--text--color--300);
5750
5770
  --pf-t--global--text--color--required: var(--pf-t--global--dark--text--color--400);
5751
5771
  --pf-t--global--text--color--brand--clicked: var(--pf-t--global--dark--color--brand--300);
5752
5772
  --pf-t--global--text--color--brand--hover: var(--pf-t--global--dark--color--brand--300);
@@ -5787,9 +5807,16 @@ h6) {
5787
5807
  --pf-t--global--border--color--nonstatus--red--hover: var(--pf-t--global--dark--color--nonstatus--red--200);
5788
5808
  --pf-t--global--border--color--nonstatus--red--default: var(--pf-t--global--dark--color--nonstatus--red--100);
5789
5809
  --pf-t--global--border--color--on-secondary: var(--pf-t--global--dark--border--color--200);
5810
+ --pf-t--global--border--color--disabled: var(--pf-t--global--dark--color--disabled--200);
5790
5811
  --pf-t--global--border--color--clicked: var(--pf-t--global--dark--color--brand--200);
5791
5812
  --pf-t--global--border--color--hover: var(--pf-t--global--dark--color--brand--100);
5792
5813
  --pf-t--global--border--color--default: var(--pf-t--global--dark--border--color--200);
5814
+ --pf-t--global--icon--color--severity--critical--default: var(--pf-t--global--dark--color--severity--critical--100);
5815
+ --pf-t--global--icon--color--severity--important--default: var(--pf-t--global--dark--color--severity--important--100);
5816
+ --pf-t--global--icon--color--severity--moderate--default: var(--pf-t--global--dark--color--severity--moderate--100);
5817
+ --pf-t--global--icon--color--severity--minor--default: var(--pf-t--global--dark--color--severity--minor--100);
5818
+ --pf-t--global--icon--color--severity--none--default: var(--pf-t--global--dark--color--severity--none--100);
5819
+ --pf-t--global--icon--color--severity--undefined--default: var(--pf-t--global--dark--color--severity--undefined--100);
5793
5820
  --pf-t--global--icon--color--on-disabled: var(--pf-t--global--dark--color--disabled--300);
5794
5821
  --pf-t--global--icon--color--disabled: var(--pf-t--global--dark--color--disabled--200);
5795
5822
  --pf-t--global--icon--color--inverse: var(--pf-t--global--dark--icon--color--300);
@@ -5927,7 +5954,6 @@ h6) {
5927
5954
  --pf-t--global--text--color--on-brand--hover: var(--pf-t--global--text--color--inverse);
5928
5955
  --pf-t--global--text--color--on-brand--default: var(--pf-t--global--text--color--inverse);
5929
5956
  --pf-t--global--border--color--alt: var(--pf-t--global--background--color--primary--default);
5930
- --pf-t--global--border--color--disabled: var(--pf-t--global--background--color--disabled--default);
5931
5957
  --pf-t--global--border--color--status--custom--clicked: var(--pf-t--global--color--status--custom--clicked);
5932
5958
  --pf-t--global--border--color--status--custom--hover: var(--pf-t--global--color--status--custom--hover);
5933
5959
  --pf-t--global--border--color--status--custom--default: var(--pf-t--global--color--status--custom--default);
@@ -6017,8 +6043,8 @@ h6) {
6017
6043
  --pf-t--global--icon--color--on-brand--default: var(--pf-t--global--icon--color--inverse);
6018
6044
  --pf-t--global--color--status--read--on-primary: var(--pf-t--global--background--color--secondary--default);
6019
6045
  --pf-t--global--color--status--read--on-secondary: var(--pf-t--global--background--color--control--default);
6020
- --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
6021
6046
  --pf-t--global--color--status--unread--attention--hover: var(--pf-t--global--color--status--danger--hover);
6047
+ --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
6022
6048
  --pf-t--global--color--status--unread--attention--default: var(--pf-t--global--color--status--danger--default);
6023
6049
  --pf-t--global--color--status--unread--default--clicked: var(--pf-t--global--color--brand--clicked);
6024
6050
  --pf-t--global--color--status--unread--default--hover: var(--pf-t--global--color--brand--hover);
package/patternfly-no-globals.css CHANGED
@@ -5108,6 +5108,12 @@
5108
5108
  --pf-t--global--color--nonstatus--red--300: var(--pf-t--color--red--40);
5109
5109
  --pf-t--global--color--nonstatus--red--200: var(--pf-t--color--red--30);
5110
5110
  --pf-t--global--color--nonstatus--red--100: var(--pf-t--color--red--20);
5111
+ --pf-t--global--color--severity--critical--100: var(--pf-t--color--red-orange--60);
5112
+ --pf-t--global--color--severity--important--100: var(--pf-t--color--orange--50);
5113
+ --pf-t--global--color--severity--moderate--100: var(--pf-t--color--yellow--40);
5114
+ --pf-t--global--color--severity--minor--100: var(--pf-t--color--gray--50);
5115
+ --pf-t--global--color--severity--none--100: var(--pf-t--color--blue--40);
5116
+ --pf-t--global--color--severity--undefined--100: var(--pf-t--color--gray--30);
5111
5117
  --pf-t--global--color--status--custom--200: var(--pf-t--color--teal--70);
5112
5118
  --pf-t--global--color--status--custom--100: var(--pf-t--color--teal--60);
5113
5119
  --pf-t--global--color--status--info--200: var(--pf-t--color--purple--60);
@@ -5248,6 +5254,7 @@
5248
5254
  --pf-t--global--text--color--status--warning--clicked: var(--pf-t--global--color--status--warning--300);
5249
5255
  --pf-t--global--text--color--status--warning--hover: var(--pf-t--global--color--status--warning--300);
5250
5256
  --pf-t--global--text--color--status--warning--default: var(--pf-t--global--color--status--warning--200);
5257
+ --pf-t--global--text--color--on-highlight: var(--pf-t--global--text--color--100);
5251
5258
  --pf-t--global--text--color--required: var(--pf-t--global--text--color--400);
5252
5259
  --pf-t--global--text--color--on-disabled: var(--pf-t--global--color--disabled--300);
5253
5260
  --pf-t--global--text--color--disabled: var(--pf-t--global--color--disabled--200);
@@ -5357,12 +5364,19 @@
5357
5364
  --pf-t--global--border--color--nonstatus--red--hover: var(--pf-t--global--color--nonstatus--red--300);
5358
5365
  --pf-t--global--border--color--nonstatus--red--default: var(--pf-t--global--color--nonstatus--red--200);
5359
5366
  --pf-t--global--border--color--on-secondary: var(--pf-t--global--border--color--300);
5367
+ --pf-t--global--border--color--disabled: var(--pf-t--global--color--disabled--200);
5360
5368
  --pf-t--global--border--color--clicked: var(--pf-t--global--color--brand--200);
5361
5369
  --pf-t--global--border--color--hover: var(--pf-t--global--color--brand--100);
5362
5370
  --pf-t--global--border--color--default: var(--pf-t--global--border--color--100);
5363
5371
  --pf-t--global--border--color--status--warning--clicked: var(--pf-t--global--color--status--warning--300);
5364
5372
  --pf-t--global--border--color--status--warning--hover: var(--pf-t--global--color--status--warning--300);
5365
5373
  --pf-t--global--border--color--status--warning--default: var(--pf-t--global--color--status--warning--200);
5374
+ --pf-t--global--icon--color--severity--critical--default: var(--pf-t--global--color--severity--critical--100);
5375
+ --pf-t--global--icon--color--severity--important--default: var(--pf-t--global--color--severity--important--100);
5376
+ --pf-t--global--icon--color--severity--moderate--default: var(--pf-t--global--color--severity--moderate--100);
5377
+ --pf-t--global--icon--color--severity--minor--default: var(--pf-t--global--color--severity--minor--100);
5378
+ --pf-t--global--icon--color--severity--none--default: var(--pf-t--global--color--severity--none--100);
5379
+ --pf-t--global--icon--color--severity--undefined--default: var(--pf-t--global--color--severity--undefined--100);
5366
5380
  --pf-t--global--icon--color--on-disabled: var(--pf-t--global--color--disabled--300);
5367
5381
  --pf-t--global--icon--color--disabled: var(--pf-t--global--color--disabled--200);
5368
5382
  --pf-t--global--icon--color--inverse: var(--pf-t--global--icon--color--300);
@@ -5447,15 +5461,14 @@
5447
5461
  --pf-t--global--text--color--on-brand--hover: var(--pf-t--global--text--color--inverse);
5448
5462
  --pf-t--global--text--color--on-brand--default: var(--pf-t--global--text--color--inverse);
5449
5463
  --pf-t--global--color--status--read--on-primary: var(--pf-t--global--background--color--secondary--default);
5450
- --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
5451
5464
  --pf-t--global--color--status--unread--attention--hover: var(--pf-t--global--color--status--danger--hover);
5465
+ --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
5452
5466
  --pf-t--global--color--status--unread--attention--default: var(--pf-t--global--color--status--danger--default);
5453
5467
  --pf-t--global--color--status--unread--default--clicked: var(--pf-t--global--color--brand--clicked);
5454
5468
  --pf-t--global--color--status--unread--default--hover: var(--pf-t--global--color--brand--hover);
5455
5469
  --pf-t--global--color--status--unread--default--default: var(--pf-t--global--color--brand--default);
5456
5470
  --pf-t--global--background--color--control--default: var(--pf-t--global--background--color--primary--default);
5457
5471
  --pf-t--global--border--color--alt: var(--pf-t--global--background--color--primary--default);
5458
- --pf-t--global--border--color--disabled: var(--pf-t--global--background--color--disabled--default);
5459
5472
  --pf-t--global--border--color--status--custom--clicked: var(--pf-t--global--color--status--custom--clicked);
5460
5473
  --pf-t--global--border--color--status--custom--hover: var(--pf-t--global--color--status--custom--hover);
5461
5474
  --pf-t--global--border--color--status--custom--default: var(--pf-t--global--color--status--custom--default);
@@ -5614,6 +5627,12 @@
5614
5627
  --pf-t--global--dark--color--status--warning--100: var(--pf-t--color--yellow--30);
5615
5628
  --pf-t--global--dark--color--status--success--200: var(--pf-t--color--green--30);
5616
5629
  --pf-t--global--dark--color--status--success--100: var(--pf-t--color--green--40);
5630
+ --pf-t--global--dark--color--severity--critical--100: var(--pf-t--color--red-orange--50);
5631
+ --pf-t--global--dark--color--severity--important--100: var(--pf-t--color--orange--40);
5632
+ --pf-t--global--dark--color--severity--moderate--100: var(--pf-t--color--yellow--30);
5633
+ --pf-t--global--dark--color--severity--minor--100: var(--pf-t--color--gray--30);
5634
+ --pf-t--global--dark--color--severity--none--100: var(--pf-t--color--blue--30);
5635
+ --pf-t--global--dark--color--severity--undefined--100: var(--pf-t--color--gray--40);
5617
5636
  --pf-t--global--dark--color--favorite--200: var(--pf-t--color--yellow--20);
5618
5637
  --pf-t--global--dark--color--favorite--100: var(--pf-t--color--yellow--30);
5619
5638
  --pf-t--global--dark--color--disabled--300: var(--pf-t--color--gray--70);
@@ -5631,6 +5650,7 @@
5631
5650
  --pf-t--global--text--color--status--danger--clicked: var(--pf-t--global--dark--color--status--danger--300);
5632
5651
  --pf-t--global--text--color--status--danger--hover: var(--pf-t--global--dark--color--status--danger--300);
5633
5652
  --pf-t--global--text--color--status--danger--default: var(--pf-t--global--dark--color--status--danger--250);
5653
+ --pf-t--global--text--color--on-highlight: var(--pf-t--global--dark--text--color--300);
5634
5654
  --pf-t--global--text--color--required: var(--pf-t--global--dark--text--color--400);
5635
5655
  --pf-t--global--text--color--brand--clicked: var(--pf-t--global--dark--color--brand--300);
5636
5656
  --pf-t--global--text--color--brand--hover: var(--pf-t--global--dark--color--brand--300);
@@ -5671,9 +5691,16 @@
5671
5691
  --pf-t--global--border--color--nonstatus--red--hover: var(--pf-t--global--dark--color--nonstatus--red--200);
5672
5692
  --pf-t--global--border--color--nonstatus--red--default: var(--pf-t--global--dark--color--nonstatus--red--100);
5673
5693
  --pf-t--global--border--color--on-secondary: var(--pf-t--global--dark--border--color--200);
5694
+ --pf-t--global--border--color--disabled: var(--pf-t--global--dark--color--disabled--200);
5674
5695
  --pf-t--global--border--color--clicked: var(--pf-t--global--dark--color--brand--200);
5675
5696
  --pf-t--global--border--color--hover: var(--pf-t--global--dark--color--brand--100);
5676
5697
  --pf-t--global--border--color--default: var(--pf-t--global--dark--border--color--200);
5698
+ --pf-t--global--icon--color--severity--critical--default: var(--pf-t--global--dark--color--severity--critical--100);
5699
+ --pf-t--global--icon--color--severity--important--default: var(--pf-t--global--dark--color--severity--important--100);
5700
+ --pf-t--global--icon--color--severity--moderate--default: var(--pf-t--global--dark--color--severity--moderate--100);
5701
+ --pf-t--global--icon--color--severity--minor--default: var(--pf-t--global--dark--color--severity--minor--100);
5702
+ --pf-t--global--icon--color--severity--none--default: var(--pf-t--global--dark--color--severity--none--100);
5703
+ --pf-t--global--icon--color--severity--undefined--default: var(--pf-t--global--dark--color--severity--undefined--100);
5677
5704
  --pf-t--global--icon--color--on-disabled: var(--pf-t--global--dark--color--disabled--300);
5678
5705
  --pf-t--global--icon--color--disabled: var(--pf-t--global--dark--color--disabled--200);
5679
5706
  --pf-t--global--icon--color--inverse: var(--pf-t--global--dark--icon--color--300);
@@ -5811,7 +5838,6 @@
5811
5838
  --pf-t--global--text--color--on-brand--hover: var(--pf-t--global--text--color--inverse);
5812
5839
  --pf-t--global--text--color--on-brand--default: var(--pf-t--global--text--color--inverse);
5813
5840
  --pf-t--global--border--color--alt: var(--pf-t--global--background--color--primary--default);
5814
- --pf-t--global--border--color--disabled: var(--pf-t--global--background--color--disabled--default);
5815
5841
  --pf-t--global--border--color--status--custom--clicked: var(--pf-t--global--color--status--custom--clicked);
5816
5842
  --pf-t--global--border--color--status--custom--hover: var(--pf-t--global--color--status--custom--hover);
5817
5843
  --pf-t--global--border--color--status--custom--default: var(--pf-t--global--color--status--custom--default);
@@ -5901,8 +5927,8 @@
5901
5927
  --pf-t--global--icon--color--on-brand--default: var(--pf-t--global--icon--color--inverse);
5902
5928
  --pf-t--global--color--status--read--on-primary: var(--pf-t--global--background--color--secondary--default);
5903
5929
  --pf-t--global--color--status--read--on-secondary: var(--pf-t--global--background--color--control--default);
5904
- --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
5905
5930
  --pf-t--global--color--status--unread--attention--hover: var(--pf-t--global--color--status--danger--hover);
5931
+ --pf-t--global--color--status--unread--attention--clicked: var(--pf-t--global--color--status--danger--clicked);
5906
5932
  --pf-t--global--color--status--unread--attention--default: var(--pf-t--global--color--status--danger--default);
5907
5933
  --pf-t--global--color--status--unread--default--clicked: var(--pf-t--global--color--brand--clicked);
5908
5934
  --pf-t--global--color--status--unread--default--hover: var(--pf-t--global--color--brand--hover);
@@ -10174,7 +10200,7 @@ ol) {
10174
10200
  --pf-v6-c-data-list--FontSize: var( --pf-t--global--font--size--body);
10175
10201
  --pf-v6-c-data-list--LineHeight: var(--pf-t--global--font--line-height--body);
10176
10202
  --pf-v6-c-data-list--BorderBlockStartColor: var(--pf-t--global--border--color--default);
10177
- --pf-v6-c-data-list--BorderBlockStartWidth: var(--pf-t--global--spacer--sm);
10203
+ --pf-v6-c-data-list--BorderBlockStartWidth: var(--pf-t--global--border--width--strong);
10178
10204
  --pf-v6-c-data-list--sm--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
10179
10205
  --pf-v6-c-data-list--sm--BorderBlockStartColor: var(--pf-t--global--border--color--default);
10180
10206
  --pf-v6-c-data-list--MarginInlineStart: var(--pf-t--global--spacer--md);
@@ -10183,7 +10209,7 @@ ol) {
10183
10209
  --pf-v6-c-data-list__item--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
10184
10210
  --pf-v6-c-data-list__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
10185
10211
  --pf-v6-c-data-list__item--BorderBlockEndColor: var(--pf-t--global--border--color--default);
10186
- --pf-v6-c-data-list__item--BorderBlockEndWidth: var(--pf-t--global--spacer--sm);
10212
+ --pf-v6-c-data-list__item--BorderBlockEndWidth: var(--pf-t--global--border--width--strong);
10187
10213
  --pf-v6-c-data-list__item--sm--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
10188
10214
  --pf-v6-c-data-list__item--sm--BorderBlockEndColor: var(--pf-t--global--border--color--default);
10189
10215
  --pf-v6-c-data-list__item-row--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -21809,32 +21835,7 @@ ul.pf-v6-c-list {
21809
21835
  --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
21810
21836
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--md);
21811
21837
  --pf-v6-c-page--xl--inset: var(--pf-t--global--spacer--xl);
21812
- --pf-v6-c-page__header--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
21813
- --pf-v6-c-page__header--ZIndex: var(--pf-t--global--z-index--md);
21814
- --pf-v6-c-page__header--MinHeight: 4.75rem;
21815
- --pf-v6-c-page__header-brand--PaddingInlineStart: var(--pf-t--global--spacer--md);
21816
- --pf-v6-c-page__header-brand--xl--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
21817
- --pf-v6-c-page__header-brand--xl--PaddingInlineStart: var(--pf-t--global--spacer--xl);
21818
- --pf-v6-c-page__header-sidebar-toggle__c-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
21819
- --pf-v6-c-page__header-sidebar-toggle__c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
21820
- --pf-v6-c-page__header-sidebar-toggle__c-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
21821
- --pf-v6-c-page__header-sidebar-toggle__c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
21822
- --pf-v6-c-page__header-sidebar-toggle__c-button--MarginInlineEnd: var(--pf-t--global--spacer--md);
21823
- --pf-v6-c-page__header-sidebar-toggle__c-button--MarginInlineStart: calc(var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingInlineStart) * -1);
21824
- --pf-v6-c-page__header-sidebar-toggle__c-button--FontSize: var(--pf-t--global--icon--size--lg);
21825
- --pf-v6-c-page__header-brand-link--c-brand--MaxHeight: 3.75rem;
21826
- --pf-v6-c-page__header-nav--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
21827
- --pf-v6-c-page__header-nav--xl--BackgroundColor: transparent;
21828
- --pf-v6-c-page__header-nav--xl--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
21829
- --pf-v6-c-page__header-nav--xl--PaddingInlineStart: var(--pf-t--global--spacer--xl);
21830
- --pf-v6-c-page__header-tools--MarginInlineEnd: var(--pf-t--global--spacer--md);
21831
- --pf-v6-c-page__header-tools--xl--MarginInlineEnd: var(--pf-t--global--spacer--lg);
21832
- --pf-v6-c-page__header-tools--c-avatar--MarginInlineStart: var(--pf-t--global--spacer--md);
21833
- --pf-v6-c-page__header-tools-group--MarginInlineStart: var(--pf-t--global--spacer--xl);
21834
- --pf-v6-c-page__header-tools-group--Display: flex;
21835
- --pf-v6-c-page__header-tools-item--Display: block;
21836
- --pf-v6-c-page__header-tools--c-button--m-selected--before--Width: auto;
21837
- --pf-v6-c-page__header-tools--c-button--m-selected--before--Height: auto;
21838
+ --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
21838
21839
  --pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
21839
21840
  --pf-v6-c-page__sidebar--Width: 18.125rem;
21840
21841
  --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
@@ -21918,22 +21919,9 @@ ul.pf-v6-c-list {
21918
21919
  }
21919
21920
  @media (min-width: 1200px) {
21920
21921
  :where(:root, .pf-v6-c-page) {
21921
- --pf-v6-c-page__header-brand--PaddingInlineStart: var(--pf-v6-c-page__header-brand--xl--PaddingInlineStart);
21922
21922
  --pf-v6-c-page--inset: var(--pf-v6-c-page--xl--inset);
21923
21923
  }
21924
21924
  }
21925
- @media screen and (min-width: 1200px) {
21926
- :where(:root, .pf-v6-c-page) {
21927
- --pf-v6-c-page__header-nav--BackgroundColor: var(--pf-v6-c-page__header-nav--xl--BackgroundColor);
21928
- --pf-v6-c-page__header-nav--PaddingInlineEnd: var(--pf-v6-c-page__header-nav--xl--PaddingInlineEnd);
21929
- --pf-v6-c-page__header-nav--PaddingInlineStart: var(--pf-v6-c-page__header-nav--xl--PaddingInlineStart);
21930
- }
21931
- }
21932
- @media screen and (min-width: 1200px) {
21933
- :where(:root, .pf-v6-c-page) {
21934
- --pf-v6-c-page__header-tools--MarginInlineEnd: var(--pf-v6-c-page__header-tools--xl--MarginInlineEnd);
21935
- }
21936
- }
21937
21925
  @media screen and (min-width: 1200px) {
21938
21926
  :where(:root, .pf-v6-c-page) {
21939
21927
  --pf-v6-c-page__sidebar--TranslateX: var(--pf-v6-c-page__sidebar--xl--TranslateX);
@@ -21957,201 +21945,11 @@ ul.pf-v6-c-list {
21957
21945
  }
21958
21946
  }
21959
21947
 
21960
- .pf-v6-c-page__header,
21961
21948
  .pf-v6-c-page > .pf-v6-c-masthead {
21962
- z-index: var(--pf-v6-c-page__header--ZIndex);
21949
+ z-index: var(--pf-v6-c-page--c-masthead--ZIndex);
21963
21950
  grid-area: header;
21964
21951
  }
21965
21952
 
21966
- .pf-v6-c-page__header {
21967
- display: grid;
21968
- grid-template-columns: auto auto;
21969
- align-items: center;
21970
- min-width: 0;
21971
- min-height: var(--pf-v6-c-page__header--MinHeight);
21972
- background-color: var(--pf-v6-c-page__header--BackgroundColor);
21973
- }
21974
- .pf-v6-c-page__header > * {
21975
- display: flex;
21976
- align-items: center;
21977
- }
21978
- @media screen and (min-width: 992px) {
21979
- .pf-v6-c-page__header {
21980
- grid-template-columns: auto 1fr auto;
21981
- }
21982
- }
21983
- .pf-v6-c-page__header .pf-v6-c-masthead {
21984
- grid-column: span 2;
21985
- align-self: stretch;
21986
- }
21987
-
21988
- .pf-v6-c-page__header-brand {
21989
- grid-column: 1/2;
21990
- padding-inline-start: var(--pf-v6-c-page__header-brand--PaddingInlineStart);
21991
- }
21992
- @media (min-width: 1200px) {
21993
- .pf-v6-c-page__header-brand {
21994
- padding-inline-end: var(--pf-v6-c-page__header-brand--xl--PaddingInlineEnd);
21995
- }
21996
- }
21997
-
21998
- .pf-v6-c-page__header-brand-link {
21999
- display: flex;
22000
- flex: 1;
22001
- align-items: center;
22002
- }
22003
- .pf-v6-c-page__header-brand-link .pf-v6-c-brand {
22004
- max-height: var(--pf-v6-c-page__header-brand-link--c-brand--MaxHeight);
22005
- }
22006
-
22007
- .pf-v6-c-page__header-brand-toggle .pf-v6-c-button {
22008
- padding-block-start: var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingBlockStart);
22009
- padding-block-end: var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingBlockEnd);
22010
- padding-inline-start: var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingInlineStart);
22011
- padding-inline-end: var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingInlineEnd);
22012
- margin-inline-start: var(--pf-v6-c-page__header-sidebar-toggle__c-button--MarginInlineStart);
22013
- margin-inline-end: var(--pf-v6-c-page__header-sidebar-toggle__c-button--MarginInlineEnd);
22014
- font-size: var(--pf-v6-c-page__header-sidebar-toggle__c-button--FontSize);
22015
- line-height: 1;
22016
- }
22017
-
22018
- .pf-v6-c-page__header-nav {
22019
- grid-row: 2/3;
22020
- grid-column: 1/-1;
22021
- align-self: stretch;
22022
- min-width: 0;
22023
- padding-inline-start: var(--pf-v6-c-page__header-nav--PaddingInlineStart);
22024
- padding-inline-end: var(--pf-v6-c-page__header-nav--PaddingInlineEnd);
22025
- background-color: var(--pf-v6-c-page__header-nav--BackgroundColor);
22026
- }
22027
- @media screen and (min-width: 1200px) {
22028
- .pf-v6-c-page__header-nav {
22029
- grid-row: 1/2;
22030
- grid-column: 2/3;
22031
- }
22032
- }
22033
- .pf-v6-c-page__header-nav .pf-v6-c-nav {
22034
- align-self: stretch;
22035
- }
22036
-
22037
- .pf-v6-c-page__header-tools {
22038
- grid-column: 2/3;
22039
- margin-inline-start: auto;
22040
- margin-inline-end: var(--pf-v6-c-page__header-tools--MarginInlineEnd);
22041
- }
22042
- .pf-v6-c-page__header-tools .pf-v6-c-avatar {
22043
- margin-inline-start: var(--pf-v6-c-page__header-tools--c-avatar--MarginInlineStart);
22044
- }
22045
- @media screen and (min-width: 992px) {
22046
- .pf-v6-c-page__header-tools {
22047
- grid-column: 3/4;
22048
- }
22049
- }
22050
-
22051
- .pf-v6-c-page__header-tools-group {
22052
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-page__header-tools-group--Display);
22053
- --pf-v6-hidden-visible--hidden--Display: none;
22054
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22055
- display: var(--pf-v6-hidden-visible--Display);
22056
- align-items: center;
22057
- }
22058
- .pf-v6-c-page__header-tools-group.pf-m-hidden {
22059
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22060
- }
22061
- @media screen and (min-width: 576px) {
22062
- .pf-v6-c-page__header-tools-group.pf-m-hidden-on-sm {
22063
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22064
- }
22065
- .pf-v6-c-page__header-tools-group.pf-m-visible-on-sm {
22066
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22067
- }
22068
- }
22069
- @media screen and (min-width: 768px) {
22070
- .pf-v6-c-page__header-tools-group.pf-m-hidden-on-md {
22071
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22072
- }
22073
- .pf-v6-c-page__header-tools-group.pf-m-visible-on-md {
22074
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22075
- }
22076
- }
22077
- @media screen and (min-width: 992px) {
22078
- .pf-v6-c-page__header-tools-group.pf-m-hidden-on-lg {
22079
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22080
- }
22081
- .pf-v6-c-page__header-tools-group.pf-m-visible-on-lg {
22082
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22083
- }
22084
- }
22085
- @media screen and (min-width: 1200px) {
22086
- .pf-v6-c-page__header-tools-group.pf-m-hidden-on-xl {
22087
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22088
- }
22089
- .pf-v6-c-page__header-tools-group.pf-m-visible-on-xl {
22090
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22091
- }
22092
- }
22093
- @media screen and (min-width: 1450px) {
22094
- .pf-v6-c-page__header-tools-group.pf-m-hidden-on-2xl {
22095
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22096
- }
22097
- .pf-v6-c-page__header-tools-group.pf-m-visible-on-2xl {
22098
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22099
- }
22100
- }
22101
- .pf-v6-c-page__header-tools-group + .pf-v6-c-page__header-tools-group {
22102
- margin-inline-start: var(--pf-v6-c-page__header-tools-group--MarginInlineStart);
22103
- }
22104
-
22105
- .pf-v6-c-page__header-tools-item {
22106
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-page__header-tools-item--Display);
22107
- --pf-v6-hidden-visible--hidden--Display: none;
22108
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22109
- display: var(--pf-v6-hidden-visible--Display);
22110
- }
22111
- .pf-v6-c-page__header-tools-item.pf-m-hidden {
22112
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22113
- }
22114
- @media screen and (min-width: 576px) {
22115
- .pf-v6-c-page__header-tools-item.pf-m-hidden-on-sm {
22116
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22117
- }
22118
- .pf-v6-c-page__header-tools-item.pf-m-visible-on-sm {
22119
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22120
- }
22121
- }
22122
- @media screen and (min-width: 768px) {
22123
- .pf-v6-c-page__header-tools-item.pf-m-hidden-on-md {
22124
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22125
- }
22126
- .pf-v6-c-page__header-tools-item.pf-m-visible-on-md {
22127
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22128
- }
22129
- }
22130
- @media screen and (min-width: 992px) {
22131
- .pf-v6-c-page__header-tools-item.pf-m-hidden-on-lg {
22132
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22133
- }
22134
- .pf-v6-c-page__header-tools-item.pf-m-visible-on-lg {
22135
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22136
- }
22137
- }
22138
- @media screen and (min-width: 1200px) {
22139
- .pf-v6-c-page__header-tools-item.pf-m-hidden-on-xl {
22140
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22141
- }
22142
- .pf-v6-c-page__header-tools-item.pf-m-visible-on-xl {
22143
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22144
- }
22145
- }
22146
- @media screen and (min-width: 1450px) {
22147
- .pf-v6-c-page__header-tools-item.pf-m-hidden-on-2xl {
22148
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
22149
- }
22150
- .pf-v6-c-page__header-tools-item.pf-m-visible-on-2xl {
22151
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
22152
- }
22153
- }
22154
-
22155
21953
  .pf-v6-c-page__sidebar {
22156
21954
  z-index: var(--pf-v6-c-page__sidebar--ZIndex);
22157
21955
  display: flex;