@patternfly/patternfly 5.0.0-alpha.4 → 5.0.0-alpha.41

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 (342) hide show
  1. package/README.md +4 -4
  2. package/RELEASE-NOTES.md +18 -1
  3. package/assets/icons/iconUnicodes.json +1 -0
  4. package/assets/images/pfbg-icon.svg +1 -0
  5. package/assets/pficon/pficon.scss +7 -2
  6. package/assets/pficon/pficon.woff2 +0 -0
  7. package/base/_base.scss +0 -18
  8. package/base/_chart-globals.scss +0 -4
  9. package/base/_common.scss +0 -22
  10. package/base/_fa-icons.scss +1 -2
  11. package/base/_fonts.scss +22 -27
  12. package/base/_globals.scss +92 -86
  13. package/base/_icons.scss +1 -28
  14. package/base/_svg-icons.scss +6 -0
  15. package/base/_variables.scss +4 -4
  16. package/base/patternfly-common.css +0 -10
  17. package/base/patternfly-fa-icons.css +1 -1
  18. package/base/patternfly-fonts.css +17 -17
  19. package/base/patternfly-globals.css +35 -41
  20. package/base/patternfly-icons.css +8 -22
  21. package/base/patternfly-pf-icons.css +6 -2
  22. package/base/patternfly-themes.css +0 -42
  23. package/base/patternfly-variables.css +3 -3
  24. package/base/themes/dark/_globals.scss +1 -1
  25. package/base/themes/dark/_variables.scss +1 -1
  26. package/components/AboutModalBox/about-modal-box.css +20 -50
  27. package/components/AboutModalBox/about-modal-box.scss +22 -14
  28. package/components/Accordion/accordion.css +2 -0
  29. package/components/Accordion/accordion.scss +2 -0
  30. package/components/Alert/alert.css +17 -8
  31. package/components/Alert/alert.scss +21 -7
  32. package/components/Alert/themes/dark/alert.scss +1 -1
  33. package/components/AppLauncher/app-launcher.css +2 -0
  34. package/components/AppLauncher/app-launcher.scss +2 -0
  35. package/components/Avatar/avatar.scss +2 -2
  36. package/components/BackgroundImage/background-image.css +8 -35
  37. package/components/BackgroundImage/background-image.scss +17 -43
  38. package/components/Banner/banner.css +14 -52
  39. package/components/Banner/banner.scss +9 -13
  40. package/components/Breadcrumb/breadcrumb.css +2 -0
  41. package/components/Breadcrumb/breadcrumb.scss +2 -0
  42. package/components/CalendarMonth/calendar-month.css +2 -2
  43. package/components/CalendarMonth/calendar-month.scss +3 -3
  44. package/components/Card/card.css +115 -50
  45. package/components/Card/card.scss +164 -63
  46. package/components/Chip/chip.css +33 -24
  47. package/components/Chip/chip.scss +40 -31
  48. package/components/ChipGroup/chip-group.css +27 -17
  49. package/components/ChipGroup/chip-group.scss +36 -22
  50. package/components/Content/content.css +11 -5
  51. package/components/Content/content.scss +17 -9
  52. package/components/ContextSelector/context-selector.css +13 -6
  53. package/components/ContextSelector/context-selector.scss +14 -7
  54. package/components/DataList/data-list-grid.css +7 -7
  55. package/components/DataList/data-list-grid.scss +1 -1
  56. package/components/DataList/data-list.css +46 -40
  57. package/components/DataList/data-list.scss +37 -28
  58. package/components/DatePicker/date-picker.css +0 -8
  59. package/components/DatePicker/date-picker.scss +0 -9
  60. package/components/DescriptionList/description-list.css +7 -7
  61. package/components/DescriptionList/description-list.scss +7 -7
  62. package/components/Divider/divider.css +2 -2
  63. package/components/Divider/divider.scss +3 -3
  64. package/components/Drawer/drawer.css +15 -16
  65. package/components/Drawer/drawer.scss +2 -3
  66. package/components/Dropdown/dropdown.css +26 -25
  67. package/components/Dropdown/dropdown.scss +17 -18
  68. package/components/DualListSelector/dual-list-selector.css +1 -1
  69. package/components/DualListSelector/dual-list-selector.scss +1 -1
  70. package/components/EmptyState/empty-state.css +46 -52
  71. package/components/EmptyState/empty-state.scss +58 -57
  72. package/components/ExpandableSection/expandable-section.css +2 -0
  73. package/components/ExpandableSection/expandable-section.scss +2 -0
  74. package/components/Form/form.css +14 -12
  75. package/components/Form/form.scss +9 -7
  76. package/components/FormControl/form-control.css +2 -5
  77. package/components/FormControl/themes/dark/form-control.scss +2 -6
  78. package/components/HelperText/helper-text.css +4 -0
  79. package/components/HelperText/helper-text.scss +5 -0
  80. package/components/Hint/hint.css +2 -2
  81. package/components/Hint/hint.scss +2 -2
  82. package/components/Icon/icon.css +3 -3
  83. package/components/Icon/icon.scss +3 -3
  84. package/components/InputGroup/input-group.css +61 -85
  85. package/components/InputGroup/input-group.scss +55 -61
  86. package/components/InputGroup/themes/dark/input-group.scss +11 -25
  87. package/components/Label/label.css +49 -36
  88. package/components/Label/label.scss +53 -38
  89. package/components/Label/themes/dark/label.scss +2 -2
  90. package/components/LabelGroup/label-group.css +26 -22
  91. package/components/LabelGroup/label-group.scss +31 -26
  92. package/components/LogViewer/log-viewer.css +0 -38
  93. package/components/Login/login.css +20 -60
  94. package/components/Login/login.scss +16 -18
  95. package/components/Login/themes/dark/login.scss +4 -0
  96. package/components/Masthead/masthead.css +4 -42
  97. package/components/Masthead/masthead.scss +4 -4
  98. package/components/Menu/menu.css +9 -6
  99. package/components/Menu/menu.scss +34 -31
  100. package/components/MenuToggle/menu-toggle.css +3 -1
  101. package/components/MenuToggle/menu-toggle.scss +3 -1
  102. package/components/ModalBox/modal-box.css +12 -11
  103. package/components/ModalBox/modal-box.scss +14 -14
  104. package/components/MultipleFileUpload/multiple-file-upload.css +6 -6
  105. package/components/MultipleFileUpload/multiple-file-upload.scss +6 -6
  106. package/components/Nav/nav.css +1 -1
  107. package/components/Nav/nav.scss +2 -2
  108. package/components/NotificationDrawer/notification-drawer.css +8 -8
  109. package/components/NotificationDrawer/notification-drawer.scss +8 -8
  110. package/components/OptionsMenu/options-menu.css +8 -10
  111. package/components/OptionsMenu/options-menu.scss +9 -11
  112. package/components/Page/page.css +101 -122
  113. package/components/Page/page.scss +49 -21
  114. package/components/Pagination/pagination.css +2 -110
  115. package/components/Pagination/pagination.scss +0 -6
  116. package/components/Popover/popover.css +31 -37
  117. package/components/Popover/popover.scss +32 -37
  118. package/components/Popover/themes/dark/popover.scss +3 -9
  119. package/components/Progress/progress.css +13 -10
  120. package/components/Progress/progress.scss +13 -10
  121. package/components/ProgressStepper/progress-stepper.css +5 -5
  122. package/components/ProgressStepper/progress-stepper.scss +5 -5
  123. package/components/SearchInput/search-input.css +4 -2
  124. package/components/SearchInput/search-input.scss +4 -2
  125. package/components/Select/select.css +1 -1
  126. package/components/Select/select.scss +1 -1
  127. package/components/Sidebar/sidebar.css +69 -26
  128. package/components/Sidebar/sidebar.scss +84 -27
  129. package/components/SimpleList/simple-list.css +1 -1
  130. package/components/SimpleList/simple-list.scss +2 -2
  131. package/components/Spinner/spinner.css +4 -133
  132. package/components/Spinner/spinner.scss +4 -173
  133. package/components/Table/table-grid.css +28 -28
  134. package/components/Table/table-scrollable.css +31 -26
  135. package/components/Table/table-scrollable.scss +33 -28
  136. package/components/Table/table-tree-view.css +14 -4
  137. package/components/Table/table-tree-view.scss +15 -0
  138. package/components/Table/table.css +67 -65
  139. package/components/Table/table.scss +65 -62
  140. package/components/Tabs/tabs.css +0 -4
  141. package/components/Tabs/tabs.scss +0 -7
  142. package/components/TextInputGroup/text-input-group.css +6 -4
  143. package/components/TextInputGroup/text-input-group.scss +6 -5
  144. package/components/Tile/tile.css +1 -1
  145. package/components/Tile/tile.scss +1 -1
  146. package/components/Timestamp/timestamp.css +3 -3
  147. package/components/Timestamp/timestamp.scss +3 -3
  148. package/components/Toolbar/toolbar.css +78 -43
  149. package/components/Toolbar/toolbar.scss +50 -10
  150. package/components/Tooltip/themes/dark/tooltip.scss +1 -11
  151. package/components/Tooltip/tooltip.css +7 -12
  152. package/components/Tooltip/tooltip.scss +6 -3
  153. package/components/TreeView/tree-view.css +7 -15
  154. package/components/TreeView/tree-view.scss +7 -18
  155. package/components/Wizard/wizard.css +16 -39
  156. package/components/Wizard/wizard.scss +20 -2
  157. package/docs/components/AboutModalBox/examples/AboutModalBox.md +20 -14
  158. package/docs/components/Accordion/examples/Accordion.md +12 -12
  159. package/docs/components/ActionList/examples/ActionList.md +6 -6
  160. package/docs/components/Alert/examples/Alert.md +29 -29
  161. package/docs/components/AlertGroup/examples/AlertGroup.md +15 -15
  162. package/docs/components/AppLauncher/examples/application-launcher.md +52 -46
  163. package/docs/components/Avatar/examples/Avatar.md +11 -11
  164. package/docs/components/BackToTop/examples/BackToTop.md +4 -4
  165. package/docs/components/Backdrop/examples/Backdrop.md +4 -4
  166. package/docs/components/BackgroundImage/examples/BackgroundImage.md +13 -29
  167. package/docs/components/Badge/examples/Badge.md +5 -5
  168. package/docs/components/Banner/examples/Banner.md +8 -8
  169. package/docs/components/Brand/examples/Brand.md +9 -9
  170. package/docs/components/Breadcrumb/examples/Breadcrumb.md +20 -20
  171. package/docs/components/Button/examples/Button.md +51 -55
  172. package/docs/components/CalendarMonth/examples/CalendarMonth.md +301 -284
  173. package/docs/components/Card/examples/Card.md +676 -116
  174. package/docs/components/Check/examples/Check.md +16 -19
  175. package/docs/components/Chip/examples/Chip.md +70 -52
  176. package/docs/components/ChipGroup/examples/ChipGroup.md +452 -673
  177. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +22 -22
  178. package/docs/components/CodeBlock/examples/CodeBlock.md +9 -9
  179. package/docs/components/CodeEditor/examples/CodeEditor.md +54 -35
  180. package/docs/components/Content/examples/Content.md +37 -9
  181. package/docs/components/ContextSelector/examples/context-selector.css +5 -1
  182. package/docs/components/ContextSelector/examples/context-selector.md +87 -80
  183. package/docs/components/DataList/examples/DataList.md +239 -202
  184. package/docs/components/DatePicker/examples/DatePicker.md +139 -104
  185. package/docs/components/DescriptionList/examples/DescriptionList.md +24 -24
  186. package/docs/components/Divider/examples/Divider.md +10 -10
  187. package/docs/components/DragDrop/examples/DragDrop.md +5 -5
  188. package/docs/components/Drawer/examples/Drawer.md +43 -43
  189. package/docs/components/Dropdown/examples/Dropdown.css +5 -2
  190. package/docs/components/Dropdown/examples/Dropdown.md +125 -100
  191. package/docs/components/DualListSelector/examples/DualListSelector.md +201 -197
  192. package/docs/components/EmptyState/examples/EmptyState.md +130 -82
  193. package/docs/components/ExpandableSection/examples/ExpandableSection.md +23 -23
  194. package/docs/components/FileUpload/examples/FileUpload.md +150 -110
  195. package/docs/components/Form/examples/Form.md +152 -130
  196. package/docs/components/FormControl/examples/FormControl.md +21 -20
  197. package/docs/components/HelperText/examples/HelperText.md +24 -35
  198. package/docs/components/Hint/examples/Hint.md +7 -7
  199. package/docs/components/Icon/examples/Icon.md +11 -12
  200. package/docs/components/InlineEdit/examples/InlineEdit.md +29 -27
  201. package/docs/components/InputGroup/examples/InputGroup.md +229 -179
  202. package/docs/components/JumpLinks/examples/JumpLinks.md +35 -35
  203. package/docs/components/Label/examples/Label.md +1427 -746
  204. package/docs/components/LabelGroup/examples/LabelGroup.md +295 -242
  205. package/docs/components/List/examples/List.md +18 -18
  206. package/docs/components/LogViewer/examples/LogViewer.md +79 -74
  207. package/docs/components/Login/examples/Login.md +103 -181
  208. package/docs/components/Masthead/examples/masthead.md +9 -9
  209. package/docs/components/Menu/examples/Menu.md +93 -85
  210. package/docs/components/MenuToggle/examples/MenuToggle.md +29 -28
  211. package/docs/components/ModalBox/examples/ModalBox.md +113 -92
  212. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +27 -26
  213. package/docs/components/Nav/examples/Navigation.md +69 -69
  214. package/docs/components/NotificationBadge/examples/NotificationBadge.md +8 -8
  215. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +64 -64
  216. package/docs/components/NumberInput/examples/NumberInput.md +311 -239
  217. package/docs/components/OptionsMenu/examples/options-menu.md +28 -28
  218. package/docs/components/OverflowMenu/examples/overflow-menu.md +25 -25
  219. package/docs/components/Page/examples/Page.css +7 -1
  220. package/docs/components/Page/examples/Page.md +81 -54
  221. package/docs/components/Pagination/examples/Pagination.md +27 -27
  222. package/docs/components/Panel/examples/Panel.md +10 -10
  223. package/docs/components/Popover/examples/Popover.md +206 -149
  224. package/docs/components/Progress/examples/Progress.md +32 -61
  225. package/docs/components/ProgressStepper/examples/ProgressStepper.md +45 -39
  226. package/docs/components/Radio/examples/Radio.md +12 -11
  227. package/docs/components/SearchInput/examples/SearchInput.md +185 -148
  228. package/docs/components/Select/examples/Select.md +372 -318
  229. package/docs/components/Sidebar/examples/Sidebar.md +70 -14
  230. package/docs/components/SimpleList/examples/SimpleList.md +15 -15
  231. package/docs/components/Skeleton/examples/Skeleton.md +8 -8
  232. package/docs/components/SkipToContent/examples/SkipToContent.md +5 -5
  233. package/docs/components/Slider/examples/Slider.md +84 -62
  234. package/docs/components/Spinner/examples/Spinner.md +18 -67
  235. package/docs/components/Switch/examples/Switch.md +19 -19
  236. package/docs/components/TabContent/examples/TabContent.md +13 -13
  237. package/docs/components/Table/examples/Table.css +4 -0
  238. package/docs/components/Table/examples/Table.md +5212 -5750
  239. package/docs/components/Tabs/examples/Tabs.md +155 -155
  240. package/docs/components/TextInputGroup/examples/TextInputGroup.md +523 -406
  241. package/docs/components/Tile/examples/Tile.md +16 -17
  242. package/docs/components/Timestamp/examples/Timestamp.md +5 -5
  243. package/docs/components/Title/examples/Title.md +17 -17
  244. package/docs/components/ToggleGroup/examples/toggle-group.md +13 -13
  245. package/docs/components/Toolbar/examples/Toolbar.md +848 -726
  246. package/docs/components/Tooltip/examples/Tooltip.md +10 -10
  247. package/docs/components/TreeView/examples/TreeView.md +34 -34
  248. package/docs/components/Truncate/examples/Truncate.md +4 -5
  249. package/docs/components/Wizard/examples/Wizard.md +119 -127
  250. package/docs/demos/AboutModal/examples/AboutModal.md +4 -5
  251. package/docs/demos/Alert/examples/Alert.md +118 -71
  252. package/docs/demos/BackToTop/examples/BackToTop.md +4 -4
  253. package/docs/demos/Banner/examples/Banner.md +8 -9
  254. package/docs/demos/Button/examples/Button.md +10 -5
  255. package/docs/demos/Card/examples/Card.md +246 -168
  256. package/docs/demos/CardView/examples/CardView.md +57 -30
  257. package/docs/demos/ContextSelector/examples/ContextSelector.md +18 -18
  258. package/docs/demos/Dashboard/examples/Dashboard.md +61 -38
  259. package/docs/demos/DataList/examples/DataList.md +312 -255
  260. package/docs/demos/DescriptionList/examples/DescriptionList.md +33 -22
  261. package/docs/demos/Drawer/examples/Drawer.md +24 -22
  262. package/docs/demos/Form/examples/BasicForms.md +220 -213
  263. package/docs/demos/HelperText/examples/HelperText.md +16 -14
  264. package/docs/demos/JumpLinks/examples/JumpLinks.md +28 -28
  265. package/docs/demos/Masthead/examples/Masthead.md +302 -284
  266. package/docs/demos/Modal/examples/Modal.md +54 -66
  267. package/docs/demos/Nav/examples/Nav.md +47 -47
  268. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +70 -58
  269. package/docs/demos/Page/examples/Page.md +982 -51
  270. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +22 -18
  271. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +121 -106
  272. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +345 -311
  273. package/docs/demos/Skeleton/examples/Skeleton.md +4 -4
  274. package/docs/demos/Table/examples/Table.md +3373 -1333
  275. package/docs/demos/Tabs/examples/Tabs.md +141 -90
  276. package/docs/demos/Toolbar/examples/Toolbar.md +1994 -329
  277. package/docs/demos/Wizard/examples/Wizard.md +289 -266
  278. package/docs/layouts/Bullseye/examples/Bullseye.md +4 -4
  279. package/docs/layouts/Flex/examples/Flex.md +98 -98
  280. package/docs/layouts/Gallery/examples/Gallery.md +7 -7
  281. package/docs/layouts/Grid/examples/Grid.md +9 -9
  282. package/docs/layouts/Level/examples/Level.md +5 -5
  283. package/docs/layouts/Split/examples/Split.md +7 -7
  284. package/docs/layouts/Stack/examples/Stack.md +6 -6
  285. package/docs/utilities/Accessibility/examples/Accessibility.md +5 -5
  286. package/docs/utilities/Alignment/examples/Alignment.md +7 -7
  287. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +13 -13
  288. package/docs/utilities/BoxShadow/examples/box-shadow.md +23 -23
  289. package/docs/utilities/Display/examples/Display.md +12 -12
  290. package/docs/utilities/Flex/examples/Flex.md +35 -35
  291. package/docs/utilities/Float/examples/Float.md +5 -5
  292. package/docs/utilities/Sizing/examples/Sizing.md +51 -51
  293. package/docs/utilities/Spacing/examples/Spacing.md +35 -35
  294. package/docs/utilities/Text/examples/Text.md +31 -31
  295. package/icons/{pf-icons.json → pf-icons.mjs} +2 -1
  296. package/layouts/Gallery/gallery.css +1 -1
  297. package/layouts/Gallery/gallery.scss +1 -1
  298. package/layouts/Grid/grid.css +7 -7
  299. package/layouts/Grid/grid.scss +2 -2
  300. package/package.json +60 -66
  301. package/patternfly-addons.css +48 -48
  302. package/{patternfly-base-no-reset.css → patternfly-base-no-globals.css} +28 -73
  303. package/{patternfly-base-no-reset.scss → patternfly-base-no-globals.scss} +1 -0
  304. package/patternfly-base.css +63 -114
  305. package/{patternfly-no-reset.css → patternfly-no-globals.css} +1206 -2449
  306. package/{patternfly-no-reset.scss → patternfly-no-globals.scss} +1 -0
  307. package/patternfly.css +1234 -2483
  308. package/patternfly.min.css +1 -1
  309. package/patternfly.min.css.map +1 -1
  310. package/sass-utilities/functions.scss +8 -24
  311. package/sass-utilities/mixins.scss +15 -39
  312. package/sass-utilities/placeholders.scss +0 -23
  313. package/sass-utilities/scss-variables.scss +5 -6
  314. package/sass-utilities/themes/dark/placeholders.scss +0 -22
  315. package/sass-utilities/themes/dark/scss-variables.scss +1 -1
  316. package/utilities/Spacing/spacing.scss +2 -2
  317. package/utilities/Text/text.css +48 -48
  318. package/utilities/Text/text.scss +6 -6
  319. package/utilities/Text/themes/dark/text.scss +2 -2
  320. package/assets/fonts/RedHatDisplay/RedHatDisplay-Black.woff +0 -0
  321. package/assets/fonts/RedHatDisplay/RedHatDisplay-BlackItalic.woff +0 -0
  322. package/assets/fonts/RedHatDisplay/RedHatDisplay-Bold.woff +0 -0
  323. package/assets/fonts/RedHatDisplay/RedHatDisplay-BoldItalic.woff +0 -0
  324. package/assets/fonts/RedHatDisplay/RedHatDisplay-Italic.woff +0 -0
  325. package/assets/fonts/RedHatDisplay/RedHatDisplay-Medium.woff +0 -0
  326. package/assets/fonts/RedHatDisplay/RedHatDisplay-MediumItalic.woff +0 -0
  327. package/assets/fonts/RedHatDisplay/RedHatDisplay-Regular.woff +0 -0
  328. package/assets/fonts/RedHatText/RedHatText-Bold.woff +0 -0
  329. package/assets/fonts/RedHatText/RedHatText-BoldItalic.woff +0 -0
  330. package/assets/fonts/RedHatText/RedHatText-Italic.woff +0 -0
  331. package/assets/fonts/RedHatText/RedHatText-Medium.woff +0 -0
  332. package/assets/fonts/RedHatText/RedHatText-MediumItalic.woff +0 -0
  333. package/assets/fonts/RedHatText/RedHatText-Regular.woff +0 -0
  334. package/assets/fonts/webfonts/fa-solid-900.woff +0 -0
  335. package/assets/pficon/pficon.woff +0 -0
  336. package/base/_shield-inheritable.scss +0 -69
  337. package/base/_shield-noninheritable.scss +0 -13
  338. package/base/patternfly-shield-inheritable.css +0 -66
  339. package/base/patternfly-shield-inheritable.scss +0 -4
  340. package/base/patternfly-shield-noninheritable.css +0 -9
  341. package/base/patternfly-shield-noninheritable.scss +0 -4
  342. package/sass-utilities/bs-variables.scss +0 -709
