@patternfly/patternfly 4.224.2 → 5.0.0-alpha.10

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 (187) hide show
  1. package/README.md +2 -2
  2. package/RELEASE-NOTES.md +0 -17
  3. package/assets/icons/iconUnicodes.json +0 -1
  4. package/assets/pficon/pficon.scss +0 -6
  5. package/assets/pficon/pficon.woff +0 -0
  6. package/assets/pficon/pficon.woff2 +0 -0
  7. package/base/_chart-globals.scss +4 -0
  8. package/base/_common.scss +0 -22
  9. package/base/_fonts.scss +0 -188
  10. package/base/_globals.scss +0 -6
  11. package/base/_icons.scss +28 -0
  12. package/base/_variables.scss +0 -14
  13. package/base/patternfly-common.css +0 -10
  14. package/base/patternfly-fonts.css +0 -120
  15. package/base/patternfly-globals.css +0 -4
  16. package/base/patternfly-icons.css +1 -5
  17. package/base/patternfly-icons.scss +0 -28
  18. package/base/patternfly-pf-icons.css +1 -5
  19. package/base/patternfly-variables.css +6 -19
  20. package/components/AboutModalBox/about-modal-box.css +1 -28
  21. package/components/AboutModalBox/about-modal-box.scss +1 -27
  22. package/components/Accordion/accordion.css +64 -62
  23. package/components/Accordion/accordion.scss +62 -64
  24. package/components/Alert/alert.css +0 -4
  25. package/components/Alert/alert.scss +0 -7
  26. package/components/Banner/banner.css +1 -1
  27. package/components/Banner/banner.scss +1 -1
  28. package/components/Breadcrumb/breadcrumb.css +0 -6
  29. package/components/Breadcrumb/breadcrumb.scss +0 -9
  30. package/components/Button/button.css +0 -4
  31. package/components/Button/button.scss +0 -7
  32. package/components/CalendarMonth/calendar-month.css +1 -1
  33. package/components/CalendarMonth/calendar-month.scss +1 -1
  34. package/components/Card/card.css +9 -16
  35. package/components/Card/card.scss +11 -24
  36. package/components/Check/check.css +4 -2
  37. package/components/Check/check.scss +2 -2
  38. package/components/ChipGroup/chip-group.css +29 -17
  39. package/components/ChipGroup/chip-group.scss +39 -22
  40. package/components/Content/content.css +1 -17
  41. package/components/Content/content.scss +1 -23
  42. package/components/DataList/data-list.css +0 -15
  43. package/components/Divider/divider.css +0 -16
  44. package/components/Divider/divider.scss +0 -1
  45. package/components/Drawer/drawer.css +0 -15
  46. package/components/Drawer/drawer.scss +0 -6
  47. package/components/EmptyState/empty-state.css +46 -56
  48. package/components/EmptyState/empty-state.scss +58 -66
  49. package/components/ExpandableSection/expandable-section.css +0 -4
  50. package/components/ExpandableSection/expandable-section.scss +0 -7
  51. package/components/Form/form.css +0 -1
  52. package/components/Form/form.scss +0 -1
  53. package/components/InlineEdit/inline-edit.css +1 -12
  54. package/components/InlineEdit/inline-edit.scss +1 -10
  55. package/components/JumpLinks/jump-links.css +0 -43
  56. package/components/JumpLinks/jump-links.scss +0 -13
  57. package/components/Label/label.css +0 -3
  58. package/components/Label/label.scss +0 -4
  59. package/components/LabelGroup/label-group.css +26 -22
  60. package/components/LabelGroup/label-group.scss +31 -26
  61. package/components/Menu/menu.css +0 -16
  62. package/components/Menu/menu.scss +0 -1
  63. package/components/NotificationDrawer/notification-drawer.css +1 -0
  64. package/components/NotificationDrawer/notification-drawer.scss +1 -0
  65. package/components/Page/page.css +0 -15
  66. package/components/Pagination/pagination.css +108 -55
  67. package/components/Pagination/pagination.scss +6 -25
  68. package/components/Popover/popover.css +1 -6
  69. package/components/Popover/themes/dark/popover.scss +1 -7
  70. package/components/Progress/progress.css +0 -1
  71. package/components/Progress/progress.scss +0 -1
  72. package/components/Radio/radio.css +4 -2
  73. package/components/Radio/radio.scss +2 -2
  74. package/components/SimpleList/simple-list.css +1 -1
  75. package/components/SimpleList/simple-list.scss +1 -1
  76. package/components/SkipToContent/skip-to-content.css +1 -1
  77. package/components/SkipToContent/skip-to-content.scss +1 -1
  78. package/components/Switch/switch.css +0 -1
  79. package/components/Switch/switch.scss +0 -1
  80. package/components/Table/table-grid.css +0 -10
  81. package/components/Table/table-grid.scss +0 -2
  82. package/components/Table/table-tree-view.css +0 -16
  83. package/components/Table/table-tree-view.scss +0 -4
  84. package/components/Table/table.css +0 -16
  85. package/components/Table/table.scss +0 -1
  86. package/components/Tabs/tabs.css +5 -34
  87. package/components/Tabs/tabs.scss +7 -15
  88. package/components/Title/title.css +0 -5
  89. package/components/Title/title.scss +0 -8
  90. package/components/Toolbar/toolbar.css +30 -33
  91. package/components/Toolbar/toolbar.scss +37 -9
  92. package/components/Tooltip/themes/dark/tooltip.scss +3 -6
  93. package/components/Tooltip/tooltip.css +2 -5
  94. package/components/Wizard/wizard.css +0 -9
  95. package/components/Wizard/wizard.scss +0 -9
  96. package/docs/components/AboutModalBox/examples/AboutModalBox.md +4 -15
  97. package/docs/components/Accordion/examples/Accordion.md +67 -67
  98. package/docs/components/Card/examples/Card.md +61 -44
  99. package/docs/components/CodeBlock/examples/CodeBlock.md +6 -6
  100. package/docs/components/CodeEditor/examples/CodeEditor.md +2 -6
  101. package/docs/components/Content/examples/Content.md +0 -28
  102. package/docs/components/EmptyState/examples/EmptyState.md +127 -79
  103. package/docs/components/SkipToContent/examples/SkipToContent.md +3 -5
  104. package/docs/components/Tabs/examples/Tabs.md +102 -103
  105. package/docs/components/Toolbar/examples/Toolbar.md +19 -16
  106. package/docs/components/Wizard/examples/Wizard.md +10 -13
  107. package/docs/demos/AboutModal/examples/AboutModal.md +53 -49
  108. package/docs/demos/Alert/examples/Alert.md +18 -12
  109. package/docs/demos/BackToTop/examples/BackToTop.md +6 -4
  110. package/docs/demos/Banner/examples/Banner.md +13 -8
  111. package/docs/demos/Card/examples/Card.md +145 -110
  112. package/docs/demos/CardView/examples/CardView.md +7 -7
  113. package/docs/demos/ContextSelector/examples/ContextSelector.md +24 -16
  114. package/docs/demos/Dashboard/examples/Dashboard.md +6 -4
  115. package/docs/demos/DataList/examples/DataList.md +26 -20
  116. package/docs/demos/DescriptionList/examples/DescriptionList.md +19 -12
  117. package/docs/demos/Drawer/examples/Drawer.md +30 -20
  118. package/docs/demos/HelperText/examples/HelperText.md +1 -0
  119. package/docs/demos/JumpLinks/examples/JumpLinks.md +36 -24
  120. package/docs/demos/Masthead/examples/Masthead.md +57 -42
  121. package/docs/demos/Modal/examples/Modal.md +36 -24
  122. package/docs/demos/Nav/examples/Nav.md +48 -32
  123. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +30 -20
  124. package/docs/demos/Page/examples/Page.md +55 -37
  125. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +1 -0
  126. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +51 -34
  127. package/docs/demos/Skeleton/examples/Skeleton.md +6 -4
  128. package/docs/demos/Table/examples/Table.md +102 -88
  129. package/docs/demos/Tabs/examples/Tabs.md +40 -28
  130. package/docs/demos/Toolbar/examples/Toolbar.md +1648 -66
  131. package/docs/demos/Wizard/examples/Wizard.md +232 -222
  132. package/icons/pf-icons.json +0 -1
  133. package/package.json +4 -3
  134. package/patternfly-base-no-reset.css +31 -154
  135. package/patternfly-base.css +31 -158
  136. package/patternfly-charts.css +1 -1
  137. package/patternfly-no-reset.css +367 -650
  138. package/patternfly.css +367 -654
  139. package/patternfly.min.css +1 -1
  140. package/patternfly.min.css.map +1 -1
  141. package/sass-utilities/mixins.scss +0 -6
  142. package/sass-utilities/placeholders.scss +0 -7
  143. package/sass-utilities/scss-variables.scss +6 -13
  144. package/assets/fonts/overpass-mono-webfont/example.html +0 -15
  145. package/assets/fonts/overpass-mono-webfont/overpass-mono-bold.woff +0 -0
  146. package/assets/fonts/overpass-mono-webfont/overpass-mono-bold.woff2 +0 -0
  147. package/assets/fonts/overpass-mono-webfont/overpass-mono-light.woff +0 -0
  148. package/assets/fonts/overpass-mono-webfont/overpass-mono-light.woff2 +0 -0
  149. package/assets/fonts/overpass-mono-webfont/overpass-mono-regular.woff +0 -0
  150. package/assets/fonts/overpass-mono-webfont/overpass-mono-regular.woff2 +0 -0
  151. package/assets/fonts/overpass-mono-webfont/overpass-mono-semibold.woff +0 -0
  152. package/assets/fonts/overpass-mono-webfont/overpass-mono-semibold.woff2 +0 -0
  153. package/assets/fonts/overpass-mono-webfont/overpass-mono.css +0 -39
  154. package/assets/fonts/overpass-webfont/example.html +0 -18
  155. package/assets/fonts/overpass-webfont/overpass-bold-italic.woff +0 -0
  156. package/assets/fonts/overpass-webfont/overpass-bold-italic.woff2 +0 -0
  157. package/assets/fonts/overpass-webfont/overpass-bold.woff +0 -0
  158. package/assets/fonts/overpass-webfont/overpass-bold.woff2 +0 -0
  159. package/assets/fonts/overpass-webfont/overpass-extrabold-italic.woff +0 -0
  160. package/assets/fonts/overpass-webfont/overpass-extrabold-italic.woff2 +0 -0
  161. package/assets/fonts/overpass-webfont/overpass-extrabold.woff +0 -0
  162. package/assets/fonts/overpass-webfont/overpass-extrabold.woff2 +0 -0
  163. package/assets/fonts/overpass-webfont/overpass-extralight-italic.woff +0 -0
  164. package/assets/fonts/overpass-webfont/overpass-extralight-italic.woff2 +0 -0
  165. package/assets/fonts/overpass-webfont/overpass-extralight.woff +0 -0
  166. package/assets/fonts/overpass-webfont/overpass-extralight.woff2 +0 -0
  167. package/assets/fonts/overpass-webfont/overpass-heavy-italic.woff +0 -0
  168. package/assets/fonts/overpass-webfont/overpass-heavy-italic.woff2 +0 -0
  169. package/assets/fonts/overpass-webfont/overpass-heavy.woff +0 -0
  170. package/assets/fonts/overpass-webfont/overpass-heavy.woff2 +0 -0
  171. package/assets/fonts/overpass-webfont/overpass-italic.woff +0 -0
  172. package/assets/fonts/overpass-webfont/overpass-italic.woff2 +0 -0
  173. package/assets/fonts/overpass-webfont/overpass-light-italic.woff +0 -0
  174. package/assets/fonts/overpass-webfont/overpass-light-italic.woff2 +0 -0
  175. package/assets/fonts/overpass-webfont/overpass-light.woff +0 -0
  176. package/assets/fonts/overpass-webfont/overpass-light.woff2 +0 -0
  177. package/assets/fonts/overpass-webfont/overpass-regular.woff +0 -0
  178. package/assets/fonts/overpass-webfont/overpass-regular.woff2 +0 -0
  179. package/assets/fonts/overpass-webfont/overpass-semibold-italic.woff +0 -0
  180. package/assets/fonts/overpass-webfont/overpass-semibold-italic.woff2 +0 -0
  181. package/assets/fonts/overpass-webfont/overpass-semibold.woff +0 -0
  182. package/assets/fonts/overpass-webfont/overpass-semibold.woff2 +0 -0
  183. package/assets/fonts/overpass-webfont/overpass-thin-italic.woff +0 -0
  184. package/assets/fonts/overpass-webfont/overpass-thin-italic.woff2 +0 -0
  185. package/assets/fonts/overpass-webfont/overpass-thin.woff +0 -0
  186. package/assets/fonts/overpass-webfont/overpass-thin.woff2 +0 -0
  187. package/assets/fonts/overpass-webfont/overpass.css +0 -141
