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

Sign up to get free protection for your applications and to get access to all the features.
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
@@ -1,43 +1,60 @@
1
1
  :where(:root, .pf-v6-c-masthead) {
2
2
  --pf-v6-c-masthead--RowGap: var(--pf-t--global--spacer--sm);
3
- --pf-v6-c-masthead--ColumnGap: var(--pf-t--global--spacer--md);
3
+ --pf-v6-c-masthead--ColumnGap: var(--pf-t--global--spacer--gutter--default);
4
4
  --pf-v6-c-masthead--BorderWidth: var(--pf-t--global--border--width--divider--default);
5
5
  --pf-v6-c-masthead--PaddingBlock: var(--pf-t--global--spacer--md);
6
6
  --pf-v6-c-masthead--PaddingInline: var(--pf-t--global--spacer--lg);
7
7
  --pf-v6-c-masthead--BorderColor: var(--pf-t--global--border--color--default);
8
8
  --pf-v6-c-masthead--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
9
- --pf-v6-c-masthead__brand--MarginInlineEnd: var(--pf-t--global--spacer--md);
10
- --pf-v6-c-masthead__brand--MaxHeight: 2.375rem;
9
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-t--global--spacer--md);
10
+ --pf-v6-c-masthead__main--MarginInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
11
+ --pf-v6-c-masthead__logo--MaxHeight: 2.375rem;
12
+ --pf-v6-c-masthead__logo--Width: 11.8125rem;
11
13
  --pf-v6-c-masthead__toggle--Size: var(--pf-t--global--icon--size--xl);
14
+ --pf-v6-c-masthead__content--ColumnGap: var(--pf-t--global--spacer--md);
15
+ --pf-v6-c-masthead--m-display-stack--ColumnGap: var(--pf-t--global--spacer--gutter--default);
12
16
  --pf-v6-c-masthead--m-display-stack--GridTemplateColumns: max-content 1fr;
13
- --pf-v6-c-masthead--m-display-stack__main--GridColumn: -1 / 1;
14
- --pf-v6-c-masthead--m-display-stack__main--Order: -1;
15
- --pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd: var(--pf-v6-c-masthead--RowGap);
16
- --pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd: var(--pf-v6-c-masthead--BorderWidth) solid var(--pf-v6-c-masthead--BorderColor);
17
- --pf-v6-c-masthead--m-display-stack__content--GridColumn: 2;
17
+ --pf-v6-c-masthead--m-display-stack__brand--GridColumn: -1 / 1;
18
+ --pf-v6-c-masthead--m-display-stack__brand--Order: -1;
19
+ --pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--RowGap);
20
+ --pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd: var(--pf-v6-c-masthead--BorderWidth) solid var(--pf-v6-c-masthead--BorderColor);
21
+ --pf-v6-c-masthead--m-display-stack__content--GridColumn: 1;
18
22
  --pf-v6-c-masthead--m-display-stack__content--Order: 1;
19
- --pf-v6-c-masthead--m-display-inline--GridTemplateColumns: max-content max-content 1fr;
20
- --pf-v6-c-masthead--m-display-inline__main--GridColumn: 2;
21
- --pf-v6-c-masthead--m-display-inline__main--Order: 0;
22
- --pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd: 0;
23
- --pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd: 0;
24
- --pf-v6-c-masthead--m-display-inline__content--GridColumn: 3;
23
+ --pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn: 2;
24
+ --pf-v6-c-masthead--m-display-stack__main--Display: contents;
25
+ --pf-v6-c-masthead--m-display-stack__main--ColumnGap: unset;
26
+ --pf-v6-c-masthead--m-display-inline--ColumnGap: 0;
27
+ --pf-v6-c-masthead--m-display-inline--GridTemplateColumns: min-content 1fr;
28
+ --pf-v6-c-masthead--m-display-inline--breakpoint--xl--GridTemplateColumns: subgrid;
29
+ --pf-v6-c-masthead--m-display-inline__brand--GridColumn: initial;
30
+ --pf-v6-c-masthead--m-display-inline__brand--Order: initial;
31
+ --pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd: 0;
32
+ --pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd: 0;
33
+ --pf-v6-c-masthead--m-display-inline__main--GridColumn: 1;
34
+ --pf-v6-c-masthead--m-display-inline__content--GridColumn: 2;
25
35
  --pf-v6-c-masthead--m-display-inline__content--Order: 0;
