@patternfly/react-styles 5.2.0-prerelease.6 → 6.0.0-alpha.10

Sign up to get free protection for your applications and to get access to all the features.
Files changed (239) hide show
  1. package/CHANGELOG.md +70 -0
  2. package/css/assets/images/PF-Backdrop.svg +1 -0
  3. package/css/assets/images/PF-HorizontalLogo-Color.svg +29 -0
  4. package/css/assets/images/PF-HorizontalLogo-Reverse.svg +28 -0
  5. package/css/assets/images/PF-IconLogo-Reverse.svg +14 -0
  6. package/css/assets/images/PF-IconLogo-color.svg +17 -0
  7. package/css/assets/images/PF-IconLogo.svg +17 -0
  8. package/css/assets/images/pf-background.svg +22 -0
  9. package/css/components/AboutModalBox/about-modal-box.css +57 -94
  10. package/css/components/AboutModalBox/about-modal-box.d.ts +1 -2
  11. package/css/components/AboutModalBox/about-modal-box.js +1 -2
  12. package/css/components/AboutModalBox/about-modal-box.mjs +1 -2
  13. package/css/components/Accordion/accordion.css +81 -182
  14. package/css/components/Accordion/accordion.d.ts +2 -2
  15. package/css/components/Accordion/accordion.js +2 -2
  16. package/css/components/Accordion/accordion.mjs +2 -2
  17. package/css/components/ActionList/action-list.css +18 -17
  18. package/css/components/Alert/alert-group.css +20 -16
  19. package/css/components/Alert/alert.css +57 -84
  20. package/css/components/Alert/alert.d.ts +1 -2
  21. package/css/components/Alert/alert.js +1 -2
  22. package/css/components/Alert/alert.mjs +1 -2
  23. package/css/components/Avatar/avatar.css +10 -13
  24. package/css/components/Avatar/avatar.d.ts +1 -2
  25. package/css/components/Avatar/avatar.js +1 -2
  26. package/css/components/Avatar/avatar.mjs +1 -2
  27. package/css/components/BackToTop/back-to-top.css +17 -16
  28. package/css/components/Backdrop/backdrop.css +6 -2
  29. package/css/components/BackgroundImage/background-image.css +5 -1
  30. package/css/components/Badge/badge.css +23 -15
  31. package/css/components/Badge/badge.d.ts +2 -2
  32. package/css/components/Badge/badge.js +2 -2
  33. package/css/components/Badge/badge.mjs +2 -2
  34. package/css/components/Banner/banner.css +90 -64
  35. package/css/components/Banner/banner.d.ts +12 -4
  36. package/css/components/Banner/banner.js +12 -4
  37. package/css/components/Banner/banner.mjs +12 -4
  38. package/css/components/Breadcrumb/breadcrumb.css +19 -16
  39. package/css/components/Button/button.css +444 -435
  40. package/css/components/Button/button.d.ts +10 -9
  41. package/css/components/Button/button.js +10 -9
  42. package/css/components/Button/button.mjs +10 -9
  43. package/css/components/Card/card.css +97 -194
  44. package/css/components/Card/card.d.ts +3 -9
  45. package/css/components/Card/card.js +3 -9
  46. package/css/components/Card/card.mjs +3 -9
  47. package/css/components/Check/check.css +17 -16
  48. package/css/components/ClipboardCopy/clipboard-copy.css +30 -33
  49. package/css/components/ClipboardCopy/clipboard-copy.d.ts +1 -2
  50. package/css/components/ClipboardCopy/clipboard-copy.js +1 -2
  51. package/css/components/ClipboardCopy/clipboard-copy.mjs +1 -2
  52. package/css/components/CodeBlock/code-block.css +18 -9
  53. package/css/components/Content/content.css +67 -67
  54. package/css/components/DataList/data-list.css +101 -158
  55. package/css/components/DataList/data-list.d.ts +1 -2
  56. package/css/components/DataList/data-list.js +1 -2
  57. package/css/components/DataList/data-list.mjs +1 -2
  58. package/css/components/DescriptionList/description-list.css +39 -34
  59. package/css/components/Divider/divider.css +97 -177
  60. package/css/components/Divider/divider.d.ts +1 -0
  61. package/css/components/Divider/divider.js +1 -0
  62. package/css/components/Divider/divider.mjs +1 -0
  63. package/css/components/DragDrop/drag-drop.css +18 -14
  64. package/css/components/DragDrop/drag-drop.d.ts +1 -2
  65. package/css/components/DragDrop/drag-drop.js +1 -2
  66. package/css/components/DragDrop/drag-drop.mjs +1 -2
  67. package/css/components/Drawer/drawer.css +112 -113
  68. package/css/components/Drawer/drawer.d.ts +3 -3
  69. package/css/components/Drawer/drawer.js +3 -3
  70. package/css/components/Drawer/drawer.mjs +3 -3
  71. package/css/components/EmptyState/empty-state.css +57 -34
  72. package/css/components/EmptyState/empty-state.d.ts +6 -1
  73. package/css/components/EmptyState/empty-state.js +6 -1
  74. package/css/components/EmptyState/empty-state.mjs +6 -1
  75. package/css/components/ExpandableSection/expandable-section.css +64 -62
  76. package/css/components/ExpandableSection/expandable-section.d.ts +1 -3
  77. package/css/components/ExpandableSection/expandable-section.js +1 -3
  78. package/css/components/ExpandableSection/expandable-section.mjs +1 -3
  79. package/css/components/FileUpload/file-upload.css +28 -34
  80. package/css/components/Form/form.css +62 -114
  81. package/css/components/Form/form.d.ts +2 -6
  82. package/css/components/Form/form.js +2 -6
  83. package/css/components/Form/form.mjs +2 -6
  84. package/css/components/FormControl/form-control.css +86 -111
  85. package/css/components/FormControl/form-control.d.ts +1 -2
  86. package/css/components/FormControl/form-control.js +1 -2
  87. package/css/components/FormControl/form-control.mjs +1 -2
  88. package/css/components/HelperText/helper-text.css +28 -34
  89. package/css/components/HelperText/helper-text.d.ts +1 -2
  90. package/css/components/HelperText/helper-text.js +1 -2
  91. package/css/components/HelperText/helper-text.mjs +1 -2
  92. package/css/components/Hint/hint.css +28 -21
  93. package/css/components/Hint/hint.d.ts +1 -2
  94. package/css/components/Hint/hint.js +1 -2
  95. package/css/components/Hint/hint.mjs +1 -2
  96. package/css/components/Icon/icon.css +154 -18
  97. package/css/components/Icon/icon.d.ts +11 -0
  98. package/css/components/Icon/icon.js +11 -0
  99. package/css/components/Icon/icon.mjs +11 -0
  100. package/css/components/InlineEdit/inline-edit.css +8 -7
  101. package/css/components/InputGroup/input-group.css +22 -38
  102. package/css/components/InputGroup/input-group.d.ts +1 -2
  103. package/css/components/InputGroup/input-group.js +1 -2
  104. package/css/components/InputGroup/input-group.mjs +1 -2
  105. package/css/components/JumpLinks/jump-links.css +34 -34
  106. package/css/components/Label/label-group.css +39 -44
  107. package/css/components/Label/label.css +258 -355
  108. package/css/components/Label/label.d.ts +11 -10
  109. package/css/components/Label/label.js +11 -10
  110. package/css/components/Label/label.mjs +11 -10
  111. package/css/components/List/list.css +16 -16
  112. package/css/components/Login/login.css +70 -97
  113. package/css/components/Login/login.d.ts +0 -2
  114. package/css/components/Login/login.js +0 -2
  115. package/css/components/Login/login.mjs +0 -2
  116. package/css/components/Masthead/masthead.css +262 -498
  117. package/css/components/Masthead/masthead.d.ts +3 -45
  118. package/css/components/Masthead/masthead.js +3 -45
  119. package/css/components/Masthead/masthead.mjs +3 -45
  120. package/css/components/MenuToggle/menu-toggle.css +56 -78
  121. package/css/components/ModalBox/modal-box.css +59 -52
  122. package/css/components/ModalBox/modal-box.d.ts +1 -2
  123. package/css/components/ModalBox/modal-box.js +1 -2
  124. package/css/components/ModalBox/modal-box.mjs +1 -2
  125. package/css/components/MultipleFileUpload/multiple-file-upload.css +77 -50
  126. package/css/components/MultipleFileUpload/multiple-file-upload.d.ts +0 -1
  127. package/css/components/MultipleFileUpload/multiple-file-upload.js +0 -1
  128. package/css/components/MultipleFileUpload/multiple-file-upload.mjs +0 -1
  129. package/css/components/Nav/nav.css +241 -917
  130. package/css/components/Nav/nav.d.ts +9 -20
  131. package/css/components/Nav/nav.js +9 -20
  132. package/css/components/Nav/nav.mjs +9 -20
  133. package/css/components/NotificationBadge/notification-badge.css +56 -81
  134. package/css/components/NotificationBadge/notification-badge.d.ts +1 -5
  135. package/css/components/NotificationBadge/notification-badge.js +1 -5
  136. package/css/components/NotificationBadge/notification-badge.mjs +1 -5
  137. package/css/components/NotificationDrawer/notification-drawer.css +104 -115
  138. package/css/components/NotificationDrawer/notification-drawer.d.ts +3 -3
  139. package/css/components/NotificationDrawer/notification-drawer.js +3 -3
  140. package/css/components/NotificationDrawer/notification-drawer.mjs +3 -3
  141. package/css/components/NumberInput/number-input.css +8 -8
  142. package/css/components/NumberInput/number-input.d.ts +0 -3
  143. package/css/components/NumberInput/number-input.js +0 -3
  144. package/css/components/NumberInput/number-input.mjs +0 -3
  145. package/css/components/OverflowMenu/overflow-menu.css +17 -47
  146. package/css/components/OverflowMenu/overflow-menu.d.ts +1 -3
  147. package/css/components/OverflowMenu/overflow-menu.js +1 -3
  148. package/css/components/OverflowMenu/overflow-menu.mjs +1 -3
  149. package/css/components/Page/page.css +112 -209
  150. package/css/components/Page/page.d.ts +5 -12
  151. package/css/components/Page/page.js +5 -12
  152. package/css/components/Page/page.mjs +5 -12
  153. package/css/components/Pagination/pagination.css +64 -121
  154. package/css/components/Pagination/pagination.d.ts +2 -5
  155. package/css/components/Pagination/pagination.js +2 -5
  156. package/css/components/Pagination/pagination.mjs +2 -5
  157. package/css/components/Panel/panel.css +27 -23
  158. package/css/components/Panel/panel.d.ts +2 -2
  159. package/css/components/Panel/panel.js +2 -2
  160. package/css/components/Panel/panel.mjs +2 -2
  161. package/css/components/Popover/popover.css +42 -51
  162. package/css/components/Popover/popover.d.ts +1 -2
  163. package/css/components/Popover/popover.js +1 -2
  164. package/css/components/Popover/popover.mjs +1 -2
  165. package/css/components/Progress/progress.css +31 -45
  166. package/css/components/Progress/progress.d.ts +1 -2
  167. package/css/components/Progress/progress.js +1 -2
  168. package/css/components/Progress/progress.mjs +1 -2
  169. package/css/components/Radio/radio.css +15 -11
  170. package/css/components/Sidebar/sidebar.css +20 -9
  171. package/css/components/Sidebar/sidebar.d.ts +1 -0
  172. package/css/components/Sidebar/sidebar.js +1 -0
  173. package/css/components/Sidebar/sidebar.mjs +1 -0
  174. package/css/components/SimpleList/simple-list.css +35 -52
  175. package/css/components/SimpleList/simple-list.d.ts +2 -2
  176. package/css/components/SimpleList/simple-list.js +2 -2
  177. package/css/components/SimpleList/simple-list.mjs +2 -2
  178. package/css/components/Skeleton/skeleton.css +18 -20
  179. package/css/components/Skeleton/skeleton.d.ts +1 -2
  180. package/css/components/Skeleton/skeleton.js +1 -2
  181. package/css/components/Skeleton/skeleton.mjs +1 -2
  182. package/css/components/SkipToContent/skip-to-content.css +6 -3
  183. package/css/components/Slider/slider.css +34 -30
  184. package/css/components/Spinner/spinner.css +17 -34
  185. package/css/components/Switch/switch.css +41 -37
  186. package/css/components/Switch/switch.d.ts +1 -2
  187. package/css/components/Switch/switch.js +1 -2
  188. package/css/components/Switch/switch.mjs +1 -2
  189. package/css/components/TabContent/tab-content.css +17 -11
  190. package/css/components/TabContent/tab-content.d.ts +1 -1
  191. package/css/components/TabContent/tab-content.js +1 -1
  192. package/css/components/TabContent/tab-content.mjs +1 -1
  193. package/css/components/Table/table-grid.css +8 -8
  194. package/css/components/Table/table.css +79 -88
  195. package/css/components/Tile/tile.css +40 -81
  196. package/css/components/Tile/tile.d.ts +0 -1
  197. package/css/components/Tile/tile.js +0 -1
  198. package/css/components/Tile/tile.mjs +0 -1
  199. package/css/components/Timestamp/timestamp.css +12 -9
  200. package/css/components/Title/title.css +70 -19
  201. package/css/components/Title/title.d.ts +7 -1
  202. package/css/components/Title/title.js +7 -1
  203. package/css/components/Title/title.mjs +7 -1
  204. package/css/components/ToggleGroup/toggle-group.css +34 -47
  205. package/css/components/ToggleGroup/toggle-group.d.ts +0 -1
  206. package/css/components/ToggleGroup/toggle-group.js +0 -1
  207. package/css/components/ToggleGroup/toggle-group.mjs +0 -1
  208. package/css/components/Toolbar/toolbar.css +2527 -1040
  209. package/css/components/Toolbar/toolbar.d.ts +406 -103
  210. package/css/components/Toolbar/toolbar.js +406 -103
  211. package/css/components/Toolbar/toolbar.mjs +406 -103
  212. package/css/components/Tooltip/tooltip.css +16 -16
  213. package/css/components/Tooltip/tooltip.d.ts +0 -1
  214. package/css/components/Tooltip/tooltip.js +0 -1
  215. package/css/components/Tooltip/tooltip.mjs +0 -1
  216. package/css/components/Truncate/truncate.css +4 -0
  217. package/css/docs/components/Button/examples/Button.css +4 -0
  218. package/css/docs/components/Divider/examples/Divider.css +3 -1
  219. package/css/docs/components/DragDrop/examples/DragDrop.css +1 -1
  220. package/css/docs/components/Label/examples/Label.css +4 -0
  221. package/css/docs/components/Nav/examples/Navigation.css +1 -22
  222. package/css/docs/components/Nav/examples/Navigation.d.ts +0 -3
  223. package/css/docs/components/Nav/examples/Navigation.js +0 -3
  224. package/css/docs/components/Nav/examples/Navigation.mjs +0 -3
  225. package/css/docs/components/Page/examples/Page.css +0 -8
  226. package/css/docs/components/Page/examples/Page.d.ts +0 -7
  227. package/css/docs/components/Page/examples/Page.js +0 -7
  228. package/css/docs/components/Page/examples/Page.mjs +0 -7
  229. package/css/docs/components/Toolbar/examples/Toolbar.css +20 -15
  230. package/css/docs/components/Truncate/examples/Truncate.css +2 -2
  231. package/package.json +5 -4
  232. package/css/docs/components/Avatar/examples/Avatar.css +0 -3
  233. package/css/docs/components/Avatar/examples/Avatar.d.ts +0 -3
  234. package/css/docs/components/Avatar/examples/Avatar.js +0 -4
  235. package/css/docs/components/Avatar/examples/Avatar.mjs +0 -2
  236. package/css/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
  237. package/css/docs/components/NotificationBadge/examples/NotificationBadge.d.ts +0 -5
  238. package/css/docs/components/NotificationBadge/examples/NotificationBadge.js +0 -6
  239. package/css/docs/components/NotificationBadge/examples/NotificationBadge.mjs +0 -4