package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md CHANGED
@@ -106,7 +106,7 @@ section: components
106
106
  </div>
107
107
  <section class="pf-c-app-launcher__group">
108
108
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
109
- <ul>
109
+ <ul role="list">
110
110
  <li
111
111
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
112
112
  >
@@ -158,7 +158,7 @@ section: components
158
158
  <hr class="pf-c-divider" />
159
159
  <section class="pf-c-app-launcher__group">
160
160
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
161
- <ul>
161
+ <ul role="list">
162
162
  <li
163
163
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
164
164
  >
@@ -813,7 +813,7 @@ section: components
813
813
  id="drawer-collapsed-example-page-primary-nav"
814
814
  aria-label="Global"
815
815
  >
816
- <ul class="pf-c-nav__list">
816
+ <ul class="pf-c-nav__list" role="list">
817
817
  <li class="pf-c-nav__item">
818
818
  <a href="#" class="pf-c-nav__link">System panel</a>
819
819
  </li>
@@ -846,7 +846,7 @@ section: components
846
846
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
847
847
  <div class="pf-c-page__main-body">
848
848
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
849
- <ol class="pf-c-breadcrumb__list">
849
+ <ol class="pf-c-breadcrumb__list" role="list">
850
850
  <li class="pf-c-breadcrumb__item">
