@patternfly/react-styles 6.0.0-alpha.30 → 6.0.0-alpha.32

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 (96) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/css/components/AboutModalBox/about-modal-box.css +11 -11
  3. package/css/components/Accordion/accordion.css +2 -0
  4. package/css/components/Avatar/avatar.css +40 -40
  5. package/css/components/BackToTop/back-to-top.css +1 -1
  6. package/css/components/Banner/banner.css +1 -1
  7. package/css/components/Brand/brand.css +10 -10
  8. package/css/components/Breadcrumb/breadcrumb.css +9 -6
  9. package/css/components/Button/button.css +16 -7
  10. package/css/components/Card/card.css +1 -1
  11. package/css/components/Content/content.css +12 -9
  12. package/css/components/DataList/data-list-grid.css +19 -19
  13. package/css/components/DataList/data-list.css +37 -41
  14. package/css/components/DescriptionList/description-list-order.css +5 -5
  15. package/css/components/DescriptionList/description-list.css +26 -31
  16. package/css/components/Divider/divider.css +20 -20
  17. package/css/components/Drawer/drawer.css +12 -12
  18. package/css/components/Form/form.css +6 -6
  19. package/css/components/JumpLinks/jump-links.css +6 -6
  20. package/css/components/Label/label.css +18 -17
  21. package/css/components/Login/login.css +13 -13
  22. package/css/components/Masthead/masthead.css +201 -103
  23. package/css/components/Menu/menu.css +10 -10
  24. package/css/components/MenuToggle/menu-toggle.css +6 -0
  25. package/css/components/MenuToggle/menu-toggle.d.ts +2 -1
  26. package/css/components/MenuToggle/menu-toggle.js +2 -1
  27. package/css/components/MenuToggle/menu-toggle.mjs +2 -1
  28. package/css/components/ModalBox/modal-box.css +2 -2
  29. package/css/components/Nav/nav.css +5 -4
  30. package/css/components/Nav/nav.d.ts +1 -1
  31. package/css/components/Nav/nav.js +1 -1
  32. package/css/components/Nav/nav.mjs +1 -1
  33. package/css/components/Page/page.css +47 -166
  34. package/css/components/Page/page.d.ts +0 -2
  35. package/css/components/Page/page.js +0 -2
  36. package/css/components/Page/page.mjs +0 -2
  37. package/css/components/Pagination/pagination.css +8 -8
  38. package/css/components/ProgressStepper/progress-stepper.css +14 -13
  39. package/css/components/Sidebar/sidebar.css +8 -8
  40. package/css/components/SimpleList/simple-list.css +1 -1
  41. package/css/components/TabContent/tab-content.css +1 -1
  42. package/css/components/Table/table-grid.css +14 -20
  43. package/css/components/Table/table-tree-view.css +44 -54
  44. package/css/components/Table/table-tree-view.d.ts +1 -3
  45. package/css/components/Table/table-tree-view.js +1 -3
  46. package/css/components/Table/table-tree-view.mjs +1 -3
  47. package/css/components/Table/table.css +5 -5
  48. package/css/components/Tabs/tabs.css +11 -11
  49. package/css/components/Timestamp/timestamp.css +8 -17
  50. package/css/components/ToggleGroup/toggle-group.css +2 -2
  51. package/css/components/Toolbar/toolbar.css +30 -29
  52. package/css/components/Wizard/wizard.css +6 -6
  53. package/css/components/_index.css +664 -692
  54. package/css/components/_index.d.ts +2 -3
  55. package/css/components/_index.js +2 -3
  56. package/css/components/_index.mjs +2 -3
  57. package/css/layouts/Flex/flex.css +35 -35
  58. package/css/layouts/Gallery/gallery.css +10 -10
  59. package/css/layouts/Grid/grid.css +15 -15
  60. package/css/layouts/_index.css +60 -60
  61. package/css/utilities/Accessibility/accessibility.css +15 -15
  62. package/css/utilities/Alignment/alignment.css +5 -5
  63. package/css/utilities/BackgroundColor/background-color.css +5 -5
  64. package/css/utilities/Display/display.css +5 -5
  65. package/css/utilities/Flex/flex.css +50 -50
  66. package/css/utilities/Float/float.css +5 -5
  67. package/css/utilities/Sizing/sizing.css +30 -30
  68. package/css/utilities/Spacing/spacing.css +700 -700
  69. package/css/utilities/Text/text.css +20 -20
  70. package/css/utilities/_index.css +835 -835
  71. package/package.json +3 -3
  72. package/css/components/Consoles/AccessConsoles.css +0 -14
  73. package/css/components/Consoles/AccessConsoles.d.ts +0 -6
  74. package/css/components/Consoles/AccessConsoles.js +0 -7
  75. package/css/components/Consoles/AccessConsoles.mjs +0 -5
  76. package/css/components/Consoles/DesktopViewer.css +0 -6
  77. package/css/components/Consoles/DesktopViewer.d.ts +0 -5
  78. package/css/components/Consoles/DesktopViewer.js +0 -6
  79. package/css/components/Consoles/DesktopViewer.mjs +0 -4
  80. package/css/components/Consoles/SerialConsole.css +0 -11
  81. package/css/components/Consoles/SerialConsole.d.ts +0 -6
  82. package/css/components/Consoles/SerialConsole.js +0 -7
  83. package/css/components/Consoles/SerialConsole.mjs +0 -5
  84. package/css/components/Consoles/VncConsole.css +0 -10
  85. package/css/components/Consoles/VncConsole.d.ts +0 -6
  86. package/css/components/Consoles/VncConsole.js +0 -7
  87. package/css/components/Consoles/VncConsole.mjs +0 -5
  88. package/css/components/Consoles/xterm.css +0 -171
  89. package/css/components/Consoles/xterm.d.ts +0 -26
  90. package/css/components/Consoles/xterm.js +0 -27
  91. package/css/components/Consoles/xterm.mjs +0 -25
  92. package/src/css/components/Consoles/AccessConsoles.css +0 -14
  93. package/src/css/components/Consoles/DesktopViewer.css +0 -6
  94. package/src/css/components/Consoles/SerialConsole.css +0 -11
  95. package/src/css/components/Consoles/VncConsole.css +0 -10
  96. package/src/css/components/Consoles/xterm.css +0 -171