@@ -18,11 +18,8 @@
18
18
  --pf-c-pagination--m-compact--child--MarginRight: var(--pf-global--spacer--sm);
19
19
  --pf-c-pagination--c-options-menu__toggle--FontSize: var(--pf-global--FontSize--sm);
20
20
  --pf-c-pagination__nav--Display: none;
21
- --pf-c-pagination__nav--Visibility: hidden;
22
21
  --pf-c-pagination--m-display-summary__nav--Display: none;
23
- --pf-c-pagination--m-display-summary__nav--Visibility: hidden;
24
22
  --pf-c-pagination--m-display-full__nav--Display: inline-flex;
25
- --pf-c-pagination--m-display-full__nav--Visibility: visible;
26
23
  --pf-c-pagination__nav-control--c-button--PaddingRight: var(--pf-global--spacer--sm);
27
24
  --pf-c-pagination__nav-control--c-button--PaddingLeft: var(--pf-global--spacer--sm);
28
25
  --pf-c-pagination__nav-control--c-button--FontSize: var(--pf-global--FontSize--md);
@@ -43,11 +40,8 @@
43
40
  --pf-c-pagination__nav-page-select--c-form-control--width-chars: 2;
44
41
  --pf-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
45
42
  --pf-c-pagination__total-items--Display: block;