36
+ --pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn: 2;
37
+ --pf-v6-c-masthead--m-display-inline__main--Display: flex;
38
+ --pf-v6-c-masthead--m-display-inline__main--ColumnGap: var(--pf-t--global--spacer--md);
26
39
  --pf-v6-c-masthead__expandable-content--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
27
40
  --pf-v6-c-masthead__expandable-content--BorderBlockStart: var(--pf-v6-c-masthead--BorderWidth) solid var(--pf-v6-c-masthead--BorderColor);
28
41
  --pf-v6-c-masthead--c-toolbar--Width: 100%;
29
42
  --pf-v6-c-masthead--c-toolbar--PaddingBlock: 0;
30
- --pf-v6-c-masthead--c-toolbar--PaddingInline: 0;
31
43
  }
32
44
 
33
45
  .pf-v6-c-masthead {
46
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-stack--ColumnGap);
34
47
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-stack--GridTemplateColumns);
35
- --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--GridColumn);
36
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-stack__main--Order);
37
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd);
38
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd);
48
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-stack__brand--GridColumn);
49
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-stack__brand--Order);
50
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd);
51
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd);
52
+ --pf-v6-c-masthead__main--GridColumn: unset;
39
53
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__content--GridColumn);
40
54
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-stack__content--Order);
55
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn);
56
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
57
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
41
58
  display: grid;
42
59
  grid-template-columns: var(--pf-v6-c-masthead--GridTemplateColumns);
43
60
  row-gap: var(--pf-v6-c-masthead--RowGap);
@@ -52,19 +69,23 @@
52
69
  }
53
70
  .pf-v6-c-masthead .pf-v6-c-toolbar {
54
71
  --pf-v6-c-toolbar--Width: var(--pf-v6-c-masthead--c-toolbar--Width);
55
- --pf-v6-c-toolbar__content--PaddingBlock: var(--pf-v6-c-masthead--c-toolbar--PaddingBlock);
56
- --pf-v6-c-toolbar__content--PaddingInline: var(--pf-v6-c-masthead--c-toolbar--PaddingInline);
72
+ --pf-v6-c-toolbar--PaddingBlockEnd: 0;
57
73
  --pf-v6-c-toolbar__content--MinWidth: 0;
58
74
  }
59
- @media screen and (min-width: 768px) {
75
+ @media screen and (min-width: 48rem) {
60
76
  :where(:not(.pf-m-resize-observer)) .pf-v6-c-masthead {
77
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
61
78
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
79
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
80
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
81
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
82
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
62
83
  --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
63
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-inline__main--Order);
64
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd);
65
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd);
66
84
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
67
85
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
86
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
87
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
88
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
68
89
  }
69
90
  }
70
91
  .pf-v6-c-masthead .pf-v6-c-toolbar__content-section {
@@ -77,22 +98,32 @@
77
98
  box-shadow: var(--pf-v6-c-masthead__expandable-content--BoxShadow);
78
99
  }
79
100
  .pf-v6-c-masthead.pf-m-display-stack {
101
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-stack--ColumnGap);
80
102
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-stack--GridTemplateColumns);
81
- --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--GridColumn);
82
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-stack__main--Order);
83
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd);
84
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd);
103
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-stack__brand--GridColumn);
104
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-stack__brand--Order);
105
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd);
106
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd);
107
+ --pf-v6-c-masthead__main--GridColumn: unset;
85
108
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__content--GridColumn);
86
109
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-stack__content--Order);
110
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn);
111
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
112
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
87
113
  }
88
114
  .pf-v6-c-masthead.pf-m-display-inline {
115
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
89
116
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
117
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
118
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
119
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
120
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
90
121
  --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
91
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-inline__main--Order);
92
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd);
93
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd);
94
122
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
95
123
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
124
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
125
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
126
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
96
127
  }
97
128
  .pf-v6-c-masthead.pf-m-inset-none {
98
129
  padding-inline-start: 0;
@@ -119,48 +150,55 @@
119
150
  padding-inline-end: var(--pf-t--global--spacer--2xl);
120
151
  }
121
152
 
