@patternfly/patternfly 6.0.0-alpha.114 → 6.0.0-alpha.115

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 (104) hide show
  1. package/assets/images/pf_logo.svg +11 -11
  2. package/assets/images/pf_logo_white.svg +2 -2
  3. package/base/_chart-globals.scss +320 -320
  4. package/base/_fa-icons.scss +2 -2
  5. package/base/_fonts.scss +16 -16
  6. package/base/_globals.scss +4 -11
  7. package/base/_variables.scss +221 -221
  8. package/base/patternfly-globals.css +2 -6
  9. package/base/patternfly-variables.css +13 -9
  10. package/base/themes/dark/_chart-globals.scss +25 -25
  11. package/base/tokens/_tokens-font.scss +8 -0
  12. package/components/AboutModalBox/about-modal-box.css +1 -1
  13. package/components/AboutModalBox/about-modal-box.scss +1 -1
  14. package/components/Alert/alert-group.css +1 -1
  15. package/components/Alert/alert-group.scss +1 -1
  16. package/components/Alert/alert.css +1 -1
  17. package/components/Alert/alert.scss +1 -1
  18. package/components/AppLauncher/app-launcher.css +1 -1
  19. package/components/AppLauncher/app-launcher.scss +1 -1
  20. package/components/Banner/banner.css +1 -1
  21. package/components/Banner/banner.scss +1 -1
  22. package/components/Button/button.css +3 -3
  23. package/components/Button/button.scss +3 -3
  24. package/components/Card/card.css +1 -1
  25. package/components/Card/card.scss +1 -1
  26. package/components/Content/content.css +1 -1
  27. package/components/Content/content.scss +1 -1
  28. package/components/ContextSelector/context-selector.css +1 -1
  29. package/components/ContextSelector/context-selector.scss +1 -1
  30. package/components/Drawer/drawer.css +2 -2
  31. package/components/Drawer/drawer.scss +2 -2
  32. package/components/Dropdown/dropdown.css +2 -2
  33. package/components/Dropdown/dropdown.scss +2 -2
  34. package/components/DualListSelector/dual-list-selector.css +1 -1
  35. package/components/DualListSelector/dual-list-selector.scss +3 -3
  36. package/components/Form/form.css +1 -1
  37. package/components/Form/form.scss +1 -1
  38. package/components/JumpLinks/jump-links.css +1 -1
  39. package/components/JumpLinks/jump-links.scss +1 -1
  40. package/components/List/list.css +1 -1
  41. package/components/List/list.scss +1 -1
  42. package/components/Menu/menu.css +4 -4
  43. package/components/Menu/menu.scss +4 -4
  44. package/components/ModalBox/modal-box.css +1 -1
  45. package/components/ModalBox/modal-box.scss +1 -1
  46. package/components/Nav/nav.css +1 -1
  47. package/components/Nav/nav.scss +1 -1
  48. package/components/OptionsMenu/options-menu.css +1 -1
  49. package/components/OptionsMenu/options-menu.scss +1 -1
  50. package/components/Page/page.css +8 -8
  51. package/components/Page/page.scss +14 -14
  52. package/components/ProgressStepper/progress-stepper.css +1 -1
  53. package/components/ProgressStepper/progress-stepper.scss +1 -1
  54. package/components/Select/select.css +1 -1
  55. package/components/Select/select.scss +1 -1
  56. package/components/Sidebar/sidebar.css +1 -1
  57. package/components/Sidebar/sidebar.scss +1 -1
  58. package/components/SkipToContent/skip-to-content.css +1 -1
  59. package/components/SkipToContent/skip-to-content.scss +1 -1
  60. package/components/Table/table.css +1 -1
  61. package/components/Table/table.scss +1 -1
  62. package/components/Toolbar/toolbar.css +1 -1
  63. package/components/Toolbar/toolbar.scss +1 -1
  64. package/components/TreeView/tree-view.scss +2 -2
  65. package/components/Wizard/wizard.css +1 -1
  66. package/components/Wizard/wizard.scss +1 -1
  67. package/docs/components/NotificationBadge/examples/NotificationBadge.md +18 -18
  68. package/docs/components/ProgressStepper/examples/ProgressStepper.md +15 -15
  69. package/docs/components/Table/examples/Table.md +2 -2
  70. package/docs/components/Tabs/examples/Tabs.md +102 -102
  71. package/docs/demos/Card/examples/Card.md +152 -115
  72. package/docs/demos/Dashboard/examples/Dashboard.md +5 -5
  73. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +5 -5
  74. package/docs/demos/Table/examples/Table.md +2 -2
  75. package/docs/demos/Toolbar/examples/Toolbar.css +3 -3
  76. package/docs/utilities/Text/examples/Text.md +0 -1
  77. package/package.json +1 -1
  78. package/patternfly-base-no-globals-theme-dark-unversioned.css +13 -69
  79. package/patternfly-base-no-globals-theme-dark-unversioned.scss +2 -2
  80. package/patternfly-base-no-globals.css +13 -69
  81. package/patternfly-base-no-globals.scss +2 -2
  82. package/patternfly-base-theme-dark-unversioned.css +15 -71
  83. package/patternfly-base.css +15 -71
  84. package/patternfly-base.scss +0 -1
  85. package/patternfly-charts.scss +319 -319
  86. package/patternfly-no-globals.css +60 -89
  87. package/patternfly-no-globals.scss +2 -2
  88. package/patternfly-theme-dark-unversioned.css +84 -113
  89. package/patternfly-theme-dark-unversioned.scss +1 -1
  90. package/patternfly.css +62 -91
  91. package/patternfly.min.css +1 -1
  92. package/patternfly.min.css.map +1 -1
  93. package/sass-utilities/_init.scss +3 -3
  94. package/sass-utilities/colors.scss +81 -81
  95. package/sass-utilities/functions.scss +2 -2
  96. package/sass-utilities/mixins.scss +1 -1
  97. package/sass-utilities/scss-variables.scss +149 -149
  98. package/sass-utilities/themes/dark/colors.scss +15 -15
  99. package/sass-utilities/themes/dark/scss-variables.scss +74 -74
  100. package/themes/dark/_patternfly-charts-theme-dark.scss +25 -25
  101. package/base/_themes.scss +0 -43
  102. package/base/patternfly-themes.css +0 -82
  103. package/base/patternfly-themes.scss +0 -2
  104. package/base/themes/dark/_globals.scss +0 -5