46
- --pf-c-pagination__total-items--Visibility: visible;
47
43
  --pf-c-pagination--m-display-summary__total-items--Display: block;
48
- --pf-c-pagination--m-display-summary__total-items--Visibility: visible;
49
44
  --pf-c-pagination--m-display-full__total-items--Display: none;
50
- --pf-c-pagination--m-display-full__total-items--Visibility: hidden;
51
45
  --pf-c-pagination--m-sticky--BackgroundColor: var(--pf-global--BackgroundColor--100);
52
46
  --pf-c-pagination--m-sticky--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
53
47
  --pf-c-pagination--m-sticky--md--PaddingTop: var(--pf-global--spacer--md);
@@ -67,11 +61,8 @@
67
61
  --pf-c-pagination--m-bottom--xl--PaddingLeft: var(--pf-global--spacer--lg);
68
62
  --pf-c-pagination--m-bottom--m-sticky--BoxShadow: var(--pf-global--BoxShadow--sm-top);
69
63
  --pf-c-pagination--c-options-menu--Display: none;
70
- --pf-c-pagination--c-options-menu--Visibility: hidden;
71
64
  --pf-c-pagination--m-display-summary--c-options-menu--Display: none;
72
- --pf-c-pagination--m-display-summary--c-options-menu--Visibility: hidden;
73
65
  --pf-c-pagination--m-display-full--c-options-menu--Display: inline-flex;
74
- --pf-c-pagination--m-display-full--c-options-menu--Visibility: visible;
75
66
  display: flex;
76
67
  flex-wrap: wrap;
77
68
  align-items: center;
@@ -89,11 +80,8 @@
89
80
  --pf-c-pagination--m-bottom__nav-control--c-button--OutlineOffset: 0;
90
81
  --pf-c-pagination--m-bottom--BoxShadow: none;
91
82
  --pf-c-pagination--c-options-menu--Display: inline-flex;
92
- --pf-c-pagination--c-options-menu--Visibility: visible;
93
83
  --pf-c-pagination__nav--Display: inline-flex;
94
- --pf-c-pagination__nav--Visibility: visible;
95
84
  --pf-c-pagination__total-items--Display: none;