122
- .pf-v6-c-masthead,
123
153
  .pf-v6-c-masthead__main {
154
+ display: var(--pf-v6-c-masthead__main--Display);
155
+ grid-column: var(--pf-v6-c-masthead__main--GridColumn);
156
+ column-gap: var(--pf-v6-c-masthead__main--ColumnGap);
157
+ align-items: center;
158
+ margin-inline-end: var(--pf-v6-c-masthead__main--MarginInlineEnd);
159
+ }
160
+ .pf-v6-c-masthead__main:has(.pf-v6-c-masthead__toggle) ~ .pf-v6-c-masthead__content {
161
+ --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead__main--toggle--content--GridColumn);
162
+ }
163
+
164
+ .pf-v6-c-masthead,
165
+ .pf-v6-c-masthead__brand {
124
166
  position: relative;
125
167
  }
126
168
 
127
- .pf-v6-c-masthead__main,
128
- .pf-v6-c-masthead__content,
129
- .pf-v6-c-masthead__logo,
130
169
  .pf-v6-c-masthead__brand {
131
170
  display: flex;
171
+ flex-shrink: 0;
172
+ grid-column: var(--pf-v6-c-masthead__brand--GridColumn, revert);
173
+ row-gap: var(--pf-v6-c-masthead__brand--RowGap, var(--pf-v6-c-masthead--RowGap));
132
174
  align-self: stretch;
133
- }
134
-
135
- .pf-v6-c-masthead__main,
136
- .pf-v6-c-masthead__brand,
137
- .pf-v6-c-masthead__content {
175
+ order: var(--pf-v6-c-masthead__brand--Order, revert);
138
176
  min-width: 0.25rem;
139
- }
140
-
141
- .pf-v6-c-masthead__main {
142
- grid-column: var(--pf-v6-c-masthead__main--GridColumn);
143
- row-gap: var(--pf-v6-c-masthead__main--RowGap, var(--pf-v6-c-masthead--RowGap));
144
- align-items: var(--pf-v6-c-masthead__main--AlignItems, var(--pf-v6-c-masthead--AlignItems));
145
- order: var(--pf-v6-c-masthead__main--Order);
146
- padding-block-end: var(--pf-v6-c-masthead__main--PaddingBlockEnd);
147
- border-block-end: var(--pf-v6-c-masthead__main--BorderBlockEnd);
177
+ padding-block-end: var(--pf-v6-c-masthead__brand--PaddingBlockEnd);
178
+ border-block-end: var(--pf-v6-c-masthead__brand--BorderBlockEnd);
148
179
  }
149
180
 
150
181
  .pf-v6-c-masthead__content {
182
+ display: flex;
151
183
  flex-wrap: wrap;
152
184
  grid-column: var(--pf-v6-c-masthead__content--GridColumn);
153
185
  grid-column-end: -1;
154
186
  row-gap: var(--pf-v6-c-masthead__content-RowGap, var(--pf-v6-c-masthead--RowGap));
155
- column-gap: var(--pf-v6-c-masthead__content-ColumnGap, var(--pf-v6-c-masthead--ColumnGap));
156
- align-items: var(--pf-v6-c-masthead__content--AlignItems, var(--pf-v6-c-masthead--AlignItems));
187
+ column-gap: var(--pf-v6-c-masthead__content--ColumnGap, var(--pf-v6-c-masthead--ColumnGap));
188
+ align-self: stretch;
157
189
  order: var(--pf-v6-c-masthead__content--Order);
190
+ min-width: 0.25rem;
158
191
  }
159
192
 
160
- .pf-v6-c-masthead__brand {
161
- align-items: var(--pf-v6-c-masthead__brand--AlignItems, var(--pf-v6-c-masthead--AlignItems));
162
- max-height: var(--pf-v6-c-masthead__brand--MaxHeight);
163
- margin-inline-end: var(--pf-v6-c-masthead__brand--MarginInlineEnd);
193
+ .pf-v6-c-masthead__logo {
194
+ position: relative;
195
+ width: var(--pf-v6-c-masthead__logo--Width);
196
+ max-height: var(--pf-v6-c-masthead__logo--MaxHeight);
197
+ }
198
+ .pf-v6-c-masthead__logo > * {
199
+ max-width: 100%;
200
+ max-height: 100%;
201
+ vertical-align: middle;
164
202
  }
165
203
 
166
204
  .pf-v6-c-masthead__toggle {
@@ -173,22 +211,32 @@
173
211
  }
174
212
 
175
213
  .pf-v6-c-masthead.pf-m-display-stack {
214
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-stack--ColumnGap);
176
215
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-stack--GridTemplateColumns);
177
- --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--GridColumn);
178
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-stack__main--Order);
179
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd);
180
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd);
216
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-stack__brand--GridColumn);
217
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-stack__brand--Order);
218
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd);
219
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd);
220
+ --pf-v6-c-masthead__main--GridColumn: unset;
181
221
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__content--GridColumn);
182
222
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-stack__content--Order);
223
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn);
224
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
225
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
183
226
  }