@@ -1,21 +1,14 @@
1
1
  import './masthead.css';
2
2
  declare const _default: {
3
- "button": "pf-v5-c-button",
4
- "contextSelector": "pf-v5-c-context-selector",
5
- "dropdown": "pf-v5-c-dropdown",
6
3
  "masthead": "pf-v5-c-masthead",
7
4
  "mastheadBrand": "pf-v5-c-masthead__brand",
8
5
  "mastheadContent": "pf-v5-c-masthead__content",
6
+ "mastheadExpandableContent": "pf-v5-c-masthead__expandable-content",
7
+ "mastheadLogo": "pf-v5-c-masthead__logo",
9
8
  "mastheadMain": "pf-v5-c-masthead__main",
10
9
  "mastheadToggle": "pf-v5-c-masthead__toggle",
11
- "menuToggle": "pf-v5-c-menu-toggle",
12
10
  "modifiers": {
13
- "light_200": "pf-m-light-200",
14
- "light": "pf-m-light",
15
- "plain": "pf-m-plain",
16
11
  "resizeObserver": "pf-m-resize-observer",
17
- "fullHeight": "pf-m-full-height",
18
- "horizontal": "pf-m-horizontal",
19
12
  "displayStack": "pf-m-display-stack",
20
13
  "displayInline": "pf-m-display-inline",
21
14
  "insetNone": "pf-m-inset-none",
@@ -26,50 +19,15 @@ declare const _default: {
26
19
  "inset_2xl": "pf-m-inset-2xl",
27
20
  "displayStackOnSm": "pf-m-display-stack-on-sm",
28
21
  "displayInlineOnSm": "pf-m-display-inline-on-sm",
29
- "insetNoneOnSm": "pf-m-inset-none-on-sm",
30
- "insetSmOnSm": "pf-m-inset-sm-on-sm",
31
- "insetMdOnSm": "pf-m-inset-md-on-sm",
32
- "insetLgOnSm": "pf-m-inset-lg-on-sm",
33
- "insetXlOnSm": "pf-m-inset-xl-on-sm",
34
- "inset_2xlOnSm": "pf-m-inset-2xl-on-sm",
35
22
  "displayStackOnMd": "pf-m-display-stack-on-md",
36
23
  "displayInlineOnMd": "pf-m-display-inline-on-md",
37
- "insetNoneOnMd": "pf-m-inset-none-on-md",
38
- "insetSmOnMd": "pf-m-inset-sm-on-md",
39
- "insetMdOnMd": "pf-m-inset-md-on-md",
40
- "insetLgOnMd": "pf-m-inset-lg-on-md",
41
- "insetXlOnMd": "pf-m-inset-xl-on-md",
42
- "inset_2xlOnMd": "pf-m-inset-2xl-on-md",
43
24
  "displayStackOnLg": "pf-m-display-stack-on-lg",
44
25
  "displayInlineOnLg": "pf-m-display-inline-on-lg",
45
- "insetNoneOnLg": "pf-m-inset-none-on-lg",
46
- "insetSmOnLg": "pf-m-inset-sm-on-lg",
47
- "insetMdOnLg": "pf-m-inset-md-on-lg",
48
- "insetLgOnLg": "pf-m-inset-lg-on-lg",
49
- "insetXlOnLg": "pf-m-inset-xl-on-lg",
50
- "inset_2xlOnLg": "pf-m-inset-2xl-on-lg",
51
26
  "displayStackOnXl": "pf-m-display-stack-on-xl",
52
27
  "displayInlineOnXl": "pf-m-display-inline-on-xl",
53
- "insetNoneOnXl": "pf-m-inset-none-on-xl",
54
- "insetSmOnXl": "pf-m-inset-sm-on-xl",
55
- "insetMdOnXl": "pf-m-inset-md-on-xl",
56
- "insetLgOnXl": "pf-m-inset-lg-on-xl",
57
- "insetXlOnXl": "pf-m-inset-xl-on-xl",
58
- "inset_2xlOnXl": "pf-m-inset-2xl-on-xl",
59
28
  "displayStackOn_2xl": "pf-m-display-stack-on-2xl",
60
- "displayInlineOn_2xl": "pf-m-display-inline-on-2xl",
61
- "insetNoneOn_2xl": "pf-m-inset-none-on-2xl",
62
- "insetSmOn_2xl": "pf-m-inset-sm-on-2xl",
63
- "insetMdOn_2xl": "pf-m-inset-md-on-2xl",
64
- "insetLgOn_2xl": "pf-m-inset-lg-on-2xl",
65
- "insetXlOn_2xl": "pf-m-inset-xl-on-2xl",
66
- "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl"
29
+ "displayInlineOn_2xl": "pf-m-display-inline-on-2xl"
67
30
  },
68
- "nav": "pf-v5-c-nav",
69
- "page": "pf-v5-c-page",
70
- "themeDark": "pf-v5-theme-dark",
71
- "toolbar": "pf-v5-c-toolbar",
72
- "toolbarContentSection": "pf-v5-c-toolbar__content-section",
73
31
  "toolbarExpandableContent": "pf-v5-c-toolbar__expandable-content"
74
32
  };
75
33
  export default _default;
@@ -2,22 +2,15 @@
2
2
  exports.__esModule = true;
3
3
  require('./masthead.css');
4
4
  exports.default = {
5
- "button": "pf-v5-c-button",
6
- "contextSelector": "pf-v5-c-context-selector",
7
- "dropdown": "pf-v5-c-dropdown",
8
5
  "masthead": "pf-v5-c-masthead",
9
6
  "mastheadBrand": "pf-v5-c-masthead__brand",
10
7
  "mastheadContent": "pf-v5-c-masthead__content",
8
+ "mastheadExpandableContent": "pf-v5-c-masthead__expandable-content",
9
+ "mastheadLogo": "pf-v5-c-masthead__logo",
11
10
  "mastheadMain": "pf-v5-c-masthead__main",
12
11
  "mastheadToggle": "pf-v5-c-masthead__toggle",
13
- "menuToggle": "pf-v5-c-menu-toggle",
14
12
  "modifiers": {
15
- "light_200": "pf-m-light-200",
16
- "light": "pf-m-light",
17
- "plain": "pf-m-plain",
18
13
  "resizeObserver": "pf-m-resize-observer",
19
- "fullHeight": "pf-m-full-height",
20
- "horizontal": "pf-m-horizontal",
21
14
  "displayStack": "pf-m-display-stack",
22
15
  "displayInline": "pf-m-display-inline",
23
16
  "insetNone": "pf-m-inset-none",
@@ -28,49 +21,14 @@ exports.default = {
28
21
  "inset_2xl": "pf-m-inset-2xl",
29
22
  "displayStackOnSm": "pf-m-display-stack-on-sm",
30
23
  "displayInlineOnSm": "pf-m-display-inline-on-sm",
31
- "insetNoneOnSm": "pf-m-inset-none-on-sm",
32
- "insetSmOnSm": "pf-m-inset-sm-on-sm",
33
- "insetMdOnSm": "pf-m-inset-md-on-sm",
34
- "insetLgOnSm": "pf-m-inset-lg-on-sm",
35
- "insetXlOnSm": "pf-m-inset-xl-on-sm",
36
- "inset_2xlOnSm": "pf-m-inset-2xl-on-sm",
37
24
  "displayStackOnMd": "pf-m-display-stack-on-md",
38
25
  "displayInlineOnMd": "pf-m-display-inline-on-md",
39
- "insetNoneOnMd": "pf-m-inset-none-on-md",
40
- "insetSmOnMd": "pf-m-inset-sm-on-md",
41
- "insetMdOnMd": "pf-m-inset-md-on-md",
42
- "insetLgOnMd": "pf-m-inset-lg-on-md",
43
- "insetXlOnMd": "pf-m-inset-xl-on-md",
44
- "inset_2xlOnMd": "pf-m-inset-2xl-on-md",
45
26
  "displayStackOnLg": "pf-m-display-stack-on-lg",
46
27
  "displayInlineOnLg": "pf-m-display-inline-on-lg",
47
- "insetNoneOnLg": "pf-m-inset-none-on-lg",
48
- "insetSmOnLg": "pf-m-inset-sm-on-lg",
49
- "insetMdOnLg": "pf-m-inset-md-on-lg",
50
- "insetLgOnLg": "pf-m-inset-lg-on-lg",
51
- "insetXlOnLg": "pf-m-inset-xl-on-lg",
52
- "inset_2xlOnLg": "pf-m-inset-2xl-on-lg",
53
28
  "displayStackOnXl": "pf-m-display-stack-on-xl",
54
29
  "displayInlineOnXl": "pf-m-display-inline-on-xl",
55
- "insetNoneOnXl": "pf-m-inset-none-on-xl",
56
- "insetSmOnXl": "pf-m-inset-sm-on-xl",
57
- "insetMdOnXl": "pf-m-inset-md-on-xl",
58
- "insetLgOnXl": "pf-m-inset-lg-on-xl",
59
- "insetXlOnXl": "pf-m-inset-xl-on-xl",
60
- "inset_2xlOnXl": "pf-m-inset-2xl-on-xl",
61
30
  "displayStackOn_2xl": "pf-m-display-stack-on-2xl",
62
- "displayInlineOn_2xl": "pf-m-display-inline-on-2xl",
63
- "insetNoneOn_2xl": "pf-m-inset-none-on-2xl",
64
- "insetSmOn_2xl": "pf-m-inset-sm-on-2xl",
65
- "insetMdOn_2xl": "pf-m-inset-md-on-2xl",
66
- "insetLgOn_2xl": "pf-m-inset-lg-on-2xl",
67
- "insetXlOn_2xl": "pf-m-inset-xl-on-2xl",
68
- "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl"
31
+ "displayInlineOn_2xl": "pf-m-display-inline-on-2xl"
69
32
  },
70
- "nav": "pf-v5-c-nav",
71
- "page": "pf-v5-c-page",
72
- "themeDark": "pf-v5-theme-dark",
73
- "toolbar": "pf-v5-c-toolbar",
74
- "toolbarContentSection": "pf-v5-c-toolbar__content-section",
75
33
  "toolbarExpandableContent": "pf-v5-c-toolbar__expandable-content"
76
34
  };
@@ -1,21 +1,14 @@
1
1
  import './masthead.css';
2
2
  export default {
3
- "button": "pf-v5-c-button",
4
- "contextSelector": "pf-v5-c-context-selector",
5
- "dropdown": "pf-v5-c-dropdown",
6
3
  "masthead": "pf-v5-c-masthead",
7
4
  "mastheadBrand": "pf-v5-c-masthead__brand",
8
5
  "mastheadContent": "pf-v5-c-masthead__content",
6
+ "mastheadExpandableContent": "pf-v5-c-masthead__expandable-content",
7
+ "mastheadLogo": "pf-v5-c-masthead__logo",
9
8
  "mastheadMain": "pf-v5-c-masthead__main",
10
9
  "mastheadToggle": "pf-v5-c-masthead__toggle",
11
- "menuToggle": "pf-v5-c-menu-toggle",
12
10
  "modifiers": {
13
- "light_200": "pf-m-light-200",
14
- "light": "pf-m-light",
15
- "plain": "pf-m-plain",
16
11
  "resizeObserver": "pf-m-resize-observer",
17
- "fullHeight": "pf-m-full-height",
18
- "horizontal": "pf-m-horizontal",
19
12
  "displayStack": "pf-m-display-stack",
20
13
  "displayInline": "pf-m-display-inline",
21
14
  "insetNone": "pf-m-inset-none",
@@ -26,49 +19,14 @@ export default {
26
19
  "inset_2xl": "pf-m-inset-2xl",
27
20
  "displayStackOnSm": "pf-m-display-stack-on-sm",
28
21
  "displayInlineOnSm": "pf-m-display-inline-on-sm",
29
- "insetNoneOnSm": "pf-m-inset-none-on-sm",
30
- "insetSmOnSm": "pf-m-inset-sm-on-sm",
31
- "insetMdOnSm": "pf-m-inset-md-on-sm",
32
- "insetLgOnSm": "pf-m-inset-lg-on-sm",
33
- "insetXlOnSm": "pf-m-inset-xl-on-sm",
34
- "inset_2xlOnSm": "pf-m-inset-2xl-on-sm",
35
22
  "displayStackOnMd": "pf-m-display-stack-on-md",
36
23
  "displayInlineOnMd": "pf-m-display-inline-on-md",
37
- "insetNoneOnMd": "pf-m-inset-none-on-md",
38
- "insetSmOnMd": "pf-m-inset-sm-on-md",
39
- "insetMdOnMd": "pf-m-inset-md-on-md",
40
- "insetLgOnMd": "pf-m-inset-lg-on-md",
41
- "insetXlOnMd": "pf-m-inset-xl-on-md",
42
- "inset_2xlOnMd": "pf-m-inset-2xl-on-md",
43
24
  "displayStackOnLg": "pf-m-display-stack-on-lg",
44
25
  "displayInlineOnLg": "pf-m-display-inline-on-lg",
45
- "insetNoneOnLg": "pf-m-inset-none-on-lg",
46
- "insetSmOnLg": "pf-m-inset-sm-on-lg",
47
- "insetMdOnLg": "pf-m-inset-md-on-lg",
48
- "insetLgOnLg": "pf-m-inset-lg-on-lg",
49
- "insetXlOnLg": "pf-m-inset-xl-on-lg",
50
- "inset_2xlOnLg": "pf-m-inset-2xl-on-lg",
51
26
  "displayStackOnXl": "pf-m-display-stack-on-xl",
52
27
  "displayInlineOnXl": "pf-m-display-inline-on-xl",
53
- "insetNoneOnXl": "pf-m-inset-none-on-xl",
54
- "insetSmOnXl": "pf-m-inset-sm-on-xl",
55
- "insetMdOnXl": "pf-m-inset-md-on-xl",
56
- "insetLgOnXl": "pf-m-inset-lg-on-xl",
57
- "insetXlOnXl": "pf-m-inset-xl-on-xl",
58
- "inset_2xlOnXl": "pf-m-inset-2xl-on-xl",
59
28
  "displayStackOn_2xl": "pf-m-display-stack-on-2xl",
60
- "displayInlineOn_2xl": "pf-m-display-inline-on-2xl",
61
- "insetNoneOn_2xl": "pf-m-inset-none-on-2xl",
62
- "insetSmOn_2xl": "pf-m-inset-sm-on-2xl",
63
- "insetMdOn_2xl": "pf-m-inset-md-on-2xl",
64
- "insetLgOn_2xl": "pf-m-inset-lg-on-2xl",
65
- "insetXlOn_2xl": "pf-m-inset-xl-on-2xl",
66
- "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl"
29
+ "displayInlineOn_2xl": "pf-m-display-inline-on-2xl"
67
30
  },
68
- "nav": "pf-v5-c-nav",
69
- "page": "pf-v5-c-page",
70
- "themeDark": "pf-v5-theme-dark",
71
- "toolbar": "pf-v5-c-toolbar",
72
- "toolbarContentSection": "pf-v5-c-toolbar__content-section",
73
31
  "toolbarExpandableContent": "pf-v5-c-toolbar__expandable-content"
74
32
  };
@@ -1,36 +1,40 @@
1
1
  .pf-v5-c-menu-toggle {
2
- --pf-v5-c-menu-toggle--BorderRadius: 0;
3
- --pf-v5-c-menu-toggle--PaddingTop: var(--pf-v5-global--spacer--form-element);
4
- --pf-v5-c-menu-toggle--PaddingRight: var(--pf-v5-global--spacer--sm);
5
- --pf-v5-c-menu-toggle--PaddingBottom: var(--pf-v5-global--spacer--form-element);
6
- --pf-v5-c-menu-toggle--PaddingLeft: var(--pf-v5-global--spacer--sm);
7
- --pf-v5-c-menu-toggle--FontSize: var(--pf-v5-global--FontSize--md);
8
- --pf-v5-c-menu-toggle--Color: var(--pf-v5-global--Color--100);
9
- --pf-v5-c-menu-toggle--LineHeight: var(--pf-v5-global--LineHeight--md);
10
- --pf-v5-c-menu-toggle--BackgroundColor: transparent;
11
- --pf-v5-c-menu-toggle--before--BorderTopWidth: var(--pf-v5-global--BorderWidth--sm);
12
- --pf-v5-c-menu-toggle--before--BorderRightWidth: var(--pf-v5-global--BorderWidth--sm);
13
- --pf-v5-c-menu-toggle--before--BorderBottomWidth: 0;
14
- --pf-v5-c-menu-toggle--before--BorderLeftWidth: var(--pf-v5-global--BorderWidth--sm);
15
- --pf-v5-c-menu-toggle--before--BorderTopColor: var(--pf-v5-global--BorderColor--300);
16
- --pf-v5-c-menu-toggle--before--BorderRightColor: var(--pf-v5-global--BorderColor--300);
17
- --pf-v5-c-menu-toggle--before--BorderBottomColor: transparent;
18
- --pf-v5-c-menu-toggle--before--BorderLeftColor: var(--pf-v5-global--BorderColor--300);
19
- --pf-v5-c-menu-toggle--after--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
20
- --pf-v5-c-menu-toggle--after--BorderBottomColor: var(--pf-v5-global--BorderColor--200);
2
+ --pf-v5-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
3
+ --pf-v5-c-menu-toggle--PaddingTop: var(--pf-t--global--spacer--sm);
4
+ --pf-v5-c-menu-toggle--PaddingRight: var(--pf-t--global--spacer--sm);
5
+ --pf-v5-c-menu-toggle--PaddingBottom: var(--pf-t--global--spacer--sm);
6
+ --pf-v5-c-menu-toggle--PaddingLeft: var(--pf-t--global--spacer--sm);
7
+ --pf-v5-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
8
+ --pf-v5-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
9
+ --pf-v5-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
10
+ --pf-v5-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
11
+ --pf-v5-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
12
+ --pf-v5-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
13
+ --pf-v5-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
14
+ --pf-v5-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
15
+ --pf-v5-c-menu-toggle--active--BorderWidth: var(--pf-t--global--border--width--control--active);
16
+ --pf-v5-c-menu-toggle--active--BorderColor: var(--pf-t--global--border--color--active);
17
+ --pf-v5-c-menu-toggle--before--BorderTopWidth: var(--pf-t--global--border--width--control--default);
18
+ --pf-v5-c-menu-toggle--before--BorderRightWidth: var(--pf-t--global--border--width--control--default);
19
+ --pf-v5-c-menu-toggle--before--BorderBottomWidth: var(--pf-t--global--border--width--control--default);
20
+ --pf-v5-c-menu-toggle--before--BorderLeftWidth: var(--pf-t--global--border--width--control--default);
21
+ --pf-v5-c-menu-toggle--before--BorderTopColor: var(--pf-t--global--border--color--default);
22
+ --pf-v5-c-menu-toggle--before--BorderRightColor: var(--pf-t--global--border--color--default);
23
+ --pf-v5-c-menu-toggle--before--BorderBottomColor: var(--pf-t--global--border--color--default);
24
+ --pf-v5-c-menu-toggle--before--BorderLeftColor: var(--pf-t--global--border--color--default);
21
25
  --pf-v5-c-menu-toggle--hover--BackgroundColor: transparent;
22
- --pf-v5-c-menu-toggle--hover--after--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
23
- --pf-v5-c-menu-toggle--hover--after--BorderBottomColor: var(--pf-v5-global--active-color--100);
26
+ --pf-v5-c-menu-toggle--hover--after--BorderBottomWidth: var(--pf-t--global--border--width--control--hover);
27
+ --pf-v5-c-menu-toggle--hover--after--BorderBottomColor: var(--pf-t--global--border--color--hover);
24
28
  --pf-v5-c-menu-toggle--focus--BackgroundColor: transparent;
25
- --pf-v5-c-menu-toggle--focus--after--BorderBottomWidth: var(--pf-v5-global--BorderWidth--md);
26
- --pf-v5-c-menu-toggle--focus--after--BorderBottomColor: var(--pf-v5-global--active-color--100);
29
+ --pf-v5-c-menu-toggle--focus--after--BorderBottomWidth: var(--pf-t--global--border--width--control--active);
30
+ --pf-v5-c-menu-toggle--focus--after--BorderBottomColor: var(--pf-t--global--border--color--active);
27
31
  --pf-v5-c-menu-toggle--active--BackgroundColor: transparent;
28
- --pf-v5-c-menu-toggle--active--after--BorderBottomWidth: var(--pf-v5-global--BorderWidth--md);
29
- --pf-v5-c-menu-toggle--active--after--BorderBottomColor: var(--pf-v5-global--active-color--100);
32
+ --pf-v5-c-menu-toggle--active--after--BorderBottomWidth: var(--pf-t--global--border--width--control--active);
33
+ --pf-v5-c-menu-toggle--active--after--BorderBottomColor: var(--pf-t--global--border--color--active);
30
34
  --pf-v5-c-menu-toggle--m-expanded--Color: var(--pf-v5-global--Color--100);
31
35
  --pf-v5-c-menu-toggle--m-expanded--BackgroundColor: transparent;
32
- --pf-v5-c-menu-toggle--m-expanded--after--BorderBottomWidth: var(--pf-v5-global--BorderWidth--md);
33
- --pf-v5-c-menu-toggle--m-expanded--after--BorderBottomColor: var(--pf-v5-global--active-color--100);
36
+ --pf-v5-c-menu-toggle--m-expanded--after--BorderBottomWidth: var(--pf-t--global--border--width--control--active);
37
+ --pf-v5-c-menu-toggle--m-expanded--after--BorderBottomColor: var(--pf-t--global--border--color--active);
34
38
  --pf-v5-c-menu-toggle--disabled--Color: var(--pf-v5-global--disabled-color--100);
35
39
  --pf-v5-c-menu-toggle--disabled--BackgroundColor: var(--pf-v5-global--disabled-color--300);
36
40
  --pf-v5-c-menu-toggle--m-primary--Color: var(--pf-v5-global--Color--light-100);
@@ -63,20 +67,19 @@
63
67
  --pf-v5-c-menu-toggle--m-plain--active--Color: var(--pf-v5-global--Color--100);
64
68
  --pf-v5-c-menu-toggle--m-plain--disabled--Color: var(--pf-v5-global--disabled-color--200);
65
69
  --pf-v5-c-menu-toggle--m-plain--m-expanded--Color: var(--pf-v5-global--Color--100);
66
- --pf-v5-c-menu-toggle__icon--MarginRight: var(--pf-v5-global--spacer--sm);
67
- --pf-v5-c-menu-toggle__count--MarginLeft: var(--pf-v5-global--spacer--sm);
68
- --pf-v5-c-menu-toggle__controls--PaddingLeft: var(--pf-v5-global--spacer--md);
70
+ --pf-v5-c-menu-toggle__icon--MarginRight: var(--pf-t--global--spacer--sm);
71
+ --pf-v5-c-menu-toggle__count--MarginLeft: var(--pf-t--global--spacer--sm);
72
+ --pf-v5-c-menu-toggle__controls--PaddingLeft: var(--pf-t--global--spacer--sm);
69
73
  --pf-v5-c-menu-toggle__controls--MarginLeft: auto;
70
74
  --pf-v5-c-menu-toggle__controls--MarginRight: 0;
71
- --pf-v5-c-menu-toggle__toggle-icon--MarginRight: var(--pf-v5-global--spacer--sm);
72
- --pf-v5-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-v5-global--Color--200);
75
+ --pf-v5-c-menu-toggle__toggle-icon--MarginRight: var(--pf-t--global--spacer--sm);
76
+ --pf-v5-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
73
77
  --pf-v5-c-menu-toggle--m-plain--hover__toggle-icon--Color: var(--pf-v5-global--Color--100);
74
78
  --pf-v5-c-menu-toggle--m-plain--active__toggle-icon--Color: var(--pf-v5-global--Color--100);
75
79
  --pf-v5-c-menu-toggle--m-plain--focus__toggle-icon--Color: var(--pf-v5-global--Color--100);
76
80
  --pf-v5-c-menu-toggle--m-plain--m-expanded__toggle-icon--Color: var(--pf-v5-global--Color--100);
77
81
  --pf-v5-c-menu-toggle--m-full-height--PaddingRight: var(--pf-v5-global--spacer--lg);
78
82
  --pf-v5-c-menu-toggle--m-full-height--PaddingLeft: var(--pf-v5-global--spacer--lg);
79
- --pf-v5-c-menu-toggle--m-full-height__toggle--before--BorderTopWidth: 0;
80
83
  --pf-v5-c-menu-toggle--m-full-height__toggle--after--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
81
84
  --pf-v5-c-menu-toggle--m-full-height--m-expanded--after--BorderBottomWidth: var(--pf-v5-global--BorderWidth--xl);
82
85
  --pf-v5-c-menu-toggle--m-full-height--hover--after--BorderBottomWidth: var(--pf-v5-global--BorderWidth--xl);
@@ -86,7 +89,7 @@
86
89
  --pf-v5-c-menu-toggle--m-split-button--child--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
87
90
  --pf-v5-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-v5-global--disabled-color--100);
88
91
  --pf-v5-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-v5-global--disabled-color--300);
89
- --pf-v5-c-menu-toggle--m-split-button--first-child--PaddingRight: var(--pf-v5-global--spacer--sm);
92
+ --pf-v5-c-menu-toggle--m-split-button--first-child--PaddingRight: var(--pf-t--global--spacer--sm);
90
93
  --pf-v5-c-menu-toggle--m-split-button--last-child--PaddingLeft: 0;
91
94
  --pf-v5-c-menu-toggle--m-split-button--m-action--child--BorderLeftWidth: var(--pf-v5-global--BorderWidth--sm);
92
95
  --pf-v5-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-v5-global--BorderColor--300);