96
- --pf-c-pagination__total-items--Visibility: hidden;
97
85
  }
98
86
  }
99
87
  @media screen and (min-width: 1200px) {
@@ -109,7 +97,6 @@
109
97
  }
110
98
  .pf-c-pagination .pf-c-options-menu {
111
99
  display: var(--pf-c-pagination--c-options-menu--Display);
112
- visibility: var(--pf-c-pagination--c-options-menu--Visibility);
113
100
  }
114
101
  .pf-c-pagination.pf-m-bottom {
115
102
  --pf-c-pagination--child--MarginRight: var(--pf-c-pagination--m-bottom--child--MarginRight);
@@ -138,18 +125,15 @@
138
125
  .pf-c-pagination.pf-m-bottom .pf-c-pagination__nav-control.pf-m-last,
139
126
  .pf-c-pagination.pf-m-bottom .pf-c-pagination__nav-page-select {
140
127
  display: none;
141
- visibility: hidden;
142
128
  }
143
129
  .pf-c-pagination.pf-m-bottom .pf-c-options-menu {
144
130
  position: absolute;
145
131
  display: block;
146
- visibility: visible;
147
132
  }
148
133
  .pf-c-pagination.pf-m-bottom .pf-c-pagination__nav {
149
134
  display: flex;
150
135
  flex-basis: 100%;
151
136
  justify-content: space-between;
152
- visibility: visible;
153
137
  }
154
138
  @media screen and (min-width: 768px) {
155
139
  .pf-c-pagination.pf-m-bottom {
@@ -164,7 +148,6 @@
164
148
  .pf-c-pagination.pf-m-bottom .pf-c-pagination__nav-control.pf-m-last,
165
149
  .pf-c-pagination.pf-m-bottom .pf-c-pagination__nav-page-select {
166
150
  display: block;
167
- visibility: visible;
168
151
  }
169
152
  .pf-c-pagination.pf-m-bottom .pf-c-options-menu {
170
153
  position: relative;
@@ -204,7 +187,6 @@
204
187
  .pf-c-pagination__nav {
205
188
  display: var(--pf-c-pagination__nav--Display);
206
189
  justify-content: flex-end;
207
- visibility: var(--pf-c-pagination__nav--Visibility);
208
190
  }
209
191
 
210
192
  .pf-c-pagination__nav-control .pf-c-button {
@@ -235,24 +217,35 @@
235
217
 
236
218
  .pf-c-pagination__total-items {
237
219
  display: var(--pf-c-pagination__total-items--Display);
238
- visibility: var(--pf-c-pagination__total-items--Visibility);
239
220
  }
240
221
 
241
222
  .pf-c-pagination.pf-m-display-summary {
242
223
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
243
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-summary__nav--Visibility);
244
224
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-summary--c-options-menu--Display);
245
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-summary--c-options-menu--Visibility);
246
225
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-summary__total-items--Display);
247
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-summary__total-items--Visibility);
248
226
  }
249
227
  .pf-c-pagination.pf-m-display-full {
250
228
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-full__nav--Display);
251
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-full__nav--Visibility);
252
229
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
253
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-full--c-options-menu--Visibility);
254
230
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
255
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
231
+ }
232
+ .pf-c-pagination.pf-m-inset-none {
233
+ --pf-c-pagination--inset: 0;
234
+ }
235
+ .pf-c-pagination.pf-m-inset-sm {
236
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
237
+ }
238
+ .pf-c-pagination.pf-m-inset-md {
239
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
240
+ }
241
+ .pf-c-pagination.pf-m-inset-lg {
242
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
243
+ }
244
+ .pf-c-pagination.pf-m-inset-xl {
245
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
246
+ }
247
+ .pf-c-pagination.pf-m-inset-2xl {
248
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
256
249
  }
257
250
  .pf-c-pagination.pf-m-inset-none {
258
251
  --pf-c-pagination--inset: 0;
@@ -275,19 +268,31 @@
275
268
  @media (min-width: 576px) {
276
269
  .pf-c-pagination.pf-m-display-summary-on-sm {
277
270
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
278
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-summary__nav--Visibility);
279
271
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-summary--c-options-menu--Display);
280
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-summary--c-options-menu--Visibility);
281
272
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-summary__total-items--Display);
282
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-summary__total-items--Visibility);
283
273
  }
284
274
  .pf-c-pagination.pf-m-display-full-on-sm {
285
275
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-full__nav--Display);
286
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-full__nav--Visibility);
287
276
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
288
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-full--c-options-menu--Visibility);
289
277
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
290
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
278
+ }
279
+ .pf-c-pagination.pf-m-inset-none-on-sm {
280
+ --pf-c-pagination--inset: 0;
281
+ }
282
+ .pf-c-pagination.pf-m-inset-sm-on-sm {
283
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
284
+ }
285
+ .pf-c-pagination.pf-m-inset-md-on-sm {
286
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
287
+ }
288
+ .pf-c-pagination.pf-m-inset-lg-on-sm {
289
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
290
+ }
291
+ .pf-c-pagination.pf-m-inset-xl-on-sm {
292
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
293
+ }
294
+ .pf-c-pagination.pf-m-inset-2xl-on-sm {
295
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
291
296
  }
292
297
  .pf-c-pagination.pf-m-inset-none-on-sm {
293
298
  --pf-c-pagination--inset: 0;
@@ -311,19 +316,31 @@
311
316
  @media (min-width: 768px) {
312
317
  .pf-c-pagination.pf-m-display-summary-on-md {
313
318
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
314
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-summary__nav--Visibility);
315
319
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-summary--c-options-menu--Display);
316
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-summary--c-options-menu--Visibility);
317
320
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-summary__total-items--Display);
318
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-summary__total-items--Visibility);
319
321
  }