851
851
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
852
852
  </li>
@@ -986,7 +986,7 @@ section: components
986
986
  </div>
987
987
  </div>
988
988
  <div class="pf-c-notification-drawer__body">
989
- <ul class="pf-c-notification-drawer__list">
989
+ <ul class="pf-c-notification-drawer__list" role="list">
990
990
  <li
991
991
  class="pf-c-notification-drawer__list-item pf-m-read pf-m-info"
992
992
  >
@@ -1063,7 +1063,7 @@ section: components
1063
1063
  </li>
1064
1064
 
1065
1065
  <li
1066
- class="pf-c-notification-drawer__list-item pf-m-read pf-m-default"
1066
+ class="pf-c-notification-drawer__list-item pf-m-read pf-m-custom"
1067
1067
  >
1068
1068
  <div class="pf-c-notification-drawer__list-item-header">
1069
1069
  <span
@@ -1074,7 +1074,7 @@ section: components
1074
1074
  <h2
1075
1075
  class="pf-c-notification-drawer__list-item-header-title"
1076
1076
  >
1077
- <span class="pf-screen-reader">Default notification:</span>
1077
+ <span class="pf-screen-reader">Custom notification:</span>
1078
1078
  Read
1079
1079
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
1080
1080
  </h2>
@@ -1138,7 +1138,7 @@ section: components
1138
1138
  </li>