@@ -109,13 +112,13 @@
109
112
  --pf-v5-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor: var(--pf-v5-global--primary-color--100);
110
113
  --pf-v5-c-menu-toggle__button--BackgroundColor: transparent;
111
114
  --pf-v5-c-menu-toggle__button--AlignSelf: baseline;
112
- --pf-v5-c-menu-toggle__button--PaddingLeft: var(--pf-v5-global--spacer--sm);
113
- --pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-v5-global--spacer--sm);
114
- --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-global--spacer--sm);
115
- --pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
116
- --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-v5-global--spacer--sm);
117
- --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
118
- --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
115
+ --pf-v5-c-menu-toggle__button--PaddingLeft: var(--pf-t--global--spacer--sm);
116
+ --pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-t--global--spacer--sm);
117
+ --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-t--global--spacer--sm);
118
+ --pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-t--global--spacer--sm);
119
+ --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-t--global--spacer--sm);
120
+ --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-t--global--spacer--sm);
121
+ --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
119
122
  --pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf: center;
120
123
  position: relative;
121
124
  display: inline-flex;
@@ -131,9 +134,11 @@
131
134
  cursor: pointer;
132
135
  background-color: var(--pf-v5-c-menu-toggle--BackgroundColor);
133
136
  border: 0;
137
+ }
138
+ .pf-v5-c-menu-toggle, .pf-v5-c-menu-toggle::before {
134
139
  border-radius: var(--pf-v5-c-menu-toggle--BorderRadius);
135
140
  }