184
227
  .pf-v6-c-masthead.pf-m-display-inline {
228
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
185
229
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
230
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
231
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
232
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
233
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
186
234
  --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
187
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-inline__main--Order);
188
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd);
189
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd);
190
235
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
191
236
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
237
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
238
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
239
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
192
240
  }
193
241
  .pf-v6-c-masthead.pf-m-inset-none {
194
242
  padding-inline-start: 0;
@@ -214,24 +262,34 @@
214
262
  padding-inline-start: var(--pf-t--global--spacer--2xl);
215
263
  padding-inline-end: var(--pf-t--global--spacer--2xl);
216
264
  }
217
- @media (min-width: 576px) {
265
+ @media (min-width: 36rem) {
218
266
  .pf-v6-c-masthead.pf-m-display-stack-on-sm {
267
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-stack--ColumnGap);
219
268
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-stack--GridTemplateColumns);
220
- --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--GridColumn);
221
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-stack__main--Order);
222
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd);
223
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd);
269
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-stack__brand--GridColumn);
270
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-stack__brand--Order);
271
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd);
272
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd);
273
+ --pf-v6-c-masthead__main--GridColumn: unset;
224
274
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__content--GridColumn);
225
275
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-stack__content--Order);
276
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn);
277
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
278
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
226
279
  }
227
280
  .pf-v6-c-masthead.pf-m-display-inline-on-sm {
281
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
228
282
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
283
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
284
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
285
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
286
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
229
287
  --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
230
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-inline__main--Order);
231
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd);
232
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd);
233
288
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
234
289
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
290
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
291
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
292
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
235
293
  }
236
294
  }
237
295
  .pf-v6-c-masthead.pf-m-inset-none {
@@ -258,24 +316,34 @@
258
316
  padding-inline-start: var(--pf-t--global--spacer--2xl);
259
317
  padding-inline-end: var(--pf-t--global--spacer--2xl);
260
318
  }
261
- @media (min-width: 768px) {
319
+ @media (min-width: 48rem) {
262
320
  .pf-v6-c-masthead.pf-m-display-stack-on-md {
321
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-stack--ColumnGap);
263
322
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-stack--GridTemplateColumns);
264
- --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--GridColumn);
265
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-stack__main--Order);
266
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd);
267
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd);
323
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-stack__brand--GridColumn);
324
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-stack__brand--Order);
325
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd);
326
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd);
327
+ --pf-v6-c-masthead__main--GridColumn: unset;
268
328
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__content--GridColumn);
269
329
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-stack__content--Order);
330
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn);
331
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
332
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
270
333
  }
271
334
  .pf-v6-c-masthead.pf-m-display-inline-on-md {
335
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
272
336
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
337
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
338
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
339
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
340
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
273
341
  --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
274
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-inline__main--Order);
275
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd);
276
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd);
277
342
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
278
343
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
344
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
345
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
346
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
279
347
  }
280
348
  }
281
349
  .pf-v6-c-masthead.pf-m-inset-none {
@@ -302,24 +370,34 @@
302
370
  padding-inline-start: var(--pf-t--global--spacer--2xl);
303
371
  padding-inline-end: var(--pf-t--global--spacer--2xl);
304
372
  }
305
- @media (min-width: 992px) {
373
+ @media (min-width: 62rem) {
306
374
  .pf-v6-c-masthead.pf-m-display-stack-on-lg {
375
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-stack--ColumnGap);
307
376
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-stack--GridTemplateColumns);
308
- --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--GridColumn);
309
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-stack__main--Order);
310
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd);
311
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd);
377
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-stack__brand--GridColumn);
378
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-stack__brand--Order);
379
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd);
380
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd);
381
+ --pf-v6-c-masthead__main--GridColumn: unset;
312
382
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__content--GridColumn);
313
383
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-stack__content--Order);
384
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn);
385
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
386
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
314
387
  }
315
388
  .pf-v6-c-masthead.pf-m-display-inline-on-lg {
389
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
316
390
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
391
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
392
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
393
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
394
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
317
395
  --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
318
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-inline__main--Order);
319
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd);
320
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd);
321
396
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
322
397
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
398
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
399
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
400
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
323
401
  }