@@ -2,7 +2,6 @@ import './table-tree-view.css';
2
2
  export default {
3
3
  "button": "pf-v6-c-button",
4
4
  "dirRtl": "pf-v6-m-dir-rtl",
5
- "menuToggle": "pf-v6-c-menu-toggle",
6
5
  "modifiers": {
7
6
  "treeView": "pf-m-tree-view",
8
7
  "noInset": "pf-m-no-inset",
@@ -28,6 +27,5 @@ export default {
28
27
  "tableTreeViewIcon": "pf-v6-c-table__tree-view-icon",
29
28
  "tableTreeViewMain": "pf-v6-c-table__tree-view-main",
30
29
  "tableTreeViewText": "pf-v6-c-table__tree-view-text",
31
- "tableTreeViewTitleCell": "pf-v6-c-table__tree-view-title-cell",
32
- "tableTreeViewTitleHeaderCell": "pf-v6-c-table__tree-view-title-header-cell"
30
+ "tableTreeViewTitleCell": "pf-v6-c-table__tree-view-title-cell"
33
31
  };
@@ -213,7 +213,7 @@
213
213
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden {
214
214
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
215
215
  }
216
- @media screen and (min-width: 576px) {
216
+ @media screen and (min-width: 36rem) {
217
217
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-sm {
218
218
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
219
219
  }
@@ -221,7 +221,7 @@
221
221
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
222
222
  }
223
223
  }
224
- @media screen and (min-width: 768px) {
224
+ @media screen and (min-width: 48rem) {
225
225
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-md {
226
226
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
227
227
  }
@@ -229,7 +229,7 @@
229
229
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
230
230
  }
231
231
  }
232
- @media screen and (min-width: 992px) {
232
+ @media screen and (min-width: 62rem) {
233
233
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-lg {
234
234
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
235
235
  }
@@ -237,7 +237,7 @@
237
237
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
238
238
  }
239
239
  }
240
- @media screen and (min-width: 1200px) {
240
+ @media screen and (min-width: 75rem) {
241
241
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-xl {
242
242
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
243
243
  }
@@ -245,7 +245,7 @@
245
245
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
246
246
  }
247
247
  }
248
- @media screen and (min-width: 1450px) {
248
+ @media screen and (min-width: 90.625rem) {
249
249
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-2xl {
250
250
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
251
251
  }
@@ -281,7 +281,7 @@
281
281
  --pf-v6-c-tabs__list--Display: flex;
282
282
  --pf-v6-c-tabs__toggle--Display: none;
283
283
  }
284
- @media (min-width: 576px) {
284
+ @media (min-width: 36rem) {
285
285
  .pf-v6-c-tabs.pf-m-vertical.pf-m-expandable-on-sm {
286
286
  --pf-v6-c-tabs__list--Display: none;
287
287
  --pf-v6-c-tabs__toggle--Display: flex;
@@ -291,7 +291,7 @@
291
291
  --pf-v6-c-tabs__toggle--Display: none;
292
292
  }
293
293
  }
294
- @media (min-width: 768px) {
294
+ @media (min-width: 48rem) {
295
295
  .pf-v6-c-tabs.pf-m-vertical.pf-m-expandable-on-md {
296
296
  --pf-v6-c-tabs__list--Display: none;
297
297
  --pf-v6-c-tabs__toggle--Display: flex;
@@ -301,7 +301,7 @@
301
301
  --pf-v6-c-tabs__toggle--Display: none;
302
302
  }
303
303
  }
304
- @media (min-width: 992px) {
304
+ @media (min-width: 62rem) {
305
305
  .pf-v6-c-tabs.pf-m-vertical.pf-m-expandable-on-lg {
306
306
  --pf-v6-c-tabs__list--Display: none;
307
307
  --pf-v6-c-tabs__toggle--Display: flex;
@@ -311,7 +311,7 @@
311
311
  --pf-v6-c-tabs__toggle--Display: none;
312
312
  }
313
313
  }
314
- @media (min-width: 1200px) {
314
+ @media (min-width: 75rem) {
315
315
  .pf-v6-c-tabs.pf-m-vertical.pf-m-expandable-on-xl {
316
316
  --pf-v6-c-tabs__list--Display: none;
317
317
  --pf-v6-c-tabs__toggle--Display: flex;
@@ -321,7 +321,7 @@
321
321
  --pf-v6-c-tabs__toggle--Display: none;
322
322
  }
323
323
  }
324
- @media (min-width: 1450px) {
324
+ @media (min-width: 90.625rem) {
325
325
  .pf-v6-c-tabs.pf-m-vertical.pf-m-expandable-on-2xl {
326
326
  --pf-v6-c-tabs__list--Display: none;
327
327
  --pf-v6-c-tabs__toggle--Display: flex;
@@ -541,7 +541,7 @@
541
541
  --pf-v6-c-tabs__link--after--BorderWidth: 0;
542
542
  }
543
543
 
544
- .pf-v6-c-tabs__link:disabled, .pf-v6-c-tabs__link.pf-m-disabled, .pf-v6-c-tabs__link.pf-m-aria-disabled {
544
+ .pf-v6-c-tabs__link:is(:disabled, .pf-m-disabled, .pf-m-aria-disabled) {
545
545
  --pf-v6-c-tabs__link--BackgroundColor: var(--pf-v6-c-tabs__link--disabled--BackgroundColor);
546
546
  }
547
547
  .pf-v6-c-tabs__item.pf-m-action.pf-m-disabled {
@@ -649,7 +649,7 @@
649
649
  --pf-v6-c-tabs--m-vertical--inset: var(--pf-t--global--spacer--2xl);
650
650
  --pf-v6-c-tabs--m-vertical--m-box--inset: var(--pf-t--global--spacer--2xl);
651
651
  }
652
- @media (min-width: 576px) {
652
+ @media (min-width: 36rem) {
653
653
  .pf-v6-c-tabs.pf-m-inset-none-on-sm {
654
654
  --pf-v6-c-tabs--inset: 0;
655
655
  --pf-v6-c-tabs--m-vertical--inset: 0;
@@ -681,7 +681,7 @@
681
681
  --pf-v6-c-tabs--m-vertical--m-box--inset: var(--pf-t--global--spacer--2xl);
682
682
  }
683
683
  }
684
- @media (min-width: 768px) {
684
+ @media (min-width: 48rem) {
685
685
  .pf-v6-c-tabs.pf-m-inset-none-on-md {
686
686
  --pf-v6-c-tabs--inset: 0;
687
687
  --pf-v6-c-tabs--m-vertical--inset: 0;
@@ -713,7 +713,7 @@
713
713
  --pf-v6-c-tabs--m-vertical--m-box--inset: var(--pf-t--global--spacer--2xl);
714
714
  }
715
715
  }
716
- @media (min-width: 992px) {
716
+ @media (min-width: 62rem) {
717
717
  .pf-v6-c-tabs.pf-m-inset-none-on-lg {
718
718
  --pf-v6-c-tabs--inset: 0;
719
719
  --pf-v6-c-tabs--m-vertical--inset: 0;
@@ -745,7 +745,7 @@
745
745
  --pf-v6-c-tabs--m-vertical--m-box--inset: var(--pf-t--global--spacer--2xl);
746
746
  }
747
747
  }
748
- @media (min-width: 1200px) {
748
+ @media (min-width: 75rem) {
749
749
  .pf-v6-c-tabs.pf-m-inset-none-on-xl {
750
750
  --pf-v6-c-tabs--inset: 0;
751
751
  --pf-v6-c-tabs--m-vertical--inset: 0;
@@ -777,7 +777,7 @@
777
777
  --pf-v6-c-tabs--m-vertical--m-box--inset: var(--pf-t--global--spacer--2xl);
778
778
  }
779
779
  }
780
- @media (min-width: 1450px) {
780
+ @media (min-width: 90.625rem) {
781
781
  .pf-v6-c-tabs.pf-m-inset-none-on-2xl {
782
782
  --pf-v6-c-tabs--inset: 0;
783
783
  --pf-v6-c-tabs--m-vertical--inset: 0;
@@ -2,15 +2,12 @@
2
2
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
3
3
  --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
4
4
  --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
5
- --pf-v6-c-timestamp--m-help-text--TextDecorationLine: underline;
6
- --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: dashed;
7
- --pf-v6-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-t--global--border--width--regular);
5
+ --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
6
+ --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
8
7
  --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
9
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-t--global--border--color--default);
10
8
  --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
11
- --pf-v6-c-timestamp--m-help-text--focus--Color: var(--pf-t--global--text--color--regular);
12
- --pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-t--global--text--color--regular);
13
- --pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-t--global--text--color--regular);
9
+ --pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
10
+ --pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
14
11
  }
15
12
 
16
13
  .pf-v6-c-timestamp {
@@ -20,18 +17,12 @@
20
17
  outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
21
18
  }
22
19
  .pf-v6-c-timestamp.pf-m-help-text {
23
- text-decoration-line: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine);
24
- text-decoration-thickness: var(--pf-v6-c-timestamp--m-help-text--TextDecorationThickness);
25
- text-decoration-style: var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
26
- text-decoration-color: var(--pf-v6-c-timestamp--m-help-text--TextDecorationColor);
20
+ text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
27
21
  text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
28
22
  cursor: pointer;
29
23
  }
30
- .pf-v6-c-timestamp.pf-m-help-text:hover {
24
+ .pf-v6-c-timestamp.pf-m-help-text:is(:hover, :focus) {
31
25
  --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--hover--Color);
32
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor);
33
- }
34
- .pf-v6-c-timestamp.pf-m-help-text:focus {
35
- --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--focus--Color);
36
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor);
26
+ --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine);
27
+ --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle);
37
28
  }
@@ -88,7 +88,7 @@
88
88
  border-inline-start-color: var(--pf-v6-c-toggle-group__button--before--BorderInlineStartColor, var(--pf-v6-c-toggle-group__button--before--BorderColor));
89
89
  border-inline-end-color: var(--pf-v6-c-toggle-group__button--before--BorderInlineEndColor, var(--pf-v6-c-toggle-group__button--before--BorderColor));
90
90
  }
91
- .pf-v6-c-toggle-group__button:hover, .pf-v6-c-toggle-group__button:focus {
91
+ .pf-v6-c-toggle-group__button:is(:hover, :focus) {
92
92
  --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-v6-c-toggle-group__button--hover--BackgroundColor);
93
93
  --pf-v6-c-toggle-group__button--ZIndex: var(--pf-v6-c-toggle-group__button--hover--ZIndex);
94
94
  --pf-v6-c-toggle-group__button--before--BorderColor: var(--pf-v6-c-toggle-group__button--hover--before--BorderColor);
@@ -100,7 +100,7 @@
100
100
  --pf-v6-c-toggle-group__button--ZIndex: var(--pf-v6-c-toggle-group__button--m-selected--ZIndex);
101
101
  --pf-v6-c-toggle-group__button--before--BorderColor: var(--pf-v6-c-toggle-group__button--m-selected--before--BorderColor);
102
102
  }
103
- .pf-v6-c-toggle-group__button:disabled, .pf-v6-c-toggle-group__button.pf-m-disabled {
103
+ .pf-v6-c-toggle-group__button:is(:disabled, .pf-m-disabled) {
104
104
  --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-v6-c-toggle-group__button--disabled--BackgroundColor);
105
105
  --pf-v6-c-toggle-group__button--Color: var(--pf-v6-c-toggle-group__button--disabled--Color);
106
106
  --pf-v6-c-toggle-group__button--ZIndex: var(--pf-v6-c-toggle-group__button--disabled--ZIndex);
@@ -1,7 +1,7 @@
1
1
  :where(:root, .pf-v6-c-toolbar) {
2
2
  --pf-v6-c-toolbar--RowGap: var(--pf-t--global--spacer--md);
3
3
  --pf-v6-c-toolbar--PaddingBlockStart: 0;
4
- --pf-v6-c-toolbar--PaddingBlockEnd: 0;
4
+ --pf-v6-c-toolbar--PaddingBlockEnd: var(--pf-t--global--spacer--md);
5
5
  --pf-v6-c-toolbar--PaddingInlineStart: 0;
6
6
  --pf-v6-c-toolbar--PaddingInlineEnd: 0;
7
7
  --pf-v6-c-toolbar--LineHeight: var(--pf-t--global--font--line-height--body);
@@ -19,8 +19,8 @@
19
19
  --pf-v6-c-toolbar__group--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
20
20
  --pf-v6-c-toolbar__group--m-overflow-container--MinWidth: 0;
21
21
  --pf-v6-c-toolbar__content--RowGap: var(--pf-t--global--spacer--md);
22
- --pf-v6-c-toolbar__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
23
- --pf-v6-c-toolbar__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
22
+ --pf-v6-c-toolbar__content--PaddingInlineStart: 0;
23
+ --pf-v6-c-toolbar__content--PaddingInlineEnd: 0;
24
24
  --pf-v6-c-toolbar__content-section--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
25
25
  --pf-v6-c-toolbar__content-section--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
26
26
  --pf-v6-c-toolbar__expandable-content--ZIndex: var(--pf-t--global--z-index--sm);
@@ -60,7 +60,7 @@
60
60
  .pf-v6-c-toolbar__item.pf-m-hidden {
61
61
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
62
62
  }
63
- @media screen and (min-width: 576px) {
63
+ @media screen and (min-width: 36rem) {
64
64
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-sm,
65
65
  .pf-v6-c-toolbar__group.pf-m-hidden-on-sm,
66
66
  .pf-v6-c-toolbar__item.pf-m-hidden-on-sm {
@@ -72,7 +72,7 @@
72
72
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
73
73
  }
74
74
  }
75
- @media screen and (min-width: 768px) {
75
+ @media screen and (min-width: 48rem) {
76
76
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-md,
77
77
  .pf-v6-c-toolbar__group.pf-m-hidden-on-md,
78
78
  .pf-v6-c-toolbar__item.pf-m-hidden-on-md {
@@ -84,7 +84,7 @@
84
84
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
85
85
  }
86
86
  }
87
- @media screen and (min-width: 992px) {
87
+ @media screen and (min-width: 62rem) {
88
88
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-lg,
89
89
  .pf-v6-c-toolbar__group.pf-m-hidden-on-lg,
90
90
  .pf-v6-c-toolbar__item.pf-m-hidden-on-lg {
@@ -96,7 +96,7 @@
96
96
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
97
97
  }
98
98
  }
99
- @media screen and (min-width: 1200px) {
99
+ @media screen and (min-width: 75rem) {
100
100
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-xl,
101
101
  .pf-v6-c-toolbar__group.pf-m-hidden-on-xl,
102
102
  .pf-v6-c-toolbar__item.pf-m-hidden-on-xl {
@@ -108,7 +108,7 @@
108
108
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
109
109
  }
110
110
  }
111
- @media screen and (min-width: 1450px) {
111
+ @media screen and (min-width: 90.625rem) {
112
112
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-2xl,
113
113
  .pf-v6-c-toolbar__group.pf-m-hidden-on-2xl,
114
114
  .pf-v6-c-toolbar__item.pf-m-hidden-on-2xl {
@@ -138,7 +138,7 @@
138
138
  .pf-v6-c-toolbar__content.pf-m-hidden {
139
139
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
140
140
  }
141
- @media screen and (min-width: 576px) {
141
+ @media screen and (min-width: 36rem) {
142
142
  .pf-v6-c-toolbar__content.pf-m-hidden-on-sm {
143
143
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
144
144
  }
@@ -146,7 +146,7 @@
146
146
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
147
147
  }
148
148
  }
149
- @media screen and (min-width: 768px) {
149
+ @media screen and (min-width: 48rem) {
150
150
  .pf-v6-c-toolbar__content.pf-m-hidden-on-md {
151
151
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
152
152
  }
@@ -154,7 +154,7 @@
154
154
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
155
155
  }
156
156
  }
157
- @media screen and (min-width: 992px) {
157
+ @media screen and (min-width: 62rem) {
158
158
  .pf-v6-c-toolbar__content.pf-m-hidden-on-lg {
159
159
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
160
160
  }
@@ -162,7 +162,7 @@
162
162
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
163
163
  }
164
164
  }
165
- @media screen and (min-width: 1200px) {
165
+ @media screen and (min-width: 75rem) {
166
166
  .pf-v6-c-toolbar__content.pf-m-hidden-on-xl {
167
167
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
168
168
  }
@@ -170,7 +170,7 @@
170
170
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
171
171
  }
172
172
  }
173
- @media screen and (min-width: 1450px) {
173
+ @media screen and (min-width: 90.625rem) {
174
174
  .pf-v6-c-toolbar__content.pf-m-hidden-on-2xl {
175
175
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
176
176
  }
@@ -240,52 +240,52 @@
240
240
  width: var(--pf-v6-c-toolbar__item--Width--base);
241
241
  min-width: var(--pf-v6-c-toolbar__item--MinWidth--base);
242
242
  }
243
- @media (min-width: 576px) {
243
+ @media (min-width: 36rem) {
244
244
  .pf-v6-c-toolbar__item {
245
245
  --pf-v6-c-toolbar__item--Width--base: var(--pf-v6-c-toolbar__item--Width-on-sm, var(--pf-v6-c-toolbar__item--Width));
246
246
  }
247
247
  }
248
- @media (min-width: 768px) {
248
+ @media (min-width: 48rem) {
249
249
  .pf-v6-c-toolbar__item {
250
250
  --pf-v6-c-toolbar__item--Width--base: var(--pf-v6-c-toolbar__item--Width-on-md, var(--pf-v6-c-toolbar__item--Width-on-sm, var(--pf-v6-c-toolbar__item--Width)));
251
251
  }
252
252
  }
253
- @media (min-width: 992px) {
253
+ @media (min-width: 62rem) {
254
254
  .pf-v6-c-toolbar__item {
255
255
  --pf-v6-c-toolbar__item--Width--base: var(--pf-v6-c-toolbar__item--Width-on-lg, var(--pf-v6-c-toolbar__item--Width-on-md, var(--pf-v6-c-toolbar__item--Width-on-sm, var(--pf-v6-c-toolbar__item--Width))));
256
256
  }
257
257
  }
258
- @media (min-width: 1200px) {
258
+ @media (min-width: 75rem) {
259
259
  .pf-v6-c-toolbar__item {
260
260
  --pf-v6-c-toolbar__item--Width--base: var(--pf-v6-c-toolbar__item--Width-on-xl, var(--pf-v6-c-toolbar__item--Width-on-lg, var(--pf-v6-c-toolbar__item--Width-on-md, var(--pf-v6-c-toolbar__item--Width-on-sm, var(--pf-v6-c-toolbar__item--Width)))));
261
261
  }
262
262
  }
263
- @media (min-width: 1450px) {
263
+ @media (min-width: 90.625rem) {
264
264
  .pf-v6-c-toolbar__item {
265
265
  --pf-v6-c-toolbar__item--Width--base: var(--pf-v6-c-toolbar__item--Width-on-2xl, var(--pf-v6-c-toolbar__item--Width-on-xl, var(--pf-v6-c-toolbar__item--Width-on-lg, var(--pf-v6-c-toolbar__item--Width-on-md, var(--pf-v6-c-toolbar__item--Width-on-sm, var(--pf-v6-c-toolbar__item--Width))))));
266
266
  }
267
267
  }
268
- @media (min-width: 576px) {
268
+ @media (min-width: 36rem) {
269
269
  .pf-v6-c-toolbar__item {
270
270
  --pf-v6-c-toolbar__item--MinWidth--base: var(--pf-v6-c-toolbar__item--MinWidth-on-sm, var(--pf-v6-c-toolbar__item--MinWidth));
271
271
  }
272
272
  }
273
- @media (min-width: 768px) {
273
+ @media (min-width: 48rem) {
274
274
  .pf-v6-c-toolbar__item {
275
275
  --pf-v6-c-toolbar__item--MinWidth--base: var(--pf-v6-c-toolbar__item--MinWidth-on-md, var(--pf-v6-c-toolbar__item--MinWidth-on-sm, var(--pf-v6-c-toolbar__item--MinWidth)));
276
276
  }
277
277
  }
278
- @media (min-width: 992px) {
278
+ @media (min-width: 62rem) {
279
279
  .pf-v6-c-toolbar__item {
280
280
  --pf-v6-c-toolbar__item--MinWidth--base: var(--pf-v6-c-toolbar__item--MinWidth-on-lg, var(--pf-v6-c-toolbar__item--MinWidth-on-md, var(--pf-v6-c-toolbar__item--MinWidth-on-sm, var(--pf-v6-c-toolbar__item--MinWidth))));
281
281
  }
282
282
  }
283
- @media (min-width: 1200px) {
283
+ @media (min-width: 75rem) {
284
284
  .pf-v6-c-toolbar__item {
285
285
  --pf-v6-c-toolbar__item--MinWidth--base: var(--pf-v6-c-toolbar__item--MinWidth-on-xl, var(--pf-v6-c-toolbar__item--MinWidth-on-lg, var(--pf-v6-c-toolbar__item--MinWidth-on-md, var(--pf-v6-c-toolbar__item--MinWidth-on-sm, var(--pf-v6-c-toolbar__item--MinWidth)))));
286
286
  }
287
287
  }
288
- @media (min-width: 1450px) {
288
+ @media (min-width: 90.625rem) {
289
289
  .pf-v6-c-toolbar__item {
290
290
  --pf-v6-c-toolbar__item--MinWidth--base: var(--pf-v6-c-toolbar__item--MinWidth-on-2xl, var(--pf-v6-c-toolbar__item--MinWidth-on-xl, var(--pf-v6-c-toolbar__item--MinWidth-on-lg, var(--pf-v6-c-toolbar__item--MinWidth-on-md, var(--pf-v6-c-toolbar__item--MinWidth-on-sm, var(--pf-v6-c-toolbar__item--MinWidth))))));
291
291
  }
@@ -324,6 +324,7 @@
324
324
  column-gap: var(--pf-v6-c-toolbar__group--m-action-group-plain--ColumnGap);
325
325
  }
326
326
  .pf-v6-c-toolbar__group.pf-m-action-group-inline {
327
+ flex-wrap: wrap;
327
328
  column-gap: var(--pf-v6-c-toolbar__group--m-action-group-inline--ColumnGap);
328
329
  }
329
330
  .pf-v6-c-toolbar__group.pf-m-overflow-container {
@@ -344,7 +345,7 @@
344
345
  background-color: var(--pf-v6-c-toolbar__expandable-content--BackgroundColor);
345
346
  box-shadow: var(--pf-v6-c-toolbar__expandable-content--BoxShadow);
346
347
  }
347
- @media screen and (min-width: 992px) {
348
+ @media screen and (min-width: 62rem) {
348
349
  .pf-v6-c-toolbar__expandable-content {
349
350
  position: static;
350
351
  padding: 0;
@@ -636,7 +637,7 @@
636
637
  display: inline-flex;
637
638
  }
638
639
 
639
- @media (min-width: 576px) {
640
+ @media (min-width: 36rem) {
640
641
  .pf-v6-c-toolbar__group.pf-m-align-start-on-sm,
641
642
  .pf-v6-c-toolbar__item.pf-m-align-start-on-sm {
642
643
  margin-inline-start: 0;
@@ -888,7 +889,7 @@
888
889
  display: inline-flex;
889
890
  }
890
891
  }
891
- @media (min-width: 768px) {
892
+ @media (min-width: 48rem) {
892
893
  .pf-v6-c-toolbar__group.pf-m-align-start-on-md,
893
894
  .pf-v6-c-toolbar__item.pf-m-align-start-on-md {
894
895
  margin-inline-start: 0;
@@ -1140,7 +1141,7 @@
1140
1141
  display: inline-flex;
1141
1142
  }
1142
1143
  }
1143
- @media (min-width: 992px) {
1144
+ @media (min-width: 62rem) {
1144
1145
  .pf-v6-c-toolbar__group.pf-m-align-start-on-lg,
1145
1146
  .pf-v6-c-toolbar__item.pf-m-align-start-on-lg {
1146
1147
  margin-inline-start: 0;
@@ -1392,7 +1393,7 @@
1392
1393
  display: inline-flex;
1393
1394
  }
1394
1395
  }
1395
- @media (min-width: 1200px) {
1396
+ @media (min-width: 75rem) {
1396
1397
  .pf-v6-c-toolbar__group.pf-m-align-start-on-xl,
1397
1398
  .pf-v6-c-toolbar__item.pf-m-align-start-on-xl {
1398
1399
  margin-inline-start: 0;
@@ -1644,7 +1645,7 @@
1644
1645
  display: inline-flex;
1645
1646
  }
1646
1647
  }
1647
- @media (min-width: 1450px) {
1648
+ @media (min-width: 90.625rem) {
1648
1649
  .pf-v6-c-toolbar__group.pf-m-align-start-on-2xl,
1649
1650
  .pf-v6-c-toolbar__item.pf-m-align-start-on-2xl {
1650
1651
  margin-inline-start: 0;
@@ -112,7 +112,7 @@
112
112
  --pf-v6-c-wizard__footer--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
113
113
  --pf-v6-c-wizard__footer--BorderBlockStartColor: var(--pf-t--global--border--color--default);
114
114
  }
115
- @media screen and (min-width: 992px) {
115
+ @media screen and (min-width: 62rem) {
116
116
  :where(:root, .pf-v6-c-wizard) {
117
117
  --pf-v6-c-wizard__nav--Width: var(--pf-v6-c-wizard__nav--lg--Width);
118
118
  --pf-v6-c-wizard__nav--BoxShadow: none;
@@ -178,7 +178,7 @@
178
178
  padding-block-start: var(--pf-v6-c-wizard__description--PaddingBlockStart);
179
179
  color: var(--pf-v6-c-wizard__description--Color);
180
180
  }
181
- @media screen and (min-width: 992px) {
181
+ @media screen and (min-width: 62rem) {
182
182
  .pf-v6-c-wizard__description {
183
183
  display: block;
184
184
  }
@@ -200,7 +200,7 @@
200
200
  border-inline-start: 0;
201
201
  border-inline-end: 0;
202
202
  }
203
- @media screen and (min-width: 992px) {
203
+ @media screen and (min-width: 62rem) {
204
204
  .pf-v6-c-wizard__toggle {
205
205
  display: none;
206
206
  }
@@ -269,7 +269,7 @@
269
269
  min-height: var(--pf-v6-c-wizard__outer-wrap--MinHeight);
270
270
  background-color: var(--pf-v6-c-wizard__outer-wrap--BackgroundColor);
271
271
  }
272
- @media screen and (min-width: 992px) {
272
+ @media screen and (min-width: 62rem) {
273
273
  .pf-v6-c-wizard__outer-wrap {
274
274
  padding-inline-start: var(--pf-v6-c-wizard__outer-wrap--lg--PaddingInlineStart);
275
275
  }
@@ -282,7 +282,7 @@
282
282
  flex-grow: 1;
283
283
  min-height: 0;
284
284
  }
285
- @media screen and (min-width: 992px) {
285
+ @media screen and (min-width: 62rem) {
286
286
  .pf-v6-c-wizard__inner-wrap {
287
287
  position: static;
288
288
  }
@@ -304,7 +304,7 @@
304
304
  .pf-v6-c-wizard__nav.pf-m-expanded {
305
305
  display: block;
306
306
  }
307
- @media screen and (min-width: 992px) {
307
+ @media screen and (min-width: 62rem) {
308
308
  .pf-v6-c-wizard__nav {
309
309
  display: block;
310
310
  height: 100%;