136
- .pf-v5-c-menu-toggle::before, .pf-v5-c-menu-toggle::after {
141
+ .pf-v5-c-menu-toggle::before {
137
142
  position: absolute;
138
143
  inset-block-start: 0;
139
144
  inset-block-end: 0;
@@ -141,20 +146,10 @@
141
146
  inset-inline-end: 0;
142
147
  pointer-events: none;
143
148
  content: "";
144
- }
145
- .pf-v5-c-menu-toggle::before {
146
- border-style: solid;
147
- border-block-start-color: var(--pf-v5-c-menu-toggle--before--BorderTopColor);
148
- border-block-start-width: var(--pf-v5-c-menu-toggle--before--BorderTopWidth);
149
- border-block-end-color: var(--pf-v5-c-menu-toggle--before--BorderBottomColor);
150
- border-block-end-width: var(--pf-v5-c-menu-toggle--before--BorderBottomWidth);
151
- border-inline-start-color: var(--pf-v5-c-menu-toggle--before--BorderLeftColor);
152
- border-inline-start-width: var(--pf-v5-c-menu-toggle--before--BorderLeftWidth);
153
- border-inline-end-color: var(--pf-v5-c-menu-toggle--before--BorderRightColor);
154
- border-inline-end-width: var(--pf-v5-c-menu-toggle--before--BorderRightWidth);
149
+ border: var(--pf-v5-c-menu-toggle--BorderWidth) solid var(--pf-v5-c-menu-toggle--BorderColor);
155
150
  }
156
151
  .pf-v5-c-menu-toggle::after {
157
- border-block-end: var(--pf-v5-c-menu-toggle--after--BorderBottomWidth) solid var(--pf-v5-c-menu-toggle--after--BorderBottomColor);
152
+ border-block-end: var(--pf-v5-c-menu-toggle--after--BorderWidth) solid var(--pf-v5-c-menu-toggle--after--BorderColor);
158
153
  }
159
154
  .pf-v5-c-menu-toggle.pf-m-primary {
160
155
  --pf-v5-c-menu-toggle--BorderRadius: var(--pf-v5-c-menu-toggle--m-primary--BorderRadius);
@@ -199,15 +194,11 @@
199
194
  --pf-v5-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-v5-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderColor);
200
195
  --pf-v5-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-v5-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderWidth);