324
402
  }
325
403
  .pf-v6-c-masthead.pf-m-inset-none {
@@ -346,24 +424,34 @@
346
424
  padding-inline-start: var(--pf-t--global--spacer--2xl);
347
425
  padding-inline-end: var(--pf-t--global--spacer--2xl);
348
426
  }
349
- @media (min-width: 1200px) {
427
+ @media (min-width: 75rem) {
350
428
  .pf-v6-c-masthead.pf-m-display-stack-on-xl {
429
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-stack--ColumnGap);
351
430
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-stack--GridTemplateColumns);
352
- --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--GridColumn);
353
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-stack__main--Order);
354
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd);
355
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd);
431
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-stack__brand--GridColumn);
432
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-stack__brand--Order);
433
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd);
434
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd);
435
+ --pf-v6-c-masthead__main--GridColumn: unset;
356
436
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__content--GridColumn);
357
437
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-stack__content--Order);
438
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn);
439
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
440
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
358
441
  }
359
442
  .pf-v6-c-masthead.pf-m-display-inline-on-xl {
443
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
360
444
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
445
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
446
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
447
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
448
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
361
449
  --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
362
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-inline__main--Order);
363
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd);
364
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd);
365
450
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
366
451
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
452
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
453
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
454
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
367
455
  }
368
456
  }
369
457
  .pf-v6-c-masthead.pf-m-inset-none {
@@ -390,24 +478,34 @@
390
478
  padding-inline-start: var(--pf-t--global--spacer--2xl);
391
479
  padding-inline-end: var(--pf-t--global--spacer--2xl);
392
480
  }
393
- @media (min-width: 1450px) {
481
+ @media (min-width: 90.625rem) {
394
482
  .pf-v6-c-masthead.pf-m-display-stack-on-2xl {
483
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-stack--ColumnGap);
395
484
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-stack--GridTemplateColumns);
396
- --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--GridColumn);
397
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-stack__main--Order);
398
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--PaddingBlockEnd);
399
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__main--BorderBlockEnd);
485
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-stack__brand--GridColumn);
486
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-stack__brand--Order);
487
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--PaddingBlockEnd);
488
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-stack__brand--BorderBlockEnd);
489
+ --pf-v6-c-masthead__main--GridColumn: unset;
400
490
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__content--GridColumn);
401
491
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-stack__content--Order);
492
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-stack__main--toggle--content--GridColumn);
493
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
494
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
402
495
  }
403
496
  .pf-v6-c-masthead.pf-m-display-inline-on-2xl {
497
+ --pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
404
498
  --pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
499
+ --pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
500
+ --pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
501
+ --pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
502
+ --pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
405
503
  --pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
406
- --pf-v6-c-masthead__main--Order: var(--pf-v6-c-masthead--m-display-inline__main--Order);
407
- --pf-v6-c-masthead__main--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--PaddingBlockEnd);
408
- --pf-v6-c-masthead__main--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__main--BorderBlockEnd);
409
504
  --pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
410
505
  --pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
506
+ --pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
507
+ --pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
508
+ --pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
411
509
  }
412
510
  }