package/docs/demos/Card/examples/Card.md CHANGED
@@ -545,10 +545,11 @@ wrapperTag: div
545
545
  <h2 class="pf-v6-c-card__title-text">5 Clusters</h2>
546
546
  </div>
547
547
  <div class="pf-v6-c-card__body">
548
- <i
549
- class="fas fa-check-circle pf-v6-u-icon-color-status-success"
550
- aria-hidden="true"
551
- ></i>
548
+ <span class="pf-v6-c-icon">
549
+ <span class="pf-v6-c-icon__content pf-m-success">
550
+ <i class="fas fa-check-circle" aria-hidden="true"></i>
551
+ </span>
552
+ </span>
552
553
  </div>
553
554
  </div>
554
555
  <div class="pf-v6-c-card pf-v6-u-text-align-center">
@@ -556,10 +557,11 @@ wrapperTag: div
556
557
  <h2 class="pf-v6-c-card__title-text">15 Clusters</h2>
557
558
  </div>
558
559
  <div class="pf-v6-c-card__body">
559
- <i
560
- class="fas fa-exclamation-triangle pf-v6-u-icon-status-warning"
561
- aria-hidden="true"
562
- ></i>
560
+ <span class="pf-v6-c-icon">
561
+ <span class="pf-v6-c-icon__content pf-m-warning">
562
+ <i class="fas fa-exclamation-triangle" aria-hidden="true"></i>
563
+ </span>
564
+ </span>
563
565
  </div>
564
566
  </div>
565
567
  <div class="pf-v6-c-card pf-v6-u-text-align-center">
@@ -567,10 +569,11 @@ wrapperTag: div
567
569
  <h2 class="pf-v6-c-card__title-text">3 Clusters</h2>
568
570
  </div>
569
571
  <div class="pf-v6-c-card__body">
570
- <i
571
- class="fas fa-times-circle pf-v6-u-icon-color-status-danger"
572
- aria-hidden="true"
573
- ></i>
572
+ <span class="pf-v6-c-icon">
573
+ <span class="pf-v6-c-icon__content pf-m-danger">
574
+ <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
575
+ </span>
576
+ </span>
574
577
  </div>
575
578
  </div>
576
579
  </div>
@@ -585,10 +588,11 @@ wrapperTag: div
585
588
  <div class="pf-v6-l-flex pf-m-inline-flex pf-m-space-items-md">
586
589
  <div class="pf-v6-l-flex pf-m-space-items-sm">
587
590
  <div class="pf-v6-l-flex__item">
588
- <i
589
- class="fas fa-exclamation-circle pf-v6-u-icon-color-status-success"
590
- aria-hidden="true"
591
- ></i>
591
+ <span class="pf-v6-c-icon">
592
+ <span class="pf-v6-c-icon__content pf-m-success">
593
+ <i class="fas fa-check-circle" aria-hidden="true"></i>
594
+ </span>
595
+ </span>
592
596
  </div>
593
597
  <div class="pf-v6-l-flex__item">
594
598
  <a href="#">2</a>
@@ -597,10 +601,11 @@ wrapperTag: div
597
601
  <hr class="pf-v6-c-divider pf-m-vertical" />
598
602
  <div class="pf-v6-l-flex pf-m-space-items-sm">
599
603
  <div class="pf-v6-l-flex__item">