320
322
  .pf-c-pagination.pf-m-display-full-on-md {
321
323
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-full__nav--Display);
322
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-full__nav--Visibility);
323
324
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
324
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-full--c-options-menu--Visibility);
325
325
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
326
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
326
+ }
327
+ .pf-c-pagination.pf-m-inset-none-on-md {
328
+ --pf-c-pagination--inset: 0;
329
+ }
330
+ .pf-c-pagination.pf-m-inset-sm-on-md {
331
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
332
+ }
333
+ .pf-c-pagination.pf-m-inset-md-on-md {
334
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
335
+ }
336
+ .pf-c-pagination.pf-m-inset-lg-on-md {
337
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
338
+ }
339
+ .pf-c-pagination.pf-m-inset-xl-on-md {
340
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
341
+ }
342
+ .pf-c-pagination.pf-m-inset-2xl-on-md {
343
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
327
344
  }
328
345
  .pf-c-pagination.pf-m-inset-none-on-md {
329
346
  --pf-c-pagination--inset: 0;
@@ -347,19 +364,31 @@
347
364
  @media (min-width: 992px) {
348
365
  .pf-c-pagination.pf-m-display-summary-on-lg {
349
366
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
350
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-summary__nav--Visibility);
351
367
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-summary--c-options-menu--Display);
352
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-summary--c-options-menu--Visibility);
353
368
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-summary__total-items--Display);
354
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-summary__total-items--Visibility);
355
369
  }
356
370
  .pf-c-pagination.pf-m-display-full-on-lg {
357
371
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-full__nav--Display);
358
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-full__nav--Visibility);
359
372
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
360
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-full--c-options-menu--Visibility);
361
373
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
362
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
374
+ }
375
+ .pf-c-pagination.pf-m-inset-none-on-lg {
376
+ --pf-c-pagination--inset: 0;
377
+ }
378
+ .pf-c-pagination.pf-m-inset-sm-on-lg {
379
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
380
+ }
381
+ .pf-c-pagination.pf-m-inset-md-on-lg {
382
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
383
+ }
384
+ .pf-c-pagination.pf-m-inset-lg-on-lg {
385
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
386
+ }
387
+ .pf-c-pagination.pf-m-inset-xl-on-lg {
388
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
389
+ }
390
+ .pf-c-pagination.pf-m-inset-2xl-on-lg {
391
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
363
392
  }
364
393
  .pf-c-pagination.pf-m-inset-none-on-lg {
365
394
  --pf-c-pagination--inset: 0;
@@ -383,19 +412,31 @@
383
412
  @media (min-width: 1200px) {
384
413
  .pf-c-pagination.pf-m-display-summary-on-xl {
385
414
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
386
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-summary__nav--Visibility);
387
415
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-summary--c-options-menu--Display);
388
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-summary--c-options-menu--Visibility);
389
416
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-summary__total-items--Display);
390
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-summary__total-items--Visibility);
391
417
  }
392
418
  .pf-c-pagination.pf-m-display-full-on-xl {
393
419
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-full__nav--Display);
394
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-full__nav--Visibility);
395
420
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
396
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-full--c-options-menu--Visibility);
397
421
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
398
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
422
+ }
423
+ .pf-c-pagination.pf-m-inset-none-on-xl {
424
+ --pf-c-pagination--inset: 0;
425
+ }
426
+ .pf-c-pagination.pf-m-inset-sm-on-xl {
427
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
428
+ }
429
+ .pf-c-pagination.pf-m-inset-md-on-xl {
430
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
431
+ }
432
+ .pf-c-pagination.pf-m-inset-lg-on-xl {
433
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
434
+ }
435
+ .pf-c-pagination.pf-m-inset-xl-on-xl {
436
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
437
+ }
438
+ .pf-c-pagination.pf-m-inset-2xl-on-xl {
439
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
399
440
  }
400
441
  .pf-c-pagination.pf-m-inset-none-on-xl {
401
442
  --pf-c-pagination--inset: 0;
@@ -419,19 +460,31 @@
419
460
  @media (min-width: 1450px) {
420
461
  .pf-c-pagination.pf-m-display-summary-on-2xl {
421
462
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
422
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-summary__nav--Visibility);
423
463
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-summary--c-options-menu--Display);
424
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-summary--c-options-menu--Visibility);
425
464
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-summary__total-items--Display);
426
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-summary__total-items--Visibility);
427
465
  }
428
466
  .pf-c-pagination.pf-m-display-full-on-2xl {
429
467
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-full__nav--Display);
430
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-full__nav--Visibility);
431
468
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
432
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-full--c-options-menu--Visibility);
433
469
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
434
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
470
+ }
471
+ .pf-c-pagination.pf-m-inset-none-on-2xl {
472
+ --pf-c-pagination--inset: 0;
473
+ }
474
+ .pf-c-pagination.pf-m-inset-sm-on-2xl {
475
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
476
+ }
477
+ .pf-c-pagination.pf-m-inset-md-on-2xl {
478
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
479
+ }
480
+ .pf-c-pagination.pf-m-inset-lg-on-2xl {
481
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
482
+ }
483
+ .pf-c-pagination.pf-m-inset-xl-on-2xl {
484
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
485
+ }
486
+ .pf-c-pagination.pf-m-inset-2xl-on-2xl {
487
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
435
488
  }