1139
1139
 
1140
1140
  <li
1141
- class="pf-c-notification-drawer__list-item pf-m-read pf-m-default"
1141
+ class="pf-c-notification-drawer__list-item pf-m-read pf-m-custom"
1142
1142
  >
1143
1143
  <div class="pf-c-notification-drawer__list-item-header">
1144
1144
  <span
@@ -1149,7 +1149,7 @@ section: components
1149
1149
  <h2
1150
1150
  class="pf-c-notification-drawer__list-item-header-title"
1151
1151
  >
1152
- <span class="pf-screen-reader">Default notification:</span>
1152
+ <span class="pf-screen-reader">Custom notification:</span>
1153
1153
  Read
1154
1154
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
1155
1155
  </h2>
@@ -1623,7 +1623,7 @@ section: components
1623
1623
  </div>
1624
1624
  <section class="pf-c-app-launcher__group">
1625
1625
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
1626
- <ul>
1626
+ <ul role="list">
1627
1627
  <li
1628
1628
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
1629
1629
  >
@@ -1675,7 +1675,7 @@ section: components
1675
1675
  <hr class="pf-c-divider" />
1676
1676
  <section class="pf-c-app-launcher__group">
1677
1677
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
1678
- <ul>
1678
+ <ul role="list">
1679
1679
  <li