600
- <i
601
- class="fas fa-exclamation-triangle pf-v6-u-icon-color-status-warning"
602
- aria-hidden="true"
603
- ></i>
604
+ <span class="pf-v6-c-icon">
605
+ <span class="pf-v6-c-icon__content pf-m-warning">
606
+ <i class="fas fa-exclamation-triangle" aria-hidden="true"></i>
607
+ </span>
608
+ </span>
604
609
  </div>
605
610
  <div class="pf-v6-l-flex__item">
606
611
  <a href="#">1</a>
@@ -617,10 +622,11 @@ wrapperTag: div
617
622
  <div class="pf-v6-l-flex pf-m-inline-flex pf-m-space-items-md">
618
623
  <div class="pf-v6-l-flex pf-m-space-items-sm">
619
624
  <div class="pf-v6-l-flex__item">
620
- <i
621
- class="fas fa-check-circle pf-v6-u-icon-color-status-success"
622
- aria-hidden="true"
623
- ></i>
625
+ <span class="pf-v6-c-icon">
626
+ <span class="pf-v6-c-icon__content pf-m-success">
627
+ <i class="fas fa-check-circle" aria-hidden="true"></i>
628
+ </span>
629
+ </span>
624
630
  </div>
625
631
  <div class="pf-v6-l-flex__item">
626
632
  <a href="#">5</a>
@@ -629,10 +635,11 @@ wrapperTag: div
629
635
  <hr class="pf-v6-c-divider pf-m-vertical" />
630
636
  <div class="pf-v6-l-flex pf-m-space-items-sm">
631
637
  <div class="pf-v6-l-flex__item">
632
- <i
633
- class="fas fa-times-circle pf-v6-u-icon-color-status-danger"
634
- aria-hidden="true"
635
- ></i>
638
+ <span class="pf-v6-c-icon">
639
+ <span class="pf-v6-c-icon__content pf-m-danger">
640
+ <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
641
+ </span>
642
+ </span>
636
643
  </div>
637
644
  <div class="pf-v6-l-flex__item">
638
645
  <a href="#">12</a>
@@ -649,10 +656,11 @@ wrapperTag: div
649
656
  <div class="pf-v6-l-flex pf-m-inline-flex pf-m-space-items-md">
650
657
  <div class="pf-v6-l-flex pf-m-space-items-sm">
651
658
  <div class="pf-v6-l-flex__item">
652
- <i
653
- class="fas fa-exclamation-triangle pf-v6-u-icon-color-status-warning"
654
- aria-hidden="true"
655
- ></i>
659
+ <span class="pf-v6-c-icon">
660
+ <span class="pf-v6-c-icon__content pf-m-warning">
661
+ <i class="fas fa-exclamation-triangle" aria-hidden="true"></i>
662
+ </span>
663
+ </span>
656
664
  </div>
657
665
  <div class="pf-v6-l-flex__item">
658
666
  <a href="#">2</a>
@@ -661,10 +669,11 @@ wrapperTag: div
661
669
  <hr class="pf-v6-c-divider pf-m-vertical" />
662
670
  <div class="pf-v6-l-flex pf-m-space-items-sm">
663
671
  <div class="pf-v6-l-flex__item">
664
- <i
665
- class="fas fa-times-circle pf-v6-u-icon-color-status-danger"
666
- aria-hidden="true"
667
- ></i>
672
+ <span class="pf-v6-c-icon">
673
+ <span class="pf-v6-c-icon__content pf-m-danger">
674
+ <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
675
+ </span>
676
+ </span>
668
677
  </div>
669
678
  <div class="pf-v6-l-flex__item">
670
679
  <a href="#">7</a>
@@ -692,10 +701,11 @@ wrapperTag: div
692
701
  >
693
702
  <div class="pf-v6-l-flex pf-m-space-items-sm">
694
703
  <div class="pf-v6-l-flex__item">
695
- <i
696
- class="fas fa-times-circle pf-v6-u-icon-color-status-danger"
697
- aria-hidden="true"
698
- ></i>
704
+ <span class="pf-v6-c-icon">
705
+ <span class="pf-v6-c-icon__content pf-m-danger">
706
+ <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
707
+ </span>
708
+ </span>
699
709
  </div>
700
710
  <div class="pf-v6-l-stack">
701
711
  <a href="#">2 errors</a>
@@ -704,10 +714,11 @@ wrapperTag: div
704
714
  </div>
705
715
  <div class="pf-v6-l-flex pf-m-space-items-sm">
706
716
  <div class="pf-v6-l-flex__item">
707
- <i
708
- class="fas fa-exclamation-triangle pf-v6-u-icon-color-status-warning"
709
- aria-hidden="true"
710
- ></i>
717
+ <span class="pf-v6-c-icon">
718
+ <span class="pf-v6-c-icon__content pf-m-warning">
719
+ <i class="fas fa-exclamation-triangle" aria-hidden="true"></i>
720
+ </span>
721
+ </span>
711
722
  </div>
712
723
  <div class="pf-v6-l-stack">
713
724
  <a href="#">1 warnings</a>
@@ -727,10 +738,11 @@ wrapperTag: div
727
738
  >
728
739
  <div class="pf-v6-l-flex pf-m-space-items-sm">
729
740
  <div class="pf-v6-l-flex__item">
730
- <i
731
- class="fas fa-check-circle pf-v6-u-icon-color-status-success"
732
- aria-hidden="true"
733
- ></i>
741
+ <span class="pf-v6-c-icon">
742
+ <span class="pf-v6-c-icon__content pf-m-success">
743
+ <i class="fas fa-check-circle" aria-hidden="true"></i>
744
+ </span>
745
+ </span>
734
746
  </div>
735
747
  <div class="pf-v6-l-stack">
736
748
  <a href="#">2 successes</a>
@@ -739,10 +751,11 @@ wrapperTag: div
739
751
  </div>
740
752
  <div class="pf-v6-l-flex pf-m-space-items-sm">
741
753
  <div class="pf-v6-l-flex__item">
742
- <i
743
- class="fas fa-exclamation-triangle pf-v6-u-icon-color-status-warning"
744
- aria-hidden="true"
745
- ></i>
754
+ <span class="pf-v6-c-icon">
755
+ <span class="pf-v6-c-icon__content pf-m-warning">
756
+ <i class="fas fa-exclamation-triangle" aria-hidden="true"></i>
757
+ </span>
758
+ </span>
746
759
  </div>
747
760
  <div class="pf-v6-l-stack">
748
761
  <a href="#">3 warnings</a>
@@ -762,10 +775,11 @@ wrapperTag: div
762
775
  >
763
776
  <div class="pf-v6-l-flex pf-m-space-items-sm">
764
777
  <div class="pf-v6-l-flex__item">
765
- <i
766
- class="fas fa-exclamation-triangle pf-v6-u-icon-color-status-warning"
767
- aria-hidden="true"
768
- ></i>
778
+ <span class="pf-v6-c-icon">
779
+ <span class="pf-v6-c-icon__content pf-m-warning">
780
+ <i class="fas fa-exclamation-triangle" aria-hidden="true"></i>
781
+ </span>
782
+ </span>
769
783
  </div>
770
784
  <div class="pf-v6-l-stack">
771
785
  <a href="#">7 warnings</a>
@@ -774,10 +788,11 @@ wrapperTag: div
774
788
  </div>
775
789
  <div class="pf-v6-l-flex pf-m-space-items-sm">
776
790
  <div class="pf-v6-l-flex__item">
777
- <i
778
- class="fas fa-times-circle pf-v6-u-icon-color-status-danger"
779
- aria-hidden="true"
780
- ></i>
791
+ <span class="pf-v6-c-icon">
792
+ <span class="pf-v6-c-icon__content pf-m-danger">
793
+ <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
794
+ </span>
795
+ </span>
781
796
  </div>
782
797
  <div class="pf-v6-l-stack">
783
798
  <a href="#">1 error</a>
@@ -2020,10 +2035,11 @@ wrapperTag: div
2020
2035
  <div class="pf-v6-l-flex pf-m-column">
2021
2036
  <span>System</span>
2022
2037
  <div class="pf-v6-l-flex pf-m-space-items-sm">
2023
- <i
2024
- class="fas fa-exclamation-circle pf-v6-u-icon-color-status-danger"
2025
- aria-hidden="true"
2026
- ></i>
2038
+ <span class="pf-v6-c-icon">
2039
+ <span class="pf-v6-c-icon__content pf-m-danger">
2040
+ <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
2041
+ </span>
2042
+ </span>
2027
2043
  <a hfer="#">25 incidents detected</a>
2028
2044
  </div>
2029
2045
  <div class="ws-chart">
@@ -2100,7 +2116,7 @@ wrapperTag: div
2100
2116
  class="pf-v6-c-card__title"
2101
2117
  id="nested-cards-toggle-right-example-group-1-title"
2102
2118
  >
2103
- <h2 class="pf-v6-c-card__title-text pf-v6-u-font-weight-light">CPU 1</h2>
2119
+ <h2 class="pf-v6-c-card__title-text">CPU 1</h2>
2104
2120
  </div>
2105
2121
  </div>
2106
2122
  </div>
@@ -2211,7 +2227,7 @@ wrapperTag: div
2211
2227
  class="pf-v6-c-card__title"
2212
2228
  id="nested-cards-toggle-right-example-group-2-title"
2213
2229
  >
2214
- <h2 class="pf-v6-c-card__title-text pf-v6-u-font-weight-light">CPU 2</h2>
2230
+ <h2 class="pf-v6-c-card__title-text">CPU 2</h2>
2215
2231
  </div>
2216
2232
  </div>
2217
2233
  </div>
@@ -2239,7 +2255,7 @@ wrapperTag: div
2239
2255
  class="pf-v6-c-card__title"
2240
2256
  id="nested-cards-toggle-right-example-group-3-title&quot;"
2241
2257
  >
2242
- <h2 class="pf-v6-c-card__title-text pf-v6-u-font-weight-light">CPU 3</h2>
2258
+ <h2 class="pf-v6-c-card__title-text">CPU 3</h2>
2243
2259
  </div>
2244
2260
  </div>
2245
2261
  </div>
@@ -2282,7 +2298,7 @@ wrapperTag: div
2282
2298
  class="pf-v6-c-card__title"
2283
2299
  id="nested-cards-example-group-1-title"
2284
2300
  >
2285
- <h2 class="pf-v6-c-card__title-text pf-v6-u-font-weight-light">CPU 1</h2>
2301
+ <h2 class="pf-v6-c-card__title-text">CPU 1</h2>
2286
2302
  </div>
2287
2303
  </div>
2288
2304
  </div>
@@ -2390,7 +2406,7 @@ wrapperTag: div
2390
2406
  class="pf-v6-c-card__title"
2391
2407
  id="nested-cards-example-group-2-title"
2392
2408
  >
2393
- <h2 class="pf-v6-c-card__title-text pf-v6-u-font-weight-light">CPU 2</h2>
2409
+ <h2 class="pf-v6-c-card__title-text">CPU 2</h2>
2394
2410
  </div>
2395
2411
  </div>
2396
2412
  </div>
@@ -2415,7 +2431,7 @@ wrapperTag: div
2415
2431
  class="pf-v6-c-card__title"
2416
2432
  id="nested-cards-example-group-3-title"
2417
2433
  >
2418
- <h2 class="pf-v6-c-card__title-text pf-v6-u-font-weight-light">CPU 3</h2>
2434
+ <h2 class="pf-v6-c-card__title-text">CPU 3</h2>
2419
2435
  </div>
2420
2436
  </div>
2421
2437
  </div>
@@ -2443,9 +2459,7 @@ wrapperTag: div
2443
2459
  type="button"
2444
2460
  aria-expanded="true"
2445
2461
  >
2446
- <span class="pf-v6-c-accordion__toggle-text">
2447
- <span class="pf-v6-u-font-weight-light">CPU 1</span>
2448
- </span>
2462
+ <span class="pf-v6-c-accordion__toggle-text">CPU 1</span>
2449
2463
  <span class="pf-v6-c-accordion__toggle-icon">
2450
2464
  <i class="fas fa-angle-right" aria-hidden="true"></i>
2451
2465
  </span>
@@ -2541,9 +2555,7 @@ wrapperTag: div
2541
2555
  type="button"
2542
2556
  aria-expanded="false"
2543
2557
  >
2544
- <span class="pf-v6-c-accordion__toggle-text">
2545
- <span class="pf-v6-u-font-weight-light">CPU 2</span>
2546
- </span>
2558
+ <span class="pf-v6-c-accordion__toggle-text">CPU 2</span>
2547
2559
  <span class="pf-v6-c-accordion__toggle-icon">
2548
2560
  <i class="fas fa-angle-right" aria-hidden="true"></i>
2549
2561
  </span>
@@ -2637,9 +2649,7 @@ wrapperTag: div
2637
2649
  type="button"
2638
2650
  aria-expanded="false"
2639
2651
  >
2640
- <span class="pf-v6-c-accordion__toggle-text">
2641
- <span class="pf-v6-u-font-weight-light">CPU 3</span>
2642
- </span>
2652
+ <span class="pf-v6-c-accordion__toggle-text">CPU 3</span>
2643
2653
  <span class="pf-v6-c-accordion__toggle-icon">
2644
2654
  <i class="fas fa-angle-right" aria-hidden="true"></i>
2645
2655
  </span>
@@ -2955,9 +2965,12 @@ wrapperTag: div
2955
2965
  </dd>
2956
2966
  <dd class="pf-v6-c-description-list__description">
2957
2967
  <div class="pf-v6-c-description-list__text">
2958
- <time
2959
- class="pf-v6-u-text-color-subtle pf-v6-u-font-size-sm"
2960
- >Jun 17, 11:02 am</time>
2968
+ <span class="pf-v6-c-timestamp">
2969
+ <time
2970
+ class="pf-v6-c-timestamp__text"
2971
+ datetime="2019-01-21T21:38"
2972
+ >Thursday, 21 January 2019, 9:38 PM EST</time>
2973
+ </span>
2961
2974
  </div>
2962
2975
  </dd>
2963
2976
  </div>
@@ -2970,9 +2983,12 @@ wrapperTag: div
2970
2983
  </dd>
2971
2984
  <dd class="pf-v6-c-description-list__description">
2972
2985
  <div class="pf-v6-c-description-list__text">
2973
- <time
2974
- class="pf-v6-u-text-color-subtle pf-v6-u-font-size-sm"
2975
- >Jun 17, 11:13 am</time>
2986
+ <span class="pf-v6-c-timestamp">
2987
+ <time
2988
+ class="pf-v6-c-timestamp__text"
2989
+ datetime="2019-01-21T21:34"
2990
+ >Thursday, 21 January 2019, 9:34 PM EST</time>
2991
+ </span>
2976
2992
  </div>
2977
2993
  </dd>
2978
2994
  </div>
@@ -2985,9 +3001,12 @@ wrapperTag: div
2985
3001
  </dd>
2986
3002
  <dd class="pf-v6-c-description-list__description">
2987
3003
  <div class="pf-v6-c-description-list__text">
2988
- <time
2989
- class="pf-v6-u-text-color-subtle pf-v6-u-font-size-sm"
2990
- >Jun 17, 10:59 am</time>
3004
+ <span class="pf-v6-c-timestamp">
3005
+ <time
3006
+ class="pf-v6-c-timestamp__text"
3007
+ datetime="2019-01-20T21:14"
3008
+ >Thursday, 21 January 2019, 8:14 PM EST</time>
3009
+ </span>
2991
3010
  </div>
2992
3011
  </dd>
2993
3012
  </div>
@@ -3000,9 +3019,12 @@ wrapperTag: div
3000
3019
  </dd>
3001
3020
  <dd class="pf-v6-c-description-list__description">
3002
3021
  <div class="pf-v6-c-description-list__text">
3003
- <time
3004
- class="pf-v6-u-text-color-subtle pf-v6-u-font-size-sm"
3005
- >Jun 17, 10:45 am</time>
3022
+ <span class="pf-v6-c-timestamp">
3023
+ <time
3024
+ class="pf-v6-c-timestamp__text"
3025
+ datetime="2019-01-21T19:18"
3026
+ >Thursday, 21 January 2019, 7:18 PM EST</time>
3027
+ </span>
3006
3028
  </div>
3007
3029
  </dd>
3008
3030
  </div>
@@ -3105,10 +3127,11 @@ wrapperTag: div
3105
3127
  <dt class="pf-v6-c-description-list__term">
3106
3128
  <div class="pf-v6-l-flex pf-m-nowrap pf-m-space-items-sm">
3107
3129
  <div class="pf-v6-l-flex__item">
3108
- <i
3109
- class="fas fa-exclamation-circle pf-v6-u-icon-color-status-danger"
3110
- aria-hidden="true"
3111
- ></i>
3130
+ <span class="pf-v6-c-icon">
3131
+ <span class="pf-v6-c-icon__content pf-m-danger">
3132
+ <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
3133
+ </span>
3134
+ </span>
3112
3135
  </div>
3113
3136
  <div class="pf-v6-l-flex__item">Readiness probe failed</div>
3114
3137
  </div>
@@ -3120,9 +3143,12 @@ wrapperTag: div
3120
3143
  </dd>
3121
3144
  <dd class="pf-v6-c-description-list__description">
3122
3145
  <div class="pf-v6-c-description-list__text">
3123
- <time
3124
- class="pf-v6-u-text-color-subtle pf-v6-u-font-size-sm"
3125
- >Jun 17, 11:02 am</time>
3146
+ <span class="pf-v6-c-timestamp">
3147
+ <time
3148
+ class="pf-v6-c-timestamp__text"
3149
+ datetime="2019-01-21T21:38"
3150
+ >Thursday, 21 January 2019, 9:38 PM EST</time>
3151
+ </span>
3126
3152
  </div>
3127
3153
  </dd>
3128
3154
  </div>
@@ -3130,10 +3156,11 @@ wrapperTag: div
3130
3156
  <dt class="pf-v6-c-description-list__term">
3131
3157
  <div class="pf-v6-l-flex pf-m-nowrap pf-m-space-items-sm">
3132
3158
  <div class="pf-v6-l-flex__item">
3133
- <i
3134
- class="fas fa-check-circle pf-v6-u-icon-color-status-success"
3135
- aria-hidden="true"
3136
- ></i>
3159
+ <span class="pf-v6-c-icon">
3160
+ <span class="pf-v6-c-icon__content pf-m-success">
3161
+ <i class="fas fa-check-circle" aria-hidden="true"></i>
3162
+ </span>
3163
+ </span>
3137
3164
  </div>
3138
3165
  <div class="pf-v6-l-flex__item">Successful assignment</div>
3139
3166
  </div>
@@ -3145,9 +3172,12 @@ wrapperTag: div
3145
3172
  </dd>
3146
3173
  <dd class="pf-v6-c-description-list__description">
3147
3174
  <div class="pf-v6-c-description-list__text">
3148
- <time
3149
- class="pf-v6-u-text-color-subtle pf-v6-u-font-size-sm"
3150
- >Jun 17, 11:13 am</time>
3175
+ <span class="pf-v6-c-timestamp">
3176
+ <time
3177
+ class="pf-v6-c-timestamp__text"
3178
+ datetime="2019-01-21T21:34"
3179
+ >Thursday, 21 January 2019, 9:34 PM EST</time>
3180
+ </span>
3151
3181
  </div>
3152
3182
  </dd>
3153
3183
  </div>
@@ -3180,9 +3210,12 @@ wrapperTag: div
3180
3210
  </dd>
3181
3211
  <dd class="pf-v6-c-description-list__description">
3182
3212
  <div class="pf-v6-c-description-list__text">
3183
- <time
3184
- class="pf-v6-u-text-color-subtle pf-v6-u-font-size-sm"
3185
- >Jun 17, 10:59 am</time>
3213
+ <span class="pf-v6-c-timestamp">
3214
+ <time
3215
+ class="pf-v6-c-timestamp__text"
3216
+ datetime="2019-01-21T20:14"
3217
+ >Thursday, 21 January 2019, 8:14 PM EST</time>
3218
+ </span>
3186
3219
  </div>
3187
3220
  </dd>
3188
3221
  </div>
@@ -3190,10 +3223,11 @@ wrapperTag: div
3190
3223
  <dt class="pf-v6-c-description-list__term">
3191
3224
  <div class="pf-v6-l-flex pf-m-nowrap pf-m-space-items-sm">
3192
3225
  <div class="pf-v6-l-flex__item">
3193
- <i
3194
- class="fas fa-check-circle pf-v6-u-icon-color-status-success"
3195
- aria-hidden="true"
3196
- ></i>
3226
+ <span class="pf-v6-c-icon">
3227
+ <span class="pf-v6-c-icon__content pf-m-success">
3228
+ <i class="fas fa-check-circle" aria-hidden="true"></i>
3229
+ </span>
3230
+ </span>
3197
3231
  </div>
3198
3232
  <div class="pf-v6-l-flex__item">Created container</div>
3199
3233
  </div>
@@ -3205,9 +3239,12 @@ wrapperTag: div
3205
3239
  </dd>
3206
3240
  <dd class="pf-v6-c-description-list__description">
3207
3241
  <div class="pf-v6-c-description-list__text">
3208
- <time
3209
- class="pf-v6-u-text-color-subtle pf-v6-u-font-size-sm"
3210
- >Jun 17, 10:45 am</time>
3242
+ <span class="pf-v6-c-timestamp">
3243
+ <time
3244
+ class="pf-v6-c-timestamp__text"
3245
+ datetime="2019-01-21T19:18"
3246
+ >Thursday, 21 January 2019, 7:18 PM EST</time>
3247
+ </span>
3211
3248
  </div>
3212
3249
  </dd>
3213
3250
  </div>
package/docs/demos/Dashboard/examples/Dashboard.md CHANGED
@@ -388,7 +388,7 @@ cssPrefix: pf-d-dashboard
388
388
  <span class="pf-v6-c-label__content">
389
389
  <span class="pf-v6-c-label__icon">
390
390
  <i
391
- class="pf-v5-pficon pf-v5-pficon-port"
391
+ class="pf-v6-pficon pf-v6-pficon-port"
392
392
  aria-hidden="true"
393
393
  ></i>
394
394
  </span>
@@ -425,7 +425,7 @@ cssPrefix: pf-d-dashboard
425
425
  style="row-gap: var(--pf-6-global--spacer--md);"
426
426
  >
427
427
  <i
428
- class="pf-v5-pficon pf-v5-pficon-on pf-v6-u-color-400"
428
+ class="pf-v6-pficon pf-v6-pficon-on pf-v6-u-color-400"
429
429
  style="line-height: 1"
430
430
  aria-hidden="true"
431
431
  ></i>
@@ -517,7 +517,7 @@ cssPrefix: pf-d-dashboard
517
517
  style="row-gap: var(--pf-6-global--spacer--md);"
518
518
  >
519
519
  <i
520
- class="pf-v5-pficon pf-v5-pficon-on pf-v6-u-danger-color-100"
520
+ class="pf-v6-pficon pf-v6-pficon-on pf-v6-u-danger-color-100"
521
521
  style="line-height: 1"
522
522
  aria-hidden="true"
523
523
  ></i>
@@ -572,7 +572,7 @@ cssPrefix: pf-d-dashboard
572
572
  <span class="pf-v6-c-label__content">
573
573
  <span class="pf-v6-c-label__icon">
574
574
  <i
575
- class="pf-v5-pficon pf-v5-pficon-automation"
575
+ class="pf-v6-pficon pf-v6-pficon-automation"
576
576
  aria-hidden="true"
577
577
  ></i>
578
578
  </span>
@@ -609,7 +609,7 @@ cssPrefix: pf-d-dashboard
609
609
  style="row-gap: var(--pf-6-global--spacer--md);"
610
610
  >
611
611
  <i
612
- class="pf-v5-pficon pf-v5-pficon-on pf-v6-u-color-400"
612
+ class="pf-v6-pficon pf-v6-pficon-on pf-v6-u-color-400"
613
613
  style="line-height: 1"
614
614
  aria-hidden="true"
615
615
  ></i>
package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md CHANGED
@@ -144,7 +144,7 @@ section: components
144
144
  aria-label="Notifications"
145
145
  >
146
146
  <span class="pf-v6-c-notification-badge pf-m-read">
147
- <i class="pf-v5-pficon-bell" aria-hidden="true"></i>
147
+ <i class="pf-v6-pficon-bell" aria-hidden="true"></i>
148
148
  </span>
149
149
  </button>
150
150
  </div>
@@ -1153,7 +1153,7 @@ section: components
1153
1153
  <span
1154
1154
  class="pf-v6-c-notification-badge pf-m-read pf-m-expanded"
1155
1155
  >
1156
- <i class="pf-v5-pficon-bell" aria-hidden="true"></i>
1156
+ <i class="pf-v6-pficon-bell" aria-hidden="true"></i>
1157
1157
  </span>
1158
1158
  </button>
1159
1159
  </div>
@@ -2162,7 +2162,7 @@ section: components
2162
2162
  <span
2163
2163
  class="pf-v6-c-notification-badge pf-m-unread pf-m-expanded"
2164
2164
  >
2165
- <i class="pf-v5-pficon-bell" aria-hidden="true"></i>
2165
+ <i class="pf-v6-pficon-bell" aria-hidden="true"></i>
2166
2166
  </span>
2167
2167
  </button>
2168
2168
  </div>
@@ -3174,7 +3174,7 @@ section: components
3174
3174
  <span
3175
3175
  class="pf-v6-c-notification-badge pf-m-attention pf-m-expanded"
3176
3176
  >
3177
- <i class="pf-v5-pficon-attention-bell" aria-hidden="true"></i>
3177
+ <i class="pf-v6-pficon-attention-bell" aria-hidden="true"></i>
3178
3178
  </span>
3179
3179
  </button>
3180
3180
  </div>
@@ -4185,7 +4185,7 @@ section: components
4185
4185
  <span
4186
4186
  class="pf-v6-c-notification-badge pf-m-unread pf-m-expanded"
4187
4187
  >
4188
- <i class="pf-v5-pficon-bell" aria-hidden="true"></i>
4188
+ <i class="pf-v6-pficon-bell" aria-hidden="true"></i>
4189
4189
  </span>
4190
4190
  </button>
4191
4191
  </div>
package/docs/demos/Table/examples/Table.md CHANGED
@@ -17716,7 +17716,7 @@ By default, table cell alignment is set to baseline. This retains vertical align
17716
17716
  aria-label="aria-label&#x3D;&quot;More info&quot;"
17717
17717
  >
17718
17718
  <i
17719
- class="pf-v5-pficon pf-v5-pficon-help"
17719
+ class="pf-v6-pficon pf-v6-pficon-help"
17720
17720
  aria-hidden="true"
17721
17721
  ></i>
17722
17722
  </button>
@@ -17760,7 +17760,7 @@ By default, table cell alignment is set to baseline. This retains vertical align
17760
17760
  aria-label="aria-label&#x3D;&quot;More info&quot;"
17761
17761
  >
17762
17762
  <i
17763
- class="pf-v5-pficon pf-v5-pficon-help"
17763
+ class="pf-v6-pficon pf-v6-pficon-help"
17764
17764
  aria-hidden="true"
17765
17765
  ></i>
17766
17766
  </button>
package/docs/demos/Toolbar/examples/Toolbar.css CHANGED
@@ -14,12 +14,12 @@
14
14
  min-height: 175px;
15
15
  }
16
16
 
17
- .pf-v5-c-menu-toggle + .pf-v5-c-panel {
17
+ .pf-v6-c-menu-toggle + .pf-v6-c-panel {
18
18
  position: absolute;
19
19
  top: calc(100% + 2px);
20
- z-index: var(--pf-v5-global--ZIndex--sm);
20
+ z-index: var(--pf-v6-global--ZIndex--sm);
21
21
  }
22
22
 
23
- .ws-html-demos-c-toolbar .pf-v5-c-toolbar__item {
23
+ .ws-html-demos-c-toolbar .pf-v6-c-toolbar__item {
24
24
  position: relative;
25
25
  }
package/docs/utilities/Text/examples/Text.md CHANGED
@@ -29,7 +29,6 @@ section: utility-classes
29
29
  ### Font weight
30
30
 
31
31
  ```html
32
- <div class="pf-v6-u-font-weight-light">Light</div>
33
32
  <div class="pf-v6-u-font-weight-normal">Normal</div>
34
33
  <div class="pf-v6-u-font-weight-bold">Bold</div>
35
34