436
489
  .pf-c-pagination.pf-m-inset-none-on-2xl {
437
490
  --pf-c-pagination--inset: 0;
@@ -21,11 +21,8 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
21
21
 
22
22
  // nav
23
23
  --pf-c-pagination__nav--Display: none;
24
- --pf-c-pagination__nav--Visibility: hidden;
25
24
  --pf-c-pagination--m-display-summary__nav--Display: none;
26
- --pf-c-pagination--m-display-summary__nav--Visibility: hidden;
27
25
  --pf-c-pagination--m-display-full__nav--Display: inline-flex;
28
- --pf-c-pagination--m-display-full__nav--Visibility: visible;
29
26
 
30
27
  // nav control
31
28
  --pf-c-pagination__nav-control--c-button--PaddingRight: var(--pf-global--spacer--sm);
@@ -52,11 +49,8 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
52
49
 
53
50
  // total items
54
51
  --pf-c-pagination__total-items--Display: block;
55
- --pf-c-pagination__total-items--Visibility: visible;
56
52
  --pf-c-pagination--m-display-summary__total-items--Display: block;
57
- --pf-c-pagination--m-display-summary__total-items--Visibility: visible;
58
53
  --pf-c-pagination--m-display-full__total-items--Display: none;
59
- --pf-c-pagination--m-display-full__total-items--Visibility: hidden;
60
54
 
61
55
  // top
62
56
  --pf-c-pagination--m-sticky--BackgroundColor: var(--pf-global--BackgroundColor--100);
@@ -82,11 +76,8 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
82
76
 
83
77
  // options menu
84
78
  --pf-c-pagination--c-options-menu--Display: none;
85
- --pf-c-pagination--c-options-menu--Visibility: hidden;
86
79
  --pf-c-pagination--m-display-summary--c-options-menu--Display: none;
87
- --pf-c-pagination--m-display-summary--c-options-menu--Visibility: hidden;
88
80
  --pf-c-pagination--m-display-full--c-options-menu--Display: inline-flex;
89
- --pf-c-pagination--m-display-full--c-options-menu--Visibility: visible;
90
81
 
91
82
  @media screen and (min-width: $pf-global--breakpoint--md) {
92
83
  --pf-c-pagination--m-bottom__nav-control--c-button--PaddingTop: var(--pf-c-pagination--m-bottom__nav-control--c-button--md--PaddingTop);
@@ -97,11 +88,8 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
97
88
  --pf-c-pagination--m-bottom__nav-control--c-button--OutlineOffset: 0;
98
89
  --pf-c-pagination--m-bottom--BoxShadow: none;
99
90
  --pf-c-pagination--c-options-menu--Display: inline-flex;
100
- --pf-c-pagination--c-options-menu--Visibility: visible;
101
91
  --pf-c-pagination__nav--Display: inline-flex;
102
- --pf-c-pagination__nav--Visibility: visible;
103
92
  --pf-c-pagination__total-items--Display: none;
104
- --pf-c-pagination__total-items--Visibility: hidden;
105
93
  }
106
94
 
107
95
  @media screen and (min-width: $pf-global--breakpoint--xl) {
@@ -126,7 +114,6 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
126
114
 
127
115
  .pf-c-options-menu {
128
116
  display: var(--pf-c-pagination--c-options-menu--Display);
129
- visibility: var(--pf-c-pagination--c-options-menu--Visibility);
130
117
  }
131
118
 
132
119
  &.pf-m-bottom {
@@ -163,20 +150,17 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
163
150
  .pf-c-pagination__nav-control.pf-m-last,
164
151
  .pf-c-pagination__nav-page-select {
165
152
  display: none;
166
- visibility: hidden;
167
153
  }
168
154
 
169
155
  .pf-c-options-menu {
170
156
  position: absolute;
171
157
  display: block;
172
- visibility: visible;
173
158
  }
174
159
 
175
160
  .pf-c-pagination__nav {
176
161
  display: flex;
177
162
  flex-basis: 100%;
178
163
  justify-content: space-between;
179
- visibility: visible;
180
164
  }
181
165
 
182
166
  @media screen and (min-width: $pf-global--breakpoint--md) {
@@ -192,7 +176,6 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
192
176
  .pf-c-pagination__nav-control.pf-m-last,
193
177
  .pf-c-pagination__nav-page-select {
194
178
  display: block;
195
- visibility: visible;
196
179
  }
197
180
 
198
181
  .pf-c-options-menu {
@@ -242,7 +225,6 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
242
225
  .pf-c-pagination__nav {
243
226
  display: var(--pf-c-pagination__nav--Display);
244
227
  justify-content: flex-end;
245
- visibility: var(--pf-c-pagination__nav--Visibility);
246
228
  }
247
229
 
248
230
  // nav control
@@ -284,7 +266,6 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
284
266
  // display-summary element for total-items items
285
267
  .pf-c-pagination__total-items {
286
268
  display: var(--pf-c-pagination__total-items--Display);
287
- visibility: var(--pf-c-pagination__total-items--Visibility);
288
269
  }
289
270
 
290
271
  // stylelint-disable no-duplicate-selectors
@@ -295,20 +276,20 @@ $pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl",
295
276
  @include pf-apply-breakpoint($breakpoint) {
296
277
  &.pf-m-display-summary#{$breakpoint-name} {
297
278
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
298
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-summary__nav--Visibility);
299
279
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-summary--c-options-menu--Display);
300
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-summary--c-options-menu--Visibility);
301
280
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-summary__total-items--Display);
302
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-summary__total-items--Visibility);
303
281
  }