201
196
  }
202
- .pf-v5-c-menu-toggle.pf-m-plain {
203
- --pf-v5-c-menu-toggle__toggle-icon--Color: var(--pf-v5-c-menu-toggle--m-plain__toggle-icon--Color);
204
- }
205
197
  .pf-v5-c-menu-toggle.pf-m-plain:not(.pf-m-text) {
206
198
  --pf-v5-c-menu-toggle--PaddingRight: var(--pf-v5-c-menu-toggle--m-plain--PaddingRight);
207
199
  --pf-v5-c-menu-toggle--PaddingLeft: var(--pf-v5-c-menu-toggle--m-plain--PaddingLeft);
208
200
  --pf-v5-c-menu-toggle--disabled--BackgroundColor: transparent;
209
201
  display: inline-block;
210
- color: var(--pf-v5-c-menu-toggle--m-plain--Color);
211
202
  }
212
203
  .pf-v5-c-menu-toggle.pf-m-full-height {
213
204
  --pf-v5-c-menu-toggle--PaddingRight: var(--pf-v5-c-menu-toggle--m-full-height--PaddingRight);
@@ -222,25 +213,12 @@
222
213
  height: 100%;
223
214
  }
224
215
  .pf-v5-c-menu-toggle:hover {
225
- --pf-v5-c-menu-toggle--BackgroundColor: var(--pf-v5-c-menu-toggle--hover--BackgroundColor);
226
- --pf-v5-c-menu-toggle--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--hover--after--BorderBottomWidth);
227
- --pf-v5-c-menu-toggle--after--BorderBottomColor: var(--pf-v5-c-menu-toggle--hover--after--BorderBottomColor);
228
- --pf-v5-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-v5-c-menu-toggle--m-plain--hover__toggle-icon--Color);
229
- --pf-v5-c-menu-toggle--m-plain--Color: var(--pf-v5-c-menu-toggle--m-plain--hover--Color);
230
- }
231
- .pf-v5-c-menu-toggle:focus, .pf-v5-c-menu-toggle:focus-within {
232
- --pf-v5-c-menu-toggle--BackgroundColor: var(--pf-v5-c-menu-toggle--focus--BackgroundColor);
233
- --pf-v5-c-menu-toggle--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--focus--after--BorderBottomWidth);
234
- --pf-v5-c-menu-toggle--after--BorderBottomColor: var(--pf-v5-c-menu-toggle--focus--after--BorderBottomColor);
235
- --pf-v5-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-v5-c-menu-toggle--m-plain--focus__toggle-icon--Color);
236
- --pf-v5-c-menu-toggle--m-plain--Color: var(--pf-v5-c-menu-toggle--m-plain--focus--Color);
237
- }
238
- .pf-v5-c-menu-toggle:active {
239
- --pf-v5-c-menu-toggle--BackgroundColor: var(--pf-v5-c-menu-toggle--active--BackgroundColor);
240
- --pf-v5-c-menu-toggle--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--active--after--BorderBottomWidth);
241
- --pf-v5-c-menu-toggle--after--BorderBottomColor: var(--pf-v5-c-menu-toggle--active--after--BorderBottomColor);
242
- --pf-v5-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-v5-c-menu-toggle--m-plain--active__toggle-icon--Color);
243
- --pf-v5-c-menu-toggle--m-plain--Color: var(--pf-v5-c-menu-toggle--m-plain--active--Color);
216
+ --pf-v5-c-menu-toggle--BorderColor: var(--pf-v5-c-menu-toggle--hover--BorderColor);
217
+ --pf-v5-c-menu-toggle--BorderWidth: var(--pf-v5-c-menu-toggle--hover--BorderWidth);
218
+ }
219
+ .pf-v5-c-menu-toggle:focus, .pf-v5-c-menu-toggle:active {
220
+ --pf-v5-c-menu-toggle--BorderColor: var(--pf-v5-c-menu-toggle--active--BorderColor);
221
+ --pf-v5-c-menu-toggle--BorderWidth: var(--pf-v5-c-menu-toggle--active--BorderWidth);
244
222
  }