1680
1680
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
1681
1681
  >
@@ -2330,7 +2330,7 @@ section: components
2330
2330
  id="drawer-expanded-read-example-page-primary-nav"
2331
2331
  aria-label="Global"
2332
2332
  >
2333
- <ul class="pf-c-nav__list">
2333
+ <ul class="pf-c-nav__list" role="list">
2334
2334
  <li class="pf-c-nav__item">
2335
2335
  <a href="#" class="pf-c-nav__link">System panel</a>
2336
2336
  </li>
@@ -2363,7 +2363,7 @@ section: components
2363
2363
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
2364
2364
  <div class="pf-c-page__main-body">
2365
2365
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
2366
- <ol class="pf-c-breadcrumb__list">
2366
+ <ol class="pf-c-breadcrumb__list" role="list">
2367
2367
  <li class="pf-c-breadcrumb__item">
2368
2368
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
2369
2369
  </li>
@@ -2503,7 +2503,7 @@ section: components
2503
2503
  </div>
2504
2504
  </div>
2505
2505
  <div class="pf-c-notification-drawer__body">
2506
- <ul class="pf-c-notification-drawer__list">
2506
+ <ul class="pf-c-notification-drawer__list" role="list">
2507
2507
  <li
2508
2508
  class="pf-c-notification-drawer__list-item pf-m-read pf-m-info"