304
282
 
305
283
  &.pf-m-display-full#{$breakpoint-name} {
306
284
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-full__nav--Display);
307
- --pf-c-pagination__nav--Visibility: var(--pf-c-pagination--m-display-full__nav--Visibility);
308
285
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
309
- --pf-c-pagination--c-options-menu--Visibility: var(--pf-c-pagination--m-display-full--c-options-menu--Visibility);
310
286
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
311
- --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
287
+ }
288
+
289
+ @each $spacer, $spacer-value in $pf-c-pagination--variable-map {
290
+ &.pf-m-inset-#{$spacer}#{$breakpoint-name} {
291
+ --pf-c-pagination--inset: #{$spacer-value};
292
+ }
312
293
  }
313
294
 
314
295
  @each $spacer, $spacer-value in $pf-c-pagination--variable-map {
@@ -172,14 +172,9 @@
172
172
  }
173
173
 
174
174
  :where(.pf-theme-dark) .pf-c-popover {
175
- --pf-c-popover--BoxShadow: none;
176
- --pf-c-popover__arrow--BoxShadow: none;
175
+ --pf-c-popover__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
177
176
  --pf-c-popover__arrow--BackgroundColor: var(--pf-c-popover__content--BackgroundColor);
178
177
  --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--200);
179
178
  --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--100);
180
179
  --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--100);
181
- }
182
- :where(.pf-theme-dark) .pf-c-popover,
183
- :where(.pf-theme-dark) .pf-c-popover .pf-c-popover__arrow {
184
- border: 4px solid var(--pf-global--BorderColor--400);
185
180
  }
@@ -2,16 +2,10 @@
2
2
 
3
3
  @mixin pf-theme-dark-popover() {
4
4
  .pf-c-popover {
5
- --pf-c-popover--BoxShadow: none;
6
- --pf-c-popover__arrow--BoxShadow: none;
5
+ --pf-c-popover__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
7
6
  --pf-c-popover__arrow--BackgroundColor: var(--pf-c-popover__content--BackgroundColor);
8
7
  --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--200);
9
8
  --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--100);
10
9
  --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--100);
11
-
12
- &,
13
- .pf-c-popover__arrow {
14
- border: 4px solid var(--pf-global--BorderColor--400);
15
- }
16
10
  }
17
11
  }
@@ -80,7 +80,6 @@
80
80
  }
81
81
  .pf-c-progress.pf-m-singleline .pf-c-progress__description {
82
82
  display: none;
83
- visibility: hidden;
84
83
  }