245
223
  .pf-v5-c-menu-toggle.pf-m-expanded {
246
224
  --pf-v5-c-menu-toggle--Color: var(--pf-v5-c-menu-toggle--m-expanded--Color);
@@ -256,7 +234,7 @@
256
234
  --pf-v5-c-menu-toggle--m-plain--Color: var(--pf-v5-c-menu-toggle--m-plain--disabled--Color);
257
235
  pointer-events: none;
258
236
  }
259
- .pf-v5-c-menu-toggle.pf-m-primary::before, .pf-v5-c-menu-toggle.pf-m-primary::after, .pf-v5-c-menu-toggle.pf-m-plain::before, .pf-v5-c-menu-toggle.pf-m-plain::after, .pf-v5-c-menu-toggle:disabled::before, .pf-v5-c-menu-toggle:disabled::after {
237
+ .pf-v5-c-menu-toggle.pf-m-primary::before, .pf-v5-c-menu-toggle.pf-m-primary::after, .pf-v5-c-menu-toggle:disabled::before, .pf-v5-c-menu-toggle:disabled::after {
260
238
  border: 0;
261
239
  }
262
240
  .pf-v5-c-menu-toggle.pf-m-typeahead {
@@ -1,48 +1,59 @@
1
- .pf-v5-c-modal-box {
2
- --pf-v5-c-modal-box--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
3
- --pf-v5-c-modal-box--BoxShadow: var(--pf-v5-global--BoxShadow--xl);
1
+ :root {
2
+ --pf-v5-c-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
3
+ --pf-v5-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--large);
4
+ --pf-v5-c-modal-box--BoxShadow: var(--pf-t--global--box-shadow--lg);
4
5
  --pf-v5-c-modal-box--ZIndex: var(--pf-v5-global--ZIndex--xl);
5
6
  --pf-v5-c-modal-box--Width: 100%;
6
- --pf-v5-c-modal-box--MaxWidth: calc(100% - var(--pf-v5-global--spacer--xl));
7
+ --pf-v5-c-modal-box--MaxWidth: calc(100% - var(--pf-t--global--spacer--xl));
7
8
  --pf-v5-c-modal-box--m-sm--sm--MaxWidth: 35rem;
8
9
  --pf-v5-c-modal-box--m-md--Width: 52.5rem;
9
10
  --pf-v5-c-modal-box--m-lg--lg--MaxWidth: 70rem;
10
- --pf-v5-c-modal-box--MaxHeight: calc(100% - var(--pf-v5-global--spacer--2xl));
11
- --pf-v5-c-modal-box--m-align-top--spacer: var(--pf-v5-global--spacer--sm);
12
- --pf-v5-c-modal-box--m-align-top--xl--spacer: var(--pf-v5-global--spacer--xl);
13
- --pf-v5-c-modal-box--m-align-top--MarginTop: var(--pf-v5-c-modal-box--m-align-top--spacer);
14
- --pf-v5-c-modal-box--m-align-top--MaxHeight: calc(100% - min(var(--pf-v5-c-modal-box--m-align-top--spacer), var(--pf-v5-global--spacer--2xl)) - var(--pf-v5-c-modal-box--m-align-top--spacer));
15
- --pf-v5-c-modal-box--m-align-top--MaxWidth: calc(100% - min(var(--pf-v5-c-modal-box--m-align-top--spacer) * 2, var(--pf-v5-global--spacer--xl)));
16
- --pf-v5-c-modal-box--m-danger__title-icon--Color: var(--pf-v5-global--danger-color--100);
17
- --pf-v5-c-modal-box--m-warning__title-icon--Color: var(--pf-v5-global--warning-color--100);
18
- --pf-v5-c-modal-box--m-success__title-icon--Color: var(--pf-v5-global--success-color--100);
19
- --pf-v5-c-modal-box--m-info__title-icon--Color: var(--pf-v5-global--info-color--100);
20
- --pf-v5-c-modal-box--m-custom__title-icon--Color: var(--pf-v5-global--custom-color--200);
21
- --pf-v5-c-modal-box__header--PaddingTop: var(--pf-v5-global--spacer--lg);
22
- --pf-v5-c-modal-box__header--PaddingRight: var(--pf-v5-global--spacer--lg);
23
- --pf-v5-c-modal-box__header--PaddingLeft: var(--pf-v5-global--spacer--lg);
24
- --pf-v5-c-modal-box__header--last-child--PaddingBottom: var(--pf-v5-global--spacer--lg);
25
- --pf-v5-c-modal-box__title--LineHeight: var(--pf-v5-global--LineHeight--sm);
26
- --pf-v5-c-modal-box__title--FontFamily: var(--pf-v5-global--FontFamily--heading);
27
- --pf-v5-c-modal-box__title--FontSize: var(--pf-v5-global--FontSize--2xl);
28
- --pf-v5-c-modal-box__title-icon--MarginRight: var(--pf-v5-global--spacer--sm);
29
- --pf-v5-c-modal-box__title-icon--Color: var(--pf-v5-global--Color--100);
30
- --pf-v5-c-modal-box__description--PaddingTop: var(--pf-v5-global--spacer--xs);
31
- --pf-v5-c-modal-box__body--MinHeight: calc(var(--pf-v5-global--FontSize--md) * var(--pf-v5-global--LineHeight--md));
32
- --pf-v5-c-modal-box__body--PaddingTop: var(--pf-v5-global--spacer--lg);
33
- --pf-v5-c-modal-box__body--PaddingRight: var(--pf-v5-global--spacer--lg);
34
- --pf-v5-c-modal-box__body--PaddingLeft: var(--pf-v5-global--spacer--lg);
35
- --pf-v5-c-modal-box__body--last-child--PaddingBottom: var(--pf-v5-global--spacer--lg);
36
- --pf-v5-c-modal-box__header--body--PaddingTop: var(--pf-v5-global--spacer--md);
37
- --pf-v5-c-modal-box__close--Top: calc(var(--pf-v5-global--spacer--lg));
38
- --pf-v5-c-modal-box__close--Right: var(--pf-v5-global--spacer--md);
39
- --pf-v5-c-modal-box__close--sibling--MarginRight: calc(var(--pf-v5-global--spacer--xl) + var(--pf-v5-global--spacer--sm));
40
- --pf-v5-c-modal-box__footer--PaddingTop: var(--pf-v5-global--spacer--lg);
41
- --pf-v5-c-modal-box__footer--PaddingRight: var(--pf-v5-global--spacer--lg);
42
- --pf-v5-c-modal-box__footer--PaddingBottom: var(--pf-v5-global--spacer--lg);
43
- --pf-v5-c-modal-box__footer--PaddingLeft: var(--pf-v5-global--spacer--lg);
44
- --pf-v5-c-modal-box__footer--c-button--MarginRight: var(--pf-v5-global--spacer--md);
11
+ --pf-v5-c-modal-box--MaxHeight: calc(100% - var(--pf-t--global--spacer--2xl));
12
+ --pf-v5-c-modal-box--m-align-top--spacer: var(--pf-t--global--spacer--sm);
13
+ --pf-v5-c-modal-box--m-align-top--xl--spacer: var(--pf-t--global--spacer--xl);
14
+ --pf-v5-c-modal-box--m-align-top--Top: var(--pf-v5-c-modal-box--m-align-top--spacer);
15
+ --pf-v5-c-modal-box--m-align-top--MaxHeight: calc(100% - min(var(--pf-v5-c-modal-box--m-align-top--spacer), var(--pf-t--global--spacer--2xl)) - var(--pf-v5-c-modal-box--m-align-top--spacer));
16
+ --pf-v5-c-modal-box--m-align-top--MaxWidth: calc(100% - min(var(--pf-v5-c-modal-box--m-align-top--spacer) * 2, var(--pf-t--global--spacer--xl)));
17
+ --pf-v5-c-modal-box--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
18
+ --pf-v5-c-modal-box--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
19
+ --pf-v5-c-modal-box--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
20
+ --pf-v5-c-modal-box--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
21
+ --pf-v5-c-modal-box--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
22
+ --pf-v5-c-modal-box__header--PaddingTop: var(--pf-t--global--spacer--lg);
23
+ --pf-v5-c-modal-box__header--PaddingRight: var(--pf-t--global--spacer--lg);
24
+ --pf-v5-c-modal-box__header--PaddingLeft: var(--pf-t--global--spacer--lg);
25
+ --pf-v5-c-modal-box__header--Gap: var(--pf-t--global--spacer--md);
26
+ --pf-v5-c-modal-box__header-main--Gap: var(--pf-t--global--spacer--md);
27
+ --pf-v5-c-modal-box__title--LineHeight: var(--pf-t--global--font--line-height--heading);
28
+ --pf-v5-c-modal-box__title--FontFamily: var(--pf-t--global--font--family--heading);
29
+ --pf-v5-c-modal-box__title--FontSize: var(--pf-t--global--font--size--heading--md);
30
+ --pf-v5-c-modal-box__title-icon--MarginRight: var(--pf-t--global--spacer--sm);
31
+ --pf-v5-c-modal-box__title-icon--Color: var(--pf-t--global--icon--color--regular);
32
+ --pf-v5-c-modal-box__description--FontSize: var(--pf-t--global--font--size--body--sm);
33
+ --pf-v5-c-modal-box__description--Color: var(--pf-t--global--text--color--subtle);
34
+ --pf-v5-c-modal-box__body--MinHeight: calc(var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body));
35
+ --pf-v5-c-modal-box__body--PaddingTop: var(--pf-t--global--spacer--lg);
36
+ --pf-v5-c-modal-box__body--PaddingRight: var(--pf-t--global--spacer--lg);
37
+ --pf-v5-c-modal-box__body--PaddingLeft: var(--pf-t--global--spacer--lg);
38
+ --pf-v5-c-modal-box__body--last-child--PaddingBottom: var(--pf-t--global--spacer--lg);
39
+ --pf-v5-c-modal-box__header--body--PaddingTop: var(--pf-t--global--spacer--md);
40
+ --pf-v5-c-modal-box__close--Top: var(--pf-v5-c-modal-box__header--PaddingTop);
41
+ --pf-v5-c-modal-box__close--Right: var(--pf-v5-c-modal-box__header--PaddingRight);
42
+ --pf-v5-c-modal-box__close--sibling--MarginRight: calc(var(--pf-t--global--spacer--xl) + var(--pf-t--global--spacer--sm));
43
+ --pf-v5-c-modal-box__footer--PaddingTop: var(--pf-t--global--spacer--lg);
44
+ --pf-v5-c-modal-box__footer--PaddingRight: var(--pf-t--global--spacer--lg);
45
+ --pf-v5-c-modal-box__footer--PaddingBottom: var(--pf-t--global--spacer--lg);
46
+ --pf-v5-c-modal-box__footer--PaddingLeft: var(--pf-t--global--spacer--lg);
47
+ --pf-v5-c-modal-box__footer--c-button--MarginRight: var(--pf-t--global--spacer--md);
45
48
  --pf-v5-c-modal-box__footer--c-button--sm--MarginRight: calc(var(--pf-v5-c-modal-box__footer--c-button--MarginRight) / 2);
49
+ }
50
+ @media (min-width: 1200px) {
51
+ :root {
52
+ --pf-v5-c-modal-box--m-align-top--spacer: var(--pf-v5-c-modal-box--m-align-top--xl--spacer);
53
+ }
54
+ }
55
+
56
+ .pf-v5-c-modal-box {
46
57
  position: relative;
47
58
  z-index: var(--pf-v5-c-modal-box--ZIndex);
48
59
  display: flex;
@@ -50,14 +61,11 @@
50
61
  width: var(--pf-v5-c-modal-box--Width);
51
62
  max-width: var(--pf-v5-c-modal-box--MaxWidth);
52
63
  max-height: var(--pf-v5-c-modal-box--MaxHeight);
64
+ overflow: auto;
53
65
  background-color: var(--pf-v5-c-modal-box--BackgroundColor);
66
+ border-radius: var(--pf-v5-c-modal-box--BorderRadius);
54
67
  box-shadow: var(--pf-v5-c-modal-box--BoxShadow);
55
68
  }
56
- @media (min-width: 1200px) {
57
- .pf-v5-c-modal-box {
58
- --pf-v5-c-modal-box--m-align-top--spacer: var(--pf-v5-c-modal-box--m-align-top--xl--spacer);
59
- }
60
- }
61
69
  .pf-v5-c-modal-box.pf-m-sm {
62
70
  --pf-v5-c-modal-box--Width: var(--pf-v5-c-modal-box--m-sm--sm--MaxWidth);
63
71
  }
@@ -68,7 +76,7 @@
68
76
  --pf-v5-c-modal-box--Width: var(--pf-v5-c-modal-box--m-lg--lg--MaxWidth);
69
77
  }