2509
2509
  >
@@ -2580,7 +2580,7 @@ section: components
2580
2580
  </li>
2581
2581
 
2582
2582
  <li
2583
- class="pf-c-notification-drawer__list-item pf-m-read pf-m-default"
2583
+ class="pf-c-notification-drawer__list-item pf-m-read pf-m-custom"
2584
2584
  >
2585
2585
  <div class="pf-c-notification-drawer__list-item-header">
2586
2586
  <span
@@ -2591,7 +2591,7 @@ section: components
2591
2591
  <h2
2592
2592
  class="pf-c-notification-drawer__list-item-header-title"
2593
2593
  >
2594
- <span class="pf-screen-reader">Default notification:</span>
2594
+ <span class="pf-screen-reader">Custom notification:</span>
2595
2595
  Read
2596
2596
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
2597
2597
  </h2>
@@ -2655,7 +2655,7 @@ section: components
2655
2655
  </li>
2656
2656
 
2657
2657
  <li
2658
- class="pf-c-notification-drawer__list-item pf-m-read pf-m-default"
2658
+ class="pf-c-notification-drawer__list-item pf-m-read pf-m-custom"
2659
2659
  >
2660
2660
  <div class="pf-c-notification-drawer__list-item-header">
2661
2661
  <span
@@ -2666,7 +2666,7 @@ section: components
2666
2666
  <h2
2667
2667
  class="pf-c-notification-drawer__list-item-header-title"
2668
2668
  >
2669
- <span class="pf-screen-reader">Default notification:</span>
2669
+ <span class="pf-screen-reader">Custom notification:</span>
2670
2670
  Read
2671
2671
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
2672
2672
  </h2>
@@ -3145,7 +3145,7 @@ section: components
3145
3145
  </div>
3146
3146
  <section class="pf-c-app-launcher__group">
3147
3147
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
3148
- <ul>
3148
+ <ul role="list">
3149
3149
  <li
3150
3150
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
3151
3151
  >
@@ -3197,7 +3197,7 @@ section: components
3197
3197
  <hr class="pf-c-divider" />
3198
3198
  <section class="pf-c-app-launcher__group">
3199
3199
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
3200
- <ul>
3200
+ <ul role="list">
3201
3201
  <li
3202
3202
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
3203
3203
  >
@@ -3852,7 +3852,7 @@ section: components
3852
3852
  id="drawer-expanded-unread-example-page-primary-nav"
3853
3853
  aria-label="Global"
3854
3854
  >
3855
- <ul class="pf-c-nav__list">
3855
+ <ul class="pf-c-nav__list" role="list">
3856
3856
  <li class="pf-c-nav__item">
3857
3857
  <a href="#" class="pf-c-nav__link">System panel</a>
3858
3858
  </li>
@@ -3885,7 +3885,7 @@ section: components
3885
3885
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
3886
3886
  <div class="pf-c-page__main-body">
3887
3887
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
3888
- <ol class="pf-c-breadcrumb__list">
3888
+ <ol class="pf-c-breadcrumb__list" role="list">
3889
3889
  <li class="pf-c-breadcrumb__item">
3890
3890
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
3891
3891
  </li>
@@ -4025,7 +4025,7 @@ section: components
4025
4025
  </div>
4026
4026
  </div>
4027
4027
  <div class="pf-c-notification-drawer__body">
4028
- <ul class="pf-c-notification-drawer__list">
4028
+ <ul class="pf-c-notification-drawer__list" role="list">
4029
4029
  <li
4030
4030
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
4031
4031
  tabindex="0"
@@ -4103,7 +4103,7 @@ section: components
4103
4103
  </li>
4104
4104
 
4105
4105
  <li
4106
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
4106
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
4107
4107
  tabindex="0"
4108
4108
  >
4109
4109
  <div class="pf-c-notification-drawer__list-item-header">
@@ -4115,7 +4115,7 @@ section: components
4115
4115
  <h2
4116
4116
  class="pf-c-notification-drawer__list-item-header-title"
4117
4117
  >
4118
- <span class="pf-screen-reader">Default notification:</span>
4118
+ <span class="pf-screen-reader">Custom notification:</span>
4119
4119
  Unread
4120
4120
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
4121
4121
  </h2>
@@ -4179,7 +4179,7 @@ section: components
4179
4179
  </li>
4180
4180
 
4181
4181
  <li
4182
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
4182
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
4183
4183
  tabindex="0"
4184
4184
  >
4185
4185
  <div class="pf-c-notification-drawer__list-item-header">
@@ -4191,7 +4191,7 @@ section: components
4191
4191
  <h2
4192
4192
  class="pf-c-notification-drawer__list-item-header-title"
4193
4193
  >
4194
- <span class="pf-screen-reader">Default notification:</span>
4194
+ <span class="pf-screen-reader">Custom notification:</span>
4195
4195
  Unread
4196
4196
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
4197
4197
  </h2>
@@ -4670,7 +4670,7 @@ section: components
4670
4670
  </div>
4671
4671
  <section class="pf-c-app-launcher__group">
4672
4672
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
4673
- <ul>
4673
+ <ul role="list">
4674
4674
  <li
4675
4675
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
4676
4676
  >
@@ -4722,7 +4722,7 @@ section: components
4722
4722
  <hr class="pf-c-divider" />
4723
4723
  <section class="pf-c-app-launcher__group">
4724
4724
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
4725
- <ul>
4725
+ <ul role="list">
4726
4726
  <li
4727
4727
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
4728
4728
  >
@@ -5377,7 +5377,7 @@ section: components
5377
5377
  id="drawer-expanded-attention-example-page-primary-nav"
5378
5378
  aria-label="Global"
5379
5379
  >
5380
- <ul class="pf-c-nav__list">
5380
+ <ul class="pf-c-nav__list" role="list">
5381
5381
  <li class="pf-c-nav__item">
5382
5382
  <a href="#" class="pf-c-nav__link">System panel</a>
5383
5383
  </li>
@@ -5410,7 +5410,7 @@ section: components
5410
5410
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
5411
5411
  <div class="pf-c-page__main-body">
5412
5412
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
5413
- <ol class="pf-c-breadcrumb__list">
5413
+ <ol class="pf-c-breadcrumb__list" role="list">
5414
5414
  <li class="pf-c-breadcrumb__item">
5415
5415
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
5416
5416
  </li>
@@ -5550,7 +5550,7 @@ section: components
5550
5550
  </div>
5551
5551
  </div>
5552
5552
  <div class="pf-c-notification-drawer__body">
5553
- <ul class="pf-c-notification-drawer__list">
5553
+ <ul class="pf-c-notification-drawer__list" role="list">
5554
5554
  <li
5555
5555
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
5556
5556
  tabindex="0"
@@ -5703,7 +5703,7 @@ section: components
5703
5703
  </li>
5704
5704
 
5705
5705
  <li
5706
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
5706
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
5707
5707
  tabindex="0"
5708
5708
  >
5709
5709
  <div class="pf-c-notification-drawer__list-item-header">
@@ -5715,7 +5715,7 @@ section: components
5715
5715
  <h2
5716
5716
  class="pf-c-notification-drawer__list-item-header-title"
5717
5717
  >
5718
- <span class="pf-screen-reader">Default notification:</span>
5718
+ <span class="pf-screen-reader">Custom notification:</span>
5719
5719
  Unread
5720
5720
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
5721
5721
  </h2>
@@ -6194,7 +6194,7 @@ section: components
6194
6194
  </div>
6195
6195
  <section class="pf-c-app-launcher__group">
6196
6196
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
6197
- <ul>
6197
+ <ul role="list">
6198
6198
  <li
6199
6199
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
6200
6200
  >
@@ -6246,7 +6246,7 @@ section: components
6246
6246
  <hr class="pf-c-divider" />
6247
6247
  <section class="pf-c-app-launcher__group">
6248
6248
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
6249
- <ul>
6249
+ <ul role="list">
6250
6250
  <li
6251
6251
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
6252
6252
  >
@@ -6901,7 +6901,7 @@ section: components
6901
6901
  id="drawer-expanded-with-groups-example-page-primary-nav"
6902
6902
  aria-label="Global"
6903
6903
  >
6904
- <ul class="pf-c-nav__list">
6904
+ <ul class="pf-c-nav__list" role="list">
6905
6905
  <li class="pf-c-nav__item">
6906
6906
  <a href="#" class="pf-c-nav__link">System panel</a>
6907
6907
  </li>
@@ -6934,7 +6934,7 @@ section: components
6934
6934
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
6935
6935
  <div class="pf-c-page__main-body">
6936
6936
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
6937
- <ol class="pf-c-breadcrumb__list">
6937
+ <ol class="pf-c-breadcrumb__list" role="list">
6938
6938
  <li class="pf-c-breadcrumb__item">
6939
6939
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
6940
6940
  </li>
@@ -7096,7 +7096,11 @@ section: components
7096
7096
  </span>
7097
7097
  </button>
7098
7098
  </h1>
7099
- <ul class="pf-c-notification-drawer__list" hidden>
7099
+ <ul
7100
+ class="pf-c-notification-drawer__list"
7101
+ role="list"
7102
+ hidden
7103
+ >
7100
7104
  <li
7101
7105
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
7102
7106
  tabindex="0"
@@ -7177,7 +7181,7 @@ section: components
7177
7181
  </li>
7178
7182
 
7179
7183
  <li
7180
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
7184
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
7181
7185
  tabindex="0"
7182
7186
  >
7183
7187
  <div class="pf-c-notification-drawer__list-item-header">
@@ -7192,7 +7196,7 @@ section: components
7192
7196
  <h2
7193
7197
  class="pf-c-notification-drawer__list-item-header-title"
7194
7198
  >
7195
- <span class="pf-screen-reader">Default notification:</span>
7199
+ <span class="pf-screen-reader">Custom notification:</span>
7196
7200
  Unread
7197
7201
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
7198
7202
  </h2>
@@ -7259,7 +7263,7 @@ section: components
7259
7263
  </li>
7260
7264
 
7261
7265
  <li
7262
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
7266
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
7263
7267
  tabindex="0"
7264
7268
  >
7265
7269
  <div class="pf-c-notification-drawer__list-item-header">
@@ -7274,7 +7278,7 @@ section: components
7274
7278
  <h2
7275
7279
  class="pf-c-notification-drawer__list-item-header-title"
7276
7280
  >
7277
- <span class="pf-screen-reader">Default notification:</span>
7281
+ <span class="pf-screen-reader">Custom notification:</span>
7278
7282
  Unread
7279
7283
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
7280
7284
  </h2>
@@ -7672,7 +7676,7 @@ section: components
7672
7676
  </span>
7673
7677
  </button>
7674
7678
  </h1>
7675
- <ul class="pf-c-notification-drawer__list">
7679
+ <ul class="pf-c-notification-drawer__list" role="list">
7676
7680
  <li
7677
7681
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
7678
7682
  tabindex="0"
@@ -7753,7 +7757,7 @@ section: components
7753
7757
  </li>
7754
7758
 
7755
7759
  <li
7756
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
7760
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
7757
7761
  tabindex="0"
7758
7762
  >
7759
7763
  <div class="pf-c-notification-drawer__list-item-header">
@@ -7768,7 +7772,7 @@ section: components
7768
7772
  <h2
7769
7773
  class="pf-c-notification-drawer__list-item-header-title"
7770
7774
  >
7771
- <span class="pf-screen-reader">Default notification:</span>
7775
+ <span class="pf-screen-reader">Custom notification:</span>
7772
7776
  Unread
7773
7777
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
7774
7778
  </h2>
@@ -7835,7 +7839,7 @@ section: components
7835
7839
  </li>
7836
7840
 
7837
7841
  <li
7838
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
7842
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
7839
7843
  tabindex="0"
7840
7844
  >
7841
7845
  <div class="pf-c-notification-drawer__list-item-header">
@@ -7850,7 +7854,7 @@ section: components
7850
7854
  <h2
7851
7855
  class="pf-c-notification-drawer__list-item-header-title"
7852
7856
  >
7853
- <span class="pf-screen-reader">Default notification:</span>
7857
+ <span class="pf-screen-reader">Custom notification:</span>
7854
7858
  Unread
7855
7859
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
7856
7860
  </h2>
@@ -8246,7 +8250,11 @@ section: components
8246
8250
  </span>
8247
8251
  </button>
8248
8252
  </h1>
8249
- <ul class="pf-c-notification-drawer__list" hidden>
8253
+ <ul
8254
+ class="pf-c-notification-drawer__list"
8255
+ role="list"
8256
+ hidden
8257
+ >
8250
8258
  <li
8251
8259
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
8252
8260
  tabindex="0"
@@ -8327,7 +8335,7 @@ section: components
8327
8335
  </li>
8328
8336
 
8329
8337
  <li
8330
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
8338
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
8331
8339
  tabindex="0"
8332
8340
  >
8333
8341
  <div class="pf-c-notification-drawer__list-item-header">
@@ -8342,7 +8350,7 @@ section: components
8342
8350
  <h2
8343
8351
  class="pf-c-notification-drawer__list-item-header-title"
8344
8352
  >
8345
- <span class="pf-screen-reader">Default notification:</span>
8353
+ <span class="pf-screen-reader">Custom notification:</span>
8346
8354
  Unread
8347
8355
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
8348
8356
  </h2>
@@ -8409,7 +8417,7 @@ section: components
8409
8417
  </li>
8410
8418
 
8411
8419
  <li
8412
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
8420
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
8413
8421
  tabindex="0"
8414
8422
  >
8415
8423
  <div class="pf-c-notification-drawer__list-item-header">
@@ -8424,7 +8432,7 @@ section: components
8424
8432
  <h2
8425
8433
  class="pf-c-notification-drawer__list-item-header-title"
8426
8434
  >
8427
- <span class="pf-screen-reader">Default notification:</span>
8435
+ <span class="pf-screen-reader">Custom notification:</span>
8428
8436
  Unread
8429
8437
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
8430
8438
  </h2>
@@ -8820,7 +8828,11 @@ section: components
8820
8828
  </span>
8821
8829
  </button>
8822
8830
  </h1>
8823
- <ul class="pf-c-notification-drawer__list" hidden>
8831
+ <ul
8832
+ class="pf-c-notification-drawer__list"
8833
+ role="list"
8834
+ hidden
8835
+ >
8824
8836
  <li
8825
8837
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
8826
8838
  tabindex="0"
@@ -8901,7 +8913,7 @@ section: components
8901
8913
  </li>
8902
8914
 
8903
8915
  <li
8904
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
8916
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
8905
8917
  tabindex="0"
8906
8918
  >
8907
8919
  <div class="pf-c-notification-drawer__list-item-header">
@@ -8916,7 +8928,7 @@ section: components
8916
8928
  <h2
8917
8929
  class="pf-c-notification-drawer__list-item-header-title"
8918
8930
  >
8919
- <span class="pf-screen-reader">Default notification:</span>
8931
+ <span class="pf-screen-reader">Custom notification:</span>
8920
8932
  Unread
8921
8933
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
8922
8934
  </h2>
@@ -8983,7 +8995,7 @@ section: components
8983
8995
  </li>
8984
8996
 
8985
8997
  <li
8986
- class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-default"
8998
+ class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-custom"
8987
8999
  tabindex="0"
8988
9000
  >
8989
9001
  <div class="pf-c-notification-drawer__list-item-header">
@@ -8998,7 +9010,7 @@ section: components
8998
9010
  <h2
8999
9011
  class="pf-c-notification-drawer__list-item-header-title"
9000
9012
  >
9001
- <span class="pf-screen-reader">Default notification:</span>
9013
+ <span class="pf-screen-reader">Custom notification:</span>
9002
9014
  Unread
9003
9015
  recommendation notification title. This is a long title to show how the title will wrap if it is long and wraps to multiple lines.
9004
9016
  </h2>