85
84
  .pf-c-progress.pf-m-singleline .pf-c-progress__bar {
86
85
  grid-row: 1/2;
@@ -107,7 +107,6 @@
107
107
 
108
108
  .pf-c-progress__description {
109
109
  display: none;
110
- visibility: hidden;
111
110
  }
112
111
 
113
112
  .pf-c-progress__bar {
@@ -15,8 +15,6 @@
15
15
  display: grid;
16
16
  grid-template-columns: auto 1fr;
17
17
  grid-gap: var(--pf-c-radio--GridGap);
18
- align-items: start;
19
- justify-items: start;
20
18
  }
21
19
  .pf-c-radio.pf-m-standalone {
22
20
  --pf-c-radio--GridGap: 0;
@@ -55,6 +53,10 @@
55
53
  margin-top: var(--pf-c-radio__body--MarginTop);
56
54
  }
57
55
 
56
+ .pf-c-radio__label,
57
+ .pf-c-radio__input {
58
+ justify-self: start;
59
+ }
58
60
  label.pf-c-radio, .pf-c-radio__label,
59
61
  .pf-c-radio__input {
60
62
  cursor: pointer;
@@ -16,8 +16,6 @@
16
16
  display: grid;
17
17
  grid-template-columns: auto 1fr;
18
18
  grid-gap: var(--pf-c-radio--GridGap);
19
- align-items: start;
20
- justify-items: start;
21
19
 
22
20
  &.pf-m-standalone {
23
21
  --pf-c-radio--GridGap: 0;
@@ -64,6 +62,8 @@
64
62
 
65
63
  .pf-c-radio__label,
66
64
  .pf-c-radio__input {
65
+ justify-self: start;
66
+
67
67
  @at-root label.pf-c-radio,
68
68
  & {
69
69
  cursor: pointer;
@@ -24,7 +24,7 @@
24
24
  --pf-c-simple-list__title--PaddingLeft: var(--pf-global--spacer--md);
25
25
  --pf-c-simple-list__title--FontSize: var(--pf-global--FontSize--sm);
26
26
  --pf-c-simple-list__title--Color: var(--pf-global--Color--dark-200);
27
- --pf-c-simple-list__title--FontWeight: var(--pf-global--FontWeight--semi-bold);
27
+ --pf-c-simple-list__title--FontWeight: var(--pf-global--FontWeight--bold);
28
28
  --pf-c-simple-list__section--section--MarginTop: var(--pf-global--spacer--sm);
29
29
  }
30
30
 
@@ -27,7 +27,7 @@
27
27
  --pf-c-simple-list__title--PaddingLeft: var(--pf-global--spacer--md);
28
28
  --pf-c-simple-list__title--FontSize: var(--pf-global--FontSize--sm);
29
29
  --pf-c-simple-list__title--Color: var(--pf-global--Color--dark-200);
30
- --pf-c-simple-list__title--FontWeight: var(--pf-global--FontWeight--semi-bold);
30
+ --pf-c-simple-list__title--FontWeight: var(--pf-global--FontWeight--bold);
31
31
 
32
32
  // Simple list section
33
33
  --pf-c-simple-list__section--section--MarginTop: var(--pf-global--spacer--sm);
@@ -7,6 +7,6 @@
7
7
  left: -300%;
8
8
  z-index: var(--pf-c-skip-to-content--ZIndex);
9
9
  }
10
- .pf-c-skip-to-content:focus {
10
+ .pf-c-skip-to-content:focus-within {
11
11
  left: var(--pf-c-skip-to-content--focus--Left);
12
12
  }
@@ -8,7 +8,7 @@
8
8
  left: -300%; // moves off screen
9
9
  z-index: var(--pf-c-skip-to-content--ZIndex);
10
10
 
11
- &:focus {
11
+ &:focus-within {
12
12
  left: var(--pf-c-skip-to-content--focus--Left);
13
13
  }
14
14
  }
@@ -76,7 +76,6 @@
76
76
  }
77
77
  .pf-c-switch__input:not(:checked) ~ .pf-c-switch__toggle .pf-c-switch__toggle-icon {
78
78
  display: none;
79
- visibility: hidden;
80
79
  }
81
80
  .pf-c-switch__input:not(:checked) ~ .pf-m-on {
82
81
  display: none;
@@ -102,7 +102,6 @@
102
102
  ~ .pf-c-switch__toggle {
103
103
  .pf-c-switch__toggle-icon {
104
104
  display: none;
105
- visibility: hidden;
106
105
  }
107
106
  }
108
107
 
@@ -102,7 +102,6 @@
102
102
  }
103
103
  .pf-m-grid.pf-c-table thead {
104
104
  display: none;
105
- visibility: hidden;
106
105
  }
107
106
  .pf-m-grid.pf-c-table tbody {
108
107
  display: block;
@@ -252,7 +251,6 @@
252
251
  }
253
252
  .pf-m-grid.pf-c-table .pf-c-table__expandable-row:not(.pf-m-expanded) {
254
253
  display: none;
255
- visibility: hidden;
256
254
  }
257
255
  .pf-m-grid.pf-c-table .pf-c-table__expandable-row .pf-c-table__expandable-row-content {
258
256
  padding-right: var(--pf-c-table__expandable-row-content--responsive--PaddingRight);
@@ -406,7 +404,6 @@
406
404
  }
407
405
  .pf-m-grid-md.pf-c-table thead {
408
406
  display: none;
409
- visibility: hidden;
410
407
  }
411
408
  .pf-m-grid-md.pf-c-table tbody {
412
409
  display: block;
@@ -556,7 +553,6 @@
556
553
  }
557
554
  .pf-m-grid-md.pf-c-table .pf-c-table__expandable-row:not(.pf-m-expanded) {
558
555
  display: none;
559
- visibility: hidden;
560
556
  }
561
557
  .pf-m-grid-md.pf-c-table .pf-c-table__expandable-row .pf-c-table__expandable-row-content {
562
558
  padding-right: var(--pf-c-table__expandable-row-content--responsive--PaddingRight);
@@ -723,7 +719,6 @@
723
719
  }
724
720
  .pf-m-grid-lg.pf-c-table thead {
725
721
  display: none;
726
- visibility: hidden;
727
722
  }
728
723
  .pf-m-grid-lg.pf-c-table tbody {
729
724
  display: block;
@@ -873,7 +868,6 @@
873
868
  }
874
869
  .pf-m-grid-lg.pf-c-table .pf-c-table__expandable-row:not(.pf-m-expanded) {
875
870
  display: none;
876
- visibility: hidden;
877
871
  }
878
872
  .pf-m-grid-lg.pf-c-table .pf-c-table__expandable-row .pf-c-table__expandable-row-content {
879
873
  padding-right: var(--pf-c-table__expandable-row-content--responsive--PaddingRight);
@@ -1040,7 +1034,6 @@
1040
1034
  }
1041
1035
  .pf-m-grid-xl.pf-c-table thead {
1042
1036
  display: none;
1043
- visibility: hidden;
1044
1037
  }
1045
1038
  .pf-m-grid-xl.pf-c-table tbody {
1046
1039
  display: block;
@@ -1190,7 +1183,6 @@
1190
1183
  }
1191
1184
  .pf-m-grid-xl.pf-c-table .pf-c-table__expandable-row:not(.pf-m-expanded) {
1192
1185
  display: none;
1193
- visibility: hidden;
1194
1186
  }
1195
1187
  .pf-m-grid-xl.pf-c-table .pf-c-table__expandable-row .pf-c-table__expandable-row-content {
1196
1188
  padding-right: var(--pf-c-table__expandable-row-content--responsive--PaddingRight);
@@ -1357,7 +1349,6 @@
1357
1349
  }
1358
1350
  .pf-m-grid-2xl.pf-c-table thead {
1359
1351
  display: none;
1360
- visibility: hidden;
1361
1352
  }
1362
1353
  .pf-m-grid-2xl.pf-c-table tbody {
1363
1354
  display: block;
@@ -1507,7 +1498,6 @@
1507
1498
  }
1508
1499
  .pf-m-grid-2xl.pf-c-table .pf-c-table__expandable-row:not(.pf-m-expanded) {
1509
1500
  display: none;
1510
- visibility: hidden;
1511
1501
  }
1512
1502
  .pf-m-grid-2xl.pf-c-table .pf-c-table__expandable-row .pf-c-table__expandable-row-content {
1513
1503
  padding-right: var(--pf-c-table__expandable-row-content--responsive--PaddingRight);