70
78
  .pf-v5-c-modal-box.pf-m-align-top {
71
- inset-block-start: var(--pf-v5-c-modal-box--m-align-top--MarginTop);
79
+ inset-block-start: var(--pf-v5-c-modal-box--m-align-top--Top);
72
80
  align-self: flex-start;
73
81
  max-width: var(--pf-v5-c-modal-box--m-align-top--MaxWidth);
74
82
  max-height: var(--pf-v5-c-modal-box--m-align-top--MaxHeight);
@@ -102,6 +110,7 @@
102
110
  display: flex;
103
111
  flex-direction: column;
104
112
  flex-shrink: 0;
113
+ gap: var(--pf-v5-c-modal-box__header--Gap);
105
114
  padding-block-start: var(--pf-v5-c-modal-box__header--PaddingTop);
106
115
  padding-inline-start: var(--pf-v5-c-modal-box__header--PaddingLeft);
107
116
  padding-inline-end: var(--pf-v5-c-modal-box__header--PaddingRight);
@@ -110,15 +119,15 @@
110
119
  display: flex;
111
120
  flex-direction: row;
112
121
  }
113
- .pf-v5-c-modal-box__header:last-child {
114
- padding-block-end: var(--pf-v5-c-modal-box__header--last-child--PaddingBottom);
115
- }
116
122
  .pf-v5-c-modal-box__header + .pf-v5-c-modal-box__body {
117
123
  --pf-v5-c-modal-box__body--PaddingTop: var(--pf-v5-c-modal-box__header--body--PaddingTop);
118
124
  }