413
511
  .pf-v6-c-masthead.pf-m-inset-none {
@@ -116,7 +116,7 @@
116
116
  .pf-v6-c-menu__group.pf-m-hidden {
117
117
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
118
118
  }
119
- @media screen and (min-width: 576px) {
119
+ @media screen and (min-width: 36rem) {
120
120
  .pf-v6-c-menu__list.pf-m-hidden-on-sm,
121
121
  .pf-v6-c-menu__group.pf-m-hidden-on-sm {
122
122
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
@@ -126,7 +126,7 @@
126
126
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
127
127
  }
128
128
  }
129
- @media screen and (min-width: 768px) {
129
+ @media screen and (min-width: 48rem) {
130
130
  .pf-v6-c-menu__list.pf-m-hidden-on-md,
131
131
  .pf-v6-c-menu__group.pf-m-hidden-on-md {
132
132
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
@@ -136,7 +136,7 @@
136
136
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
137
137
  }
138
138
  }
139
- @media screen and (min-width: 992px) {
139
+ @media screen and (min-width: 62rem) {
140
140
  .pf-v6-c-menu__list.pf-m-hidden-on-lg,
141
141
  .pf-v6-c-menu__group.pf-m-hidden-on-lg {
142
142
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
@@ -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: 1200px) {
149
+ @media screen and (min-width: 75rem) {
150
150
  .pf-v6-c-menu__list.pf-m-hidden-on-xl,
151
151
  .pf-v6-c-menu__group.pf-m-hidden-on-xl {
152
152
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
@@ -156,7 +156,7 @@
156
156
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
157
157
  }
158
158
  }
159
- @media screen and (min-width: 1450px) {
159
+ @media screen and (min-width: 90.625rem) {
160
160
  .pf-v6-c-menu__list.pf-m-hidden-on-2xl,
161
161
  .pf-v6-c-menu__group.pf-m-hidden-on-2xl {
162
162
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
@@ -442,7 +442,7 @@
442
442
  .pf-v6-c-menu__item.pf-m-hidden {
443
443
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
444
444
  }
445
- @media screen and (min-width: 576px) {
445
+ @media screen and (min-width: 36rem) {
446
446
  .pf-v6-c-menu__item.pf-m-hidden-on-sm {
447
447
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
448
448
  }
@@ -450,7 +450,7 @@
450
450
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
451
451
  }
452
452
  }
453
- @media screen and (min-width: 768px) {
453
+ @media screen and (min-width: 48rem) {
454
454
  .pf-v6-c-menu__item.pf-m-hidden-on-md {
455
455
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
456
456
  }
@@ -458,7 +458,7 @@
458
458
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
459
459
  }
460
460
  }
461
- @media screen and (min-width: 992px) {
461
+ @media screen and (min-width: 62rem) {
462
462
  .pf-v6-c-menu__item.pf-m-hidden-on-lg {
463
463
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
464
464
  }
@@ -466,7 +466,7 @@
466
466
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
467
467
  }
468
468
  }
469
- @media screen and (min-width: 1200px) {
469
+ @media screen and (min-width: 75rem) {
470
470
  .pf-v6-c-menu__item.pf-m-hidden-on-xl {
471
471
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
472
472
  }
@@ -474,7 +474,7 @@
474
474
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
475
475
  }
476
476
  }
477
- @media screen and (min-width: 1450px) {
477
+ @media screen and (min-width: 90.625rem) {
478
478
  .pf-v6-c-menu__item.pf-m-hidden-on-2xl {
479
479
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
480
480
  }
@@ -87,6 +87,7 @@
87
87
  --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
88
88
  --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
89
89
  --pf-v6-c-menu-toggle__button--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
90
+ --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
90
91
  --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
91
92
  --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
92
93
  --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
@@ -350,6 +351,11 @@
350
351
  .pf-v6-c-menu-toggle__button:has(.pf-v6-c-menu-toggle__controls) {
351
352
  padding-inline-start: 0;
352
353
  }
354
+ .pf-v6-c-menu-toggle__button.pf-m-text {
355
+ display: inline-flex;
356
+ align-items: baseline;
357
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart);
358
+ }
353
359
 
354
360
  .pf-v6-c-menu-toggle__text {
355
361
  overflow: hidden;
@@ -25,7 +25,8 @@ declare const _default: {
25
25
  "danger": "pf-m-danger",
26
26
  "splitButton": "pf-m-split-button",
27
27
  "action": "pf-m-action",
28
- "typeahead": "pf-m-typeahead"
28
+ "typeahead": "pf-m-typeahead",
29
+ "text": "pf-m-text"
29
30
  },
30
31
  "textInputGroup": "pf-v6-c-text-input-group"
31
32
  };
@@ -27,7 +27,8 @@ exports.default = {
27
27
  "danger": "pf-m-danger",
28
28
  "splitButton": "pf-m-split-button",
29
29
  "action": "pf-m-action",
30
- "typeahead": "pf-m-typeahead"
30
+ "typeahead": "pf-m-typeahead",
31
+ "text": "pf-m-text"
31
32
  },
32
33
  "textInputGroup": "pf-v6-c-text-input-group"
33
34
  };
@@ -25,7 +25,8 @@ export default {
25
25
  "danger": "pf-m-danger",
26
26
  "splitButton": "pf-m-split-button",
27
27
  "action": "pf-m-action",
28
- "typeahead": "pf-m-typeahead"
28
+ "typeahead": "pf-m-typeahead",
29
+ "text": "pf-m-text"
29
30
  },
30
31
  "textInputGroup": "pf-v6-c-text-input-group"
31
32
  };