@patternfly/patternfly 6.0.0-alpha.165 → 6.0.0-alpha.167

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 (88) hide show
  1. package/components/Alert/alert-group.css +54 -3
  2. package/components/Alert/alert-group.scss +85 -0
  3. package/components/Alert/alert.scss +1 -1
  4. package/components/Button/button.css +33 -14
  5. package/components/Button/button.scss +36 -14
  6. package/components/_index.css +87 -17
  7. package/docs/components/AboutModalBox/examples/AboutModalBox.md +3 -1
  8. package/docs/components/ActionList/examples/ActionList.md +60 -20
  9. package/docs/components/Alert/examples/Alert.md +106 -62
  10. package/docs/components/BackToTop/examples/BackToTop.md +5 -3
  11. package/docs/components/Banner/examples/Banner.md +9 -3
  12. package/docs/components/Button/examples/Button.md +536 -367
  13. package/docs/components/CalendarMonth/examples/CalendarMonth.md +24 -8
  14. package/docs/components/Card/examples/Card.md +43 -29
  15. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +75 -33
  16. package/docs/components/CodeBlock/examples/CodeBlock.md +18 -6
  17. package/docs/components/CodeEditor/examples/CodeEditor.md +44 -22
  18. package/docs/components/ContextSelector/deprecated/context-selector.md +6 -8
  19. package/docs/components/DataList/examples/DataList.md +121 -63
  20. package/docs/components/DatePicker/examples/DatePicker.md +18 -6
  21. package/docs/components/DescriptionList/examples/DescriptionList.md +125 -75
  22. package/docs/components/Drawer/examples/Drawer.md +57 -19
  23. package/docs/components/DualListSelector/examples/DualListSelector.md +204 -100
  24. package/docs/components/EmptyState/examples/EmptyState.md +123 -53
  25. package/docs/components/FileUpload/examples/FileUpload.md +42 -14
  26. package/docs/components/Form/examples/Form.md +53 -19
  27. package/docs/components/Hint/examples/Hint.md +9 -9
  28. package/docs/components/InlineEdit/examples/InlineEdit.md +78 -26
  29. package/docs/components/InputGroup/examples/InputGroup.md +27 -9
  30. package/docs/components/JumpLinks/examples/JumpLinks.md +188 -68
  31. package/docs/components/Label/examples/Label.md +651 -217
  32. package/docs/components/LogViewer/examples/LogViewer.md +218 -86
  33. package/docs/components/Login/examples/Login.md +346 -282
  34. package/docs/components/Masthead/examples/masthead.md +27 -9
  35. package/docs/components/Menu/examples/Menu.md +35 -25
  36. package/docs/components/MenuToggle/examples/MenuToggle.md +3 -1
  37. package/docs/components/ModalBox/examples/ModalBox.md +48 -16
  38. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +48 -16
  39. package/docs/components/Nav/examples/Navigation.md +12 -4
  40. package/docs/components/NotificationBadge/examples/NotificationBadge.md +78 -42
  41. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +6 -2
  42. package/docs/components/NumberInput/examples/NumberInput.md +96 -48
  43. package/docs/components/OverflowMenu/examples/overflow-menu.md +48 -16
  44. package/docs/components/Page/examples/Page.md +21 -7
  45. package/docs/components/Pagination/examples/Pagination.md +132 -44
  46. package/docs/components/Popover/examples/Popover.md +45 -15
  47. package/docs/components/Select/deprecated/Select.md +111 -55
  48. package/docs/components/SkipToContent/examples/SkipToContent.md +3 -1
  49. package/docs/components/Slider/examples/Slider.md +12 -4
  50. package/docs/components/Table/examples/Table.md +363 -208
  51. package/docs/components/Tabs/examples/Tabs.md +1230 -574
  52. package/docs/components/TextInputGroup/examples/TextInputGroup.md +132 -44
  53. package/docs/components/Toolbar/examples/Toolbar.md +120 -64
  54. package/docs/components/TreeView/examples/TreeView.md +12 -4
  55. package/docs/components/Wizard/examples/Wizard.md +105 -38
  56. package/docs/demos/AboutModal/examples/AboutModal.md +9 -3
  57. package/docs/demos/Alert/examples/Alert.md +39 -25
  58. package/docs/demos/BackToTop/examples/BackToTop.md +11 -5
  59. package/docs/demos/Banner/examples/Banner.md +12 -4
  60. package/docs/demos/Button/examples/Button.md +7 -7
  61. package/docs/demos/Card/examples/Card.md +106 -57
  62. package/docs/demos/CardView/examples/CardView.md +30 -13
  63. package/docs/demos/ContextSelector/examples/ContextSelector.md +24 -8
  64. package/docs/demos/Dashboard/examples/Dashboard.md +43 -28
  65. package/docs/demos/DataList/examples/DataList.md +255 -149
  66. package/docs/demos/DescriptionList/examples/DescriptionList.md +21 -7
  67. package/docs/demos/Drawer/examples/Drawer.md +89 -43
  68. package/docs/demos/Form/examples/BasicForms.md +141 -59
  69. package/docs/demos/JumpLinks/examples/JumpLinks.md +222 -109
  70. package/docs/demos/Masthead/examples/Masthead.md +63 -21
  71. package/docs/demos/Modal/examples/Modal.md +99 -37
  72. package/docs/demos/Nav/examples/Nav.md +45 -15
  73. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +58 -43
  74. package/docs/demos/Page/examples/Page.md +54 -21
  75. package/docs/demos/Page/examples/Penta.md +9 -6
  76. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +9 -3
  77. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +12 -4
  78. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +306 -133
  79. package/docs/demos/Skeleton/examples/Skeleton.md +6 -2
  80. package/docs/demos/Table/examples/Table.md +474 -210
  81. package/docs/demos/Tabs/examples/Tabs.md +60 -22
  82. package/docs/demos/Toolbar/examples/Toolbar.md +123 -72
  83. package/docs/demos/Wizard/examples/Wizard.md +179 -110
  84. package/package.json +1 -1
  85. package/patternfly-no-globals.css +87 -17
  86. package/patternfly.css +87 -17
  87. package/patternfly.min.css +1 -1
  88. package/patternfly.min.css.map +1 -1
@@ -58,7 +58,9 @@ subsection: forms
58
58
  aria-label="More information for phone number field"
59
59
  aria-describedby="-phone"
60
60
  >
61
- <i class="fas fa-question-circle" aria-hidden="true"></i>
61
+ <span class="pf-v6-c-button__text">
62
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
63
+ </span>
62
64
  </span></span>
63
65
  </div>
64
66
  <div class="pf-v6-c-form__group-control">
@@ -161,8 +163,12 @@ subsection: forms
161
163
  <div class="pf-v6-c-form__group pf-m-action">
162
164
  <div class="pf-v6-c-form__group-control">
163
165
  <div class="pf-v6-c-form__actions">
164
- <button class="pf-v6-c-button pf-m-primary" type="submit">Submit</button>
165
- <button class="pf-v6-c-button pf-m-link" type="button">Cancel</button>
166
+ <button class="pf-v6-c-button pf-m-primary" type="submit">
167
+ <span class="pf-v6-c-button__text">Submit</span>
168
+ </button>
169
+ <button class="pf-v6-c-button pf-m-link" type="button">
170
+ <span class="pf-v6-c-button__text">Cancel</span>
171
+ </button>
166
172
  </div>
167
173
  </div>
168
174
  </div>
@@ -252,7 +258,9 @@ subsection: forms
252
258
  aria-label="More information for contact field"
253
259
  aria-describedby="form-demo-horizontal-contact-legend"
254
260
  >
255
- <i class="fas fa-question-circle" aria-hidden="true"></i>
261
+ <span class="pf-v6-c-button__text">
262
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
263
+ </span>
256
264
  </span></span>
257
265
  </div>
258
266
  <div class="pf-v6-c-form__group-control pf-m-stack">
@@ -300,8 +308,12 @@ subsection: forms
300
308
  <div class="pf-v6-c-form__group pf-m-action">
301
309
  <div class="pf-v6-c-form__group-control">
302
310
  <div class="pf-v6-c-form__actions">
303
- <button class="pf-v6-c-button pf-m-primary" type="submit">Submit</button>
304
- <button class="pf-v6-c-button pf-m-link" type="button">Cancel</button>
311
+ <button class="pf-v6-c-button pf-m-primary" type="submit">
312
+ <span class="pf-v6-c-button__text">Submit</span>
313
+ </button>
314
+ <button class="pf-v6-c-button pf-m-link" type="button">
315
+ <span class="pf-v6-c-button__text">Cancel</span>
316
+ </button>
305
317
  </div>
306
318
  </div>
307
319
  </div>
@@ -483,8 +495,12 @@ subsection: forms
483
495
  <div class="pf-v6-c-form__group pf-m-action">
484
496
  <div class="pf-v6-c-form__group-control">
485
497
  <div class="pf-v6-c-form__actions">
486
- <button class="pf-v6-c-button pf-m-primary" type="submit">Submit</button>
487
- <button class="pf-v6-c-button pf-m-link" type="button">Cancel</button>
498
+ <button class="pf-v6-c-button pf-m-primary" type="submit">
499
+ <span class="pf-v6-c-button__text">Submit</span>
500
+ </button>
501
+ <button class="pf-v6-c-button pf-m-link" type="button">
502
+ <span class="pf-v6-c-button__text">Cancel</span>
503
+ </button>
488
504
  </div>
489
505
  </div>
490
506
  </div>
@@ -521,7 +537,9 @@ subsection: forms
521
537
  aria-label="More information for client id field"
522
538
  aria-describedby="form-demo-sections-repeatable-fields-clientid"
523
539
  >
524
- <i class="fas fa-question-circle" aria-hidden="true"></i>
540
+ <span class="pf-v6-c-button__text">
541
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
542
+ </span>
525
543
  </span></span>
526
544
  </div>
527
545
  <div class="pf-v6-c-form__group-control">
@@ -549,7 +567,9 @@ subsection: forms
549
567
  aria-label="More information for full name field"
550
568
  aria-describedby="form-demo-sections-repeatable-fields-name"
551
569
  >
552
- <i class="fas fa-question-circle" aria-hidden="true"></i>
570
+ <span class="pf-v6-c-button__text">
571
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
572
+ </span>
553
573
  </span></span>
554
574
  </div>
555
575
  <div class="pf-v6-c-form__group-control">
@@ -577,7 +597,9 @@ subsection: forms
577
597
  aria-label="More information for description field"
578
598
  aria-describedby="form-demo-sections-repeatable-fields-description"
579
599
  >
580
- <i class="fas fa-question-circle" aria-hidden="true"></i>
600
+ <span class="pf-v6-c-button__text">
601
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
602
+ </span>
581
603
  </span></span>
582
604
  </div>
583
605
  <div class="pf-v6-c-form__group-control">
@@ -616,7 +638,9 @@ subsection: forms
616
638
  aria-label="More information for root URL field"
617
639
  aria-describedby="form-demo-sections-repeatable-fields-section2-rooturl"
618
640
  >
619
- <i class="fas fa-question-circle" aria-hidden="true"></i>
641
+ <span class="pf-v6-c-button__text">
642
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
643
+ </span>
620
644
  </span></span>
621
645
  </div>
622
646
  <div class="pf-v6-c-form__group-control">
@@ -644,7 +668,9 @@ subsection: forms
644
668
  aria-label="More information for valid redirect URIs field"
645
669
  aria-describedby="form-demo-sections-repeatable-fields-section2-uris"
646
670
  >
647
- <i class="fas fa-question-circle" aria-hidden="true"></i>
671
+ <span class="pf-v6-c-button__text">
672
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
673
+ </span>
648
674
  </span></span>
649
675
  </div>
650
676
  <div class="pf-v6-c-form__group-control pf-m-stack">
@@ -666,7 +692,9 @@ subsection: forms
666
692
  type="button"
667
693
  aria-label="Remove"
668
694
  >
669
- <i class="fas fa-minus-circle" aria-hidden="true"></i>
695
+ <span class="pf-v6-c-button__text">
696
+ <i class="fas fa-minus-circle" aria-hidden="true"></i>
697
+ </span>
670
698
  </button>
671
699
  </div>
672
700
  </div>
@@ -688,7 +716,9 @@ subsection: forms
688
716
  type="button"
689
717
  aria-label="Remove"
690
718
  >
691
- <i class="fas fa-minus-circle" aria-hidden="true"></i>
719
+ <span class="pf-v6-c-button__text">
720
+ <i class="fas fa-minus-circle" aria-hidden="true"></i>
721
+ </span>
692
722
  </button>
693
723
  </div>
694
724
  </div>
@@ -710,15 +740,19 @@ subsection: forms
710
740
  type="button"
711
741
  aria-label="Remove"
712
742
  >
713
- <i class="fas fa-minus-circle" aria-hidden="true"></i>
743
+ <span class="pf-v6-c-button__text">
744
+ <i class="fas fa-minus-circle" aria-hidden="true"></i>
745
+ </span>
714
746
  </button>
715
747
  </div>
716
748
  </div>
717
749
  <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
718
- <span class="pf-v6-c-button__icon pf-m-start">
719
- <i class="fas fa-plus-circle" aria-hidden="true"></i>
750
+ <span class="pf-v6-c-button__text">
751
+ <span class="pf-v6-c-button__icon pf-m-start pf-m-start">
752
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
753
+ </span>
754
+ Add valid redirect URI
720
755
  </span>
721
- Add valid redirect URI
722
756
  </button>
723
757
  </div>
724
758
  </div>
@@ -736,7 +770,9 @@ subsection: forms
736
770
  aria-label="More information for home URL field"
737
771
  aria-describedby="form-demo-sections-repeatable-fields-section2-home-url"
738
772
  >
739
- <i class="fas fa-question-circle" aria-hidden="true"></i>
773
+ <span class="pf-v6-c-button__text">
774
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
775
+ </span>
740
776
  </span></span>
741
777
  </div>
742
778
  <div class="pf-v6-c-form__group-control">
@@ -773,7 +809,9 @@ subsection: forms
773
809
  aria-label="More information for name field"
774
810
  aria-describedby="form-demo-sections-complex-form-name"
775
811
  >
776
- <i class="fas fa-question-circle" aria-hidden="true"></i>
812
+ <span class="pf-v6-c-button__text">
813
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
814
+ </span>
777
815
  </span></span>
778
816
  </div>
779
817
  <div class="pf-v6-c-form__group-control">
@@ -802,7 +840,9 @@ subsection: forms
802
840
  aria-label="More information for labels field"
803
841
  aria-describedby="form-demo-sections-complex-form-labels"
804
842
  >
805
- <i class="fas fa-question-circle" aria-hidden="true"></i>
843
+ <span class="pf-v6-c-button__text">
844
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
845
+ </span>
806
846
  </span></span>
807
847
  </div>
808
848
  <div class="pf-v6-c-form__group-control">
@@ -837,7 +877,9 @@ subsection: forms
837
877
  aria-label="Remove"
838
878
  aria-labelledby="-label-1-button -label-1-text"
839
879
  >
840
- <i class="fas fa-times fa-fw" aria-hidden="true"></i>
880
+ <span class="pf-v6-c-button__text">
881
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
882
+ </span>
841
883
  </button>
842
884
  </span>
843
885
  </span>
@@ -858,7 +900,9 @@ subsection: forms
858
900
  aria-label="Remove"
859
901
  aria-labelledby="-label-2-button -label-2-text"
860
902
  >
861
- <i class="fas fa-times fa-fw" aria-hidden="true"></i>
903
+ <span class="pf-v6-c-button__text">
904
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
905
+ </span>
862
906
  </button>
863
907
  </span>
864
908
  </span>
@@ -901,8 +945,10 @@ subsection: forms
901
945
  id="form-demo-sections-complex-form-alerting-toggle"
902
946
  aria-labelledby="form-demo-sections-complex-form-alerting-title form-demo-sections-complex-form-alerting-toggle"
903
947
  >
904
- <span class="pf-v6-c-form__field-group-toggle-icon">
905
- <i class="fas fa-angle-right" aria-hidden="true"></i>
948
+ <span class="pf-v6-c-button__text">
949
+ <span class="pf-v6-c-form__field-group-toggle-icon">
950
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
951
+ </span>
906
952
  </span>
907
953
  </button>
908
954
  </div>
@@ -937,8 +983,10 @@ subsection: forms
937
983
  id="form-demo-sections-complex-form-query-toggle"
938
984
  aria-labelledby="form-demo-sections-complex-form-query-title form-demo-sections-complex-form-query-toggle"
939
985
  >
940
- <span class="pf-v6-c-form__field-group-toggle-icon">
941
- <i class="fas fa-angle-right" aria-hidden="true"></i>
986
+ <span class="pf-v6-c-button__text">
987
+ <span class="pf-v6-c-form__field-group-toggle-icon">
988
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
989
+ </span>
942
990
  </span>
943
991
  </button>
944
992
  </div>
@@ -973,8 +1021,10 @@ subsection: forms
973
1021
  id="form-demo-sections-complex-form-affinity-toggle"
974
1022
  aria-labelledby="form-demo-sections-complex-form-affinity-title form-demo-sections-complex-form-affinity-toggle"
975
1023
  >
976
- <span class="pf-v6-c-form__field-group-toggle-icon">
977
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1024
+ <span class="pf-v6-c-button__text">
1025
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1026
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1027
+ </span>
978
1028
  </span>
979
1029
  </button>
980
1030
  </div>
@@ -1008,8 +1058,10 @@ subsection: forms
1008
1058
  id="form-demo-sections-complex-form-node-affinity-toggle"
1009
1059
  aria-labelledby="form-demo-sections-complex-form-node-affinity-title form-demo-sections-complex-form-node-affinity-toggle"
1010
1060
  >
1011
- <span class="pf-v6-c-form__field-group-toggle-icon">
1012
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1061
+ <span class="pf-v6-c-button__text">
1062
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1063
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1064
+ </span>
1013
1065
  </span>
1014
1066
  </button>
1015
1067
  </div>
@@ -1043,8 +1095,10 @@ subsection: forms
1043
1095
  id="form-demo-sections-complex-form-node-affinity-required-toggle"
1044
1096
  aria-labelledby="form-demo-sections-complex-form-node-affinity-required-title form-demo-sections-complex-form-node-affinity-required-toggle"
1045
1097
  >
1046
- <span class="pf-v6-c-form__field-group-toggle-icon">
1047
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1098
+ <span class="pf-v6-c-button__text">
1099
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1100
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1101
+ </span>
1048
1102
  </span>
1049
1103
  </button>
1050
1104
  </div>
@@ -1079,8 +1133,10 @@ subsection: forms
1079
1133
  id="form-demo-sections-complex-form-node-affinity-required-2-toggle"
1080
1134
  aria-labelledby="form-demo-sections-complex-form-node-affinity-required-2-title form-demo-sections-complex-form-node-affinity-required-2-toggle"
1081
1135
  >
1082
- <span class="pf-v6-c-form__field-group-toggle-icon">
1083
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1136
+ <span class="pf-v6-c-button__text">
1137
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1138
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1139
+ </span>
1084
1140
  </span>
1085
1141
  </button>
1086
1142
  </div>
@@ -1133,7 +1189,9 @@ subsection: forms
1133
1189
  type="button"
1134
1190
  aria-label="Remove"
1135
1191
  >
1136
- <i class="fas fa-minus-circle" aria-hidden="true"></i>
1192
+ <span class="pf-v6-c-button__text">
1193
+ <i class="fas fa-minus-circle" aria-hidden="true"></i>
1194
+ </span>
1137
1195
  </button>
1138
1196
  </div>
1139
1197
  </div>
@@ -1141,10 +1199,14 @@ subsection: forms
1141
1199
  class="pf-v6-c-button pf-m-link pf-m-inline"
1142
1200
  type="button"
1143
1201
  >
1144
- <span class="pf-v6-c-button__icon pf-m-start">
1145
- <i class="fas fa-plus-circle" aria-hidden="true"></i>
1202
+ <span class="pf-v6-c-button__text">
1203
+ <span
1204
+ class="pf-v6-c-button__icon pf-m-start pf-m-start"
1205
+ >
1206
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
1207
+ </span>
1208
+ Add valid redirect URI
1146
1209
  </span>
1147
- Add valid redirect URI
1148
1210
  </button>
1149
1211
  </div>
1150
1212
  </div>
@@ -1169,8 +1231,10 @@ subsection: forms
1169
1231
  id="form-demo-sections-complex-form-pod-affinity-toggle"
1170
1232
  aria-labelledby="form-demo-sections-complex-form-pod-affinity-title form-demo-sections-complex-form-pod-affinity-toggle"
1171
1233
  >
1172
- <span class="pf-v6-c-form__field-group-toggle-icon">
1173
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1234
+ <span class="pf-v6-c-button__text">
1235
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1236
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1237
+ </span>
1174
1238
  </span>
1175
1239
  </button>
1176
1240
  </div>
@@ -1207,8 +1271,10 @@ subsection: forms
1207
1271
  id="form-demo-sections-complex-form-routing-toggle"
1208
1272
  aria-labelledby="form-demo-sections-complex-form-routing-title form-demo-sections-complex-form-routing-toggle"
1209
1273
  >
1210
- <span class="pf-v6-c-form__field-group-toggle-icon">
1211
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1274
+ <span class="pf-v6-c-button__text">
1275
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1276
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1277
+ </span>
1212
1278
  </span>
1213
1279
  </button>
1214
1280
  </div>
@@ -1391,8 +1457,10 @@ subsection: forms
1391
1457
  id="form-demo-sections-complex-form-health-checks-toggle"
1392
1458
  aria-labelledby="form-demo-sections-complex-form-health-checks-title form-demo-sections-complex-form-health-checks-toggle"
1393
1459
  >
1394
- <span class="pf-v6-c-form__field-group-toggle-icon">
1395
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1460
+ <span class="pf-v6-c-button__text">
1461
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1462
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1463
+ </span>
1396
1464
  </span>
1397
1465
  </button>
1398
1466
  </div>
@@ -1433,10 +1501,12 @@ subsection: forms
1433
1501
  class="pf-v6-c-button pf-m-link pf-m-inline"
1434
1502
  type="button"
1435
1503
  >
1436
- <span class="pf-v6-c-button__icon pf-m-start">
1437
- <i class="fas fa-plus-circle" aria-hidden="true"></i>
1504
+ <span class="pf-v6-c-button__text">
1505
+ <span class="pf-v6-c-button__icon pf-m-start pf-m-start">
1506
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
1507
+ </span>
1508
+ Add liveness probe
1438
1509
  </span>
1439
- Add liveness probe
1440
1510
  </button>
1441
1511
  </div>
1442
1512
  </div>
@@ -1467,10 +1537,12 @@ subsection: forms
1467
1537
  class="pf-v6-c-button pf-m-link pf-m-inline"
1468
1538
  type="button"
1469
1539
  >
1470
- <span class="pf-v6-c-button__icon pf-m-start">
1471
- <i class="fas fa-plus-circle" aria-hidden="true"></i>
1540
+ <span class="pf-v6-c-button__text">
1541
+ <span class="pf-v6-c-button__icon pf-m-start pf-m-start">
1542
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
1543
+ </span>
1544
+ Add startup probe
1472
1545
  </span>
1473
- Add startup probe
1474
1546
  </button>
1475
1547
  </div>
1476
1548
  </div>
@@ -1494,8 +1566,10 @@ subsection: forms
1494
1566
  id="form-demo-sections-complex-form-build-configuration-toggle"
1495
1567
  aria-labelledby="form-demo-sections-complex-form-build-configuration-title form-demo-sections-complex-form-build-configuration-toggle"
1496
1568
  >
1497
- <span class="pf-v6-c-form__field-group-toggle-icon">
1498
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1569
+ <span class="pf-v6-c-button__text">
1570
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1571
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1572
+ </span>
1499
1573
  </span>
1500
1574
  </button>
1501
1575
  </div>
@@ -1510,7 +1584,9 @@ subsection: forms
1510
1584
  </div>
1511
1585
  </div>
1512
1586
  <div class="pf-v6-c-form__field-group-header-actions">
1513
- <button class="pf-v6-c-button pf-m-secondary" type="button">Import</button>
1587
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
1588
+ <span class="pf-v6-c-button__text">Import</span>
1589
+ </button>
1514
1590
  </div>
1515
1591
  </div>
1516
1592
  </div>
@@ -1530,8 +1606,10 @@ subsection: forms
1530
1606
  id="form-demo-sections-complex-form-deployment-toggle"
1531
1607
  aria-labelledby="form-demo-sections-complex-form-deployment-title form-demo-sections-complex-form-deployment-toggle"
1532
1608
  >
1533
- <span class="pf-v6-c-form__field-group-toggle-icon">
1534
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1609
+ <span class="pf-v6-c-button__text">
1610
+ <span class="pf-v6-c-form__field-group-toggle-icon">
1611
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1612
+ </span>
1535
1613
  </span>
1536
1614
  </button>
1537
1615
  </div>
@@ -1549,8 +1627,12 @@ subsection: forms
1549
1627
  </div>
1550
1628
 
1551
1629
  <div class="pf-v6-c-form__actions">
1552
- <button class="pf-v6-c-button pf-m-primary" type="submit">Save</button>
1553
- <button class="pf-v6-c-button pf-m-secondary" type="reset">Cancel</button>
1630
+ <button class="pf-v6-c-button pf-m-primary" type="submit">
1631
+ <span class="pf-v6-c-button__text">Save</span>
1632
+ </button>
1633
+ <button class="pf-v6-c-button pf-m-secondary" type="reset">
1634
+ <span class="pf-v6-c-button__text">Cancel</span>
1635
+ </button>
1554
1636
  </div>
1555
1637
  </form>
1556
1638