119
125
 
120
126
  .pf-v5-c-modal-box__header-main {
127
+ display: flex;
128
+ flex-direction: column;
121
129
  flex-grow: 1;
130
+ gap: var(--pf-v5-c-modal-box__header-main--Gap);
122
131
  min-width: 0;
123
132
  }
124
133
 
@@ -146,6 +155,8 @@
146
155
 
147
156
  .pf-v5-c-modal-box__description {
148
157
  padding-block-start: var(--pf-v5-c-modal-box__description--PaddingTop);
158
+ font-size: var(--pf-v5-c-modal-box__description--FontSize);
159
+ color: var(--pf-v5-c-modal-box__description--Color);
149
160
  }
150
161
 
151
162
  .pf-v5-c-modal-box__body {
@@ -180,8 +191,4 @@
180
191
  .pf-v5-c-modal-box__footer > .pf-v5-c-button:not(:last-child) {
181
192
  --pf-v5-c-modal-box__footer--c-button--MarginRight: var(--pf-v5-c-modal-box__footer--c-button--sm--MarginRight);
182
193
  }
183
- }
184
-
185
- :where(.pf-v5-theme-dark) .pf-v5-c-modal-box {
186
- --pf-v5-c-modal-box--BackgroundColor: var(--pf-v5-global--BackgroundColor--300);
187
194
  }
@@ -23,7 +23,6 @@ declare const _default: {
23
23
  "info": "pf-m-info",
24
24
  "help": "pf-m-help",
25
25
  "icon": "pf-m-icon"
26
- },
27
- "themeDark": "pf-v5-theme-dark"
26
+ }
28
27
  };
29
28
  export default _default;
@@ -25,6 +25,5 @@ exports.default = {
25
25
  "info": "pf-m-info",
26
26
  "help": "pf-m-help",
27
27
  "icon": "pf-m-icon"
28
- },
29
- "themeDark": "pf-v5-theme-dark"
28
+ }
30
29
  };