@patternfly/react-styles 4.92.6 → 5.0.0-alpha.2

package/css/components/ExpandableSection/expandable-section.js

@@ -15,7 +15,6 @@ exports.default = {
     "displayLg": "pf-m-display-lg",
     "indented": "pf-m-indented",
     "active": "pf-m-active",
-    "expandTop": "pf-m-expand-top",
-    "overpassFont": "pf-m-overpass-font"
+    "expandTop": "pf-m-expand-top"
   }
 };

package/css/components/ExpandableSection/expandable-section.mjs

@@ -13,7 +13,6 @@ export default {
     "displayLg": "pf-m-display-lg",
     "indented": "pf-m-indented",
     "active": "pf-m-active",
-    "expandTop": "pf-m-expand-top",
-    "overpassFont": "pf-m-overpass-font"
+    "expandTop": "pf-m-expand-top"
   }
 };

package/css/components/Form/form.css

@@ -369,7 +369,6 @@
 }
 .pf-c-form__helper-text.pf-m-inactive {
   display: none;
-  visibility: hidden;
 }
 .pf-c-form__helper-text.pf-m-hidden {
   visibility: hidden;

package/css/components/InlineEdit/inline-edit.css

@@ -4,7 +4,7 @@
   --pf-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-global--link--Color--hover);
   --pf-c-inline-edit__action--m-icon-group--item--MarginRight: 0;
   --pf-c-inline-edit__group--m-footer--MarginTop: var(--pf-global--spacer--xl);
-  --pf-c-inline-edit__label--m-bold--FontWeight: var(--pf-global--FontWeight--semi-bold);
+  --pf-c-inline-edit__label--m-bold--FontWeight: var(--pf-global--FontWeight--bold);
 }
 
 .pf-c-inline-edit__group {
@@ -43,22 +43,12 @@
 .pf-c-inline-edit__action,
 .pf-c-inline-edit__group.pf-m-action-group {
   display: none;
-  visibility: hidden;
 }
 
 .pf-c-inline-edit__action.pf-m-enable-editable {
   display: inline-block;
-  visibility: visible;
 }
 
-.pf-c-inline-edit.pf-m-inline-editable .pf-c-inline-edit__input,
-.pf-c-inline-edit.pf-m-inline-editable .pf-c-inline-edit__action,
-.pf-c-inline-edit.pf-m-inline-editable .pf-c-inline-edit__group.pf-m-action-group,
-.pf-c-inline-edit .pf-m-inline-editable .pf-c-inline-edit__input,
-.pf-c-inline-edit .pf-m-inline-editable .pf-c-inline-edit__action,
-.pf-c-inline-edit .pf-m-inline-editable .pf-c-inline-edit__group.pf-m-action-group {
-  visibility: visible;
-}
 .pf-c-inline-edit.pf-m-inline-editable .pf-c-inline-edit__input,
 .pf-c-inline-edit .pf-m-inline-editable .pf-c-inline-edit__input {
   display: block;
@@ -76,7 +66,6 @@
 .pf-c-inline-edit .pf-m-inline-editable .pf-c-inline-edit__value,
 .pf-c-inline-edit .pf-m-inline-editable .pf-c-inline-edit__action.pf-m-enable-editable {
   display: none;
-  visibility: hidden;
 }
 
 .pf-c-inline-edit__label + .pf-c-inline-edit__action.pf-m-enable > .pf-c-button {

package/css/components/JumpLinks/jump-links.css

@@ -1,6 +1,5 @@
 .pf-c-jump-links {
   --pf-c-jump-links__list--Display: flex;
-  --pf-c-jump-links__list--Visibility: visible;
   --pf-c-jump-links__list--PaddingTop: 0;
   --pf-c-jump-links__list--PaddingRight: var(--pf-global--spacer--md);
   --pf-c-jump-links__list--PaddingBottom: 0;
@@ -43,14 +42,12 @@
   --pf-c-jump-links__item--m-current__link-text--Color: var(--pf-global--Color--100);
   --pf-c-jump-links__label--MarginBottom: var(--pf-global--spacer--md);
   --pf-c-jump-links__label--Display: block;
-  --pf-c-jump-links__label--Visibility: visible;
   --pf-c-jump-links__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element));
   --pf-c-jump-links__toggle--MarginBottom--base: calc(-1 * var(--pf-global--spacer--form-element));
   --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links__toggle--MarginBottom--base);
   --pf-c-jump-links--m-expanded__toggle--MarginBottom: calc(var(--pf-c-jump-links__toggle--MarginBottom--base) + var(--pf-global--spacer--md));
   --pf-c-jump-links__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
   --pf-c-jump-links__toggle--Display: none;
-  --pf-c-jump-links__toggle--Visibility: hidden;
   --pf-c-jump-links__toggle-icon--Color: currentcolor;
   --pf-c-jump-links__toggle-icon--Transition: var(--pf-global--Transition);
   --pf-c-jump-links__toggle-icon--Rotate: 0;
@@ -80,113 +77,76 @@
 }
 .pf-c-jump-links.pf-m-expandable {
   --pf-c-jump-links__list--Display: none;
-  --pf-c-jump-links__list--Visibility: hidden;
   --pf-c-jump-links__toggle--Display: block;
-  --pf-c-jump-links__toggle--Visibility: visible;
   --pf-c-jump-links__label--Display: none;
-  --pf-c-jump-links__label--Visibility: hidden;
 }
 .pf-c-jump-links.pf-m-non-expandable {
   --pf-c-jump-links__list--Display: flex;
-  --pf-c-jump-links__list--Visibility: visible;
   --pf-c-jump-links__toggle--Display: none;
-  --pf-c-jump-links__toggle--Visibility: hidden;
   --pf-c-jump-links__label--Display: block;
-  --pf-c-jump-links__label--Visibility: visible;
 }
 @media (min-width: 576px) {
   .pf-c-jump-links.pf-m-expandable-on-sm {
     --pf-c-jump-links__list--Display: none;
-    --pf-c-jump-links__list--Visibility: hidden;
     --pf-c-jump-links__toggle--Display: block;
-    --pf-c-jump-links__toggle--Visibility: visible;
     --pf-c-jump-links__label--Display: none;
-    --pf-c-jump-links__label--Visibility: hidden;
   }
   .pf-c-jump-links.pf-m-non-expandable-on-sm {
     --pf-c-jump-links__list--Display: flex;
-    --pf-c-jump-links__list--Visibility: visible;
     --pf-c-jump-links__toggle--Display: none;
-    --pf-c-jump-links__toggle--Visibility: hidden;
     --pf-c-jump-links__label--Display: block;
-    --pf-c-jump-links__label--Visibility: visible;
   }
 }
 @media (min-width: 768px) {
   .pf-c-jump-links.pf-m-expandable-on-md {
     --pf-c-jump-links__list--Display: none;
-    --pf-c-jump-links__list--Visibility: hidden;
     --pf-c-jump-links__toggle--Display: block;
-    --pf-c-jump-links__toggle--Visibility: visible;
     --pf-c-jump-links__label--Display: none;
-    --pf-c-jump-links__label--Visibility: hidden;
   }
   .pf-c-jump-links.pf-m-non-expandable-on-md {
     --pf-c-jump-links__list--Display: flex;
-    --pf-c-jump-links__list--Visibility: visible;
     --pf-c-jump-links__toggle--Display: none;
-    --pf-c-jump-links__toggle--Visibility: hidden;
     --pf-c-jump-links__label--Display: block;
-    --pf-c-jump-links__label--Visibility: visible;
   }
 }
 @media (min-width: 992px) {
   .pf-c-jump-links.pf-m-expandable-on-lg {
     --pf-c-jump-links__list--Display: none;
-    --pf-c-jump-links__list--Visibility: hidden;
     --pf-c-jump-links__toggle--Display: block;
-    --pf-c-jump-links__toggle--Visibility: visible;
     --pf-c-jump-links__label--Display: none;
-    --pf-c-jump-links__label--Visibility: hidden;
   }
   .pf-c-jump-links.pf-m-non-expandable-on-lg {
     --pf-c-jump-links__list--Display: flex;
-    --pf-c-jump-links__list--Visibility: visible;
     --pf-c-jump-links__toggle--Display: none;
-    --pf-c-jump-links__toggle--Visibility: hidden;
     --pf-c-jump-links__label--Display: block;
-    --pf-c-jump-links__label--Visibility: visible;
   }
 }
 @media (min-width: 1200px) {
   .pf-c-jump-links.pf-m-expandable-on-xl {
     --pf-c-jump-links__list--Display: none;
-    --pf-c-jump-links__list--Visibility: hidden;
     --pf-c-jump-links__toggle--Display: block;
-    --pf-c-jump-links__toggle--Visibility: visible;
     --pf-c-jump-links__label--Display: none;
-    --pf-c-jump-links__label--Visibility: hidden;
   }
   .pf-c-jump-links.pf-m-non-expandable-on-xl {
     --pf-c-jump-links__list--Display: flex;
-    --pf-c-jump-links__list--Visibility: visible;
     --pf-c-jump-links__toggle--Display: none;
-    --pf-c-jump-links__toggle--Visibility: hidden;
     --pf-c-jump-links__label--Display: block;
-    --pf-c-jump-links__label--Visibility: visible;
   }
 }
 @media (min-width: 1450px) {
   .pf-c-jump-links.pf-m-expandable-on-2xl {
     --pf-c-jump-links__list--Display: none;
-    --pf-c-jump-links__list--Visibility: hidden;
     --pf-c-jump-links__toggle--Display: block;
-    --pf-c-jump-links__toggle--Visibility: visible;
     --pf-c-jump-links__label--Display: none;
-    --pf-c-jump-links__label--Visibility: hidden;
   }
   .pf-c-jump-links.pf-m-non-expandable-on-2xl {
     --pf-c-jump-links__list--Display: flex;
-    --pf-c-jump-links__list--Visibility: visible;
     --pf-c-jump-links__toggle--Display: none;
-    --pf-c-jump-links__toggle--Visibility: hidden;
     --pf-c-jump-links__label--Display: block;
-    --pf-c-jump-links__label--Visibility: visible;
   }
 }
 .pf-c-jump-links.pf-m-expanded {
   --pf-c-jump-links__list--Display: flex;
-  --pf-c-jump-links__list--Visibility: visible;
   --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links--m-expanded__toggle--MarginBottom);
   --pf-c-jump-links__toggle-icon--Rotate: var(--pf-c-jump-links--m-expanded__toggle-icon--Rotate);
   --pf-c-jump-links__toggle-icon--Color: var(--pf-c-jump-links--m-expanded__toggle-icon--Color);
@@ -200,7 +160,6 @@
   padding-right: var(--pf-c-jump-links__list--PaddingRight);
   padding-bottom: var(--pf-c-jump-links__list--PaddingBottom);
   padding-left: var(--pf-c-jump-links__list--PaddingLeft);
-  visibility: var(--pf-c-jump-links__list--Visibility);
 }
 .pf-c-jump-links__list::before {
   position: absolute;
@@ -269,7 +228,6 @@
 .pf-c-jump-links__label {
   display: var(--pf-c-jump-links__label--Display);
   margin-bottom: var(--pf-c-jump-links__label--MarginBottom);
-  visibility: var(--pf-c-jump-links__label--Visibility);
 }
 
 .pf-c-jump-links__main {
@@ -282,7 +240,6 @@
   margin-top: var(--pf-c-jump-links__toggle--MarginTop);
   margin-bottom: var(--pf-c-jump-links__toggle--MarginBottom);
   margin-left: var(--pf-c-jump-links__toggle--MarginLeft);
-  visibility: var(--pf-c-jump-links__toggle--Visibility);
 }
 .pf-c-jump-links__toggle .pf-c-button {
   display: flex;

package/css/components/Label/label.css

@@ -311,9 +311,6 @@
   --pf-c-label--m-editable--TextDecoration: var(--pf-c-label--m-editable--m-editable-active--TextDecoration);
   --pf-c-label--BackgroundColor: var(--pf-c-label--m-editable--m-editable-active--BackgroundColor);
 }
-.pf-c-label.pf-m-editable-active .pf-c-button {
-  visibility: hidden;
-}
 .pf-c-label .pf-c-button {
   --pf-c-button--FontSize: var(--pf-c-label__c-button--FontSize);
   --pf-c-button--PaddingTop: var(--pf-c-label__c-button--PaddingTop);

package/css/components/LabelGroup/label-group.css

@@ -1,6 +1,16 @@
 .pf-c-label-group {
-  --pf-c-label-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
-  --pf-c-label-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
+  --pf-c-label-group--RowGap: var(--pf-global--spacer--sm);
+  --pf-c-label-group--ColumnGap: 0;
+  --pf-c-label-group-m-vertical--RowGap: var(--pf-global--spacer--sm);
+  --pf-c-label-group-m-vertical--ColumnGap: var(--pf-global--spacer--sm);
+  --pf-c-label-group__main--RowGap: var(--pf-global--spacer--xs);
+  --pf-c-label-group__main--ColumnGap: var(--pf-global--spacer--sm);
+  --pf-c-label-group-m-vertical__main--RowGap: var(--pf-global--spacer--sm);
+  --pf-c-label-group-m-vertical__main--ColumnGap: var(--pf-global--spacer--xs);
+  --pf-c-label-group__list--RowGap: var(--pf-global--spacer--xs);
+  --pf-c-label-group__list--ColumnGap: var(--pf-global--spacer--xs);
+  --pf-c-label-group-m-vertical__list--RowGap: var(--pf-global--spacer--xs);
+  --pf-c-label-group-m-vertical__list--ColumnGap: var(--pf-global--spacer--xs);
   --pf-c-label-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
   --pf-c-label-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
   --pf-c-label-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
@@ -10,20 +20,14 @@
   --pf-c-label-group--m-category--BorderWidth: var(--pf-global--BorderWidth--sm);
   --pf-c-label-group--m-category--BorderColor: var(--pf-global--BorderColor--300);
   --pf-c-label-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--100);
-  --pf-c-label-group__label--MarginRight: var(--pf-global--spacer--sm);
-  --pf-c-label-group__label--MarginBottom: 0;
-  --pf-c-label-group--m-vertical__label--MarginBottom: var(--pf-global--spacer--sm);
   --pf-c-label-group__label--FontSize: var(--pf-global--FontSize--sm);
   --pf-c-label-group__label--MaxWidth: 18ch;
   --pf-c-label-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
   --pf-c-label-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
   --pf-c-label-group--m-vertical__close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
   --pf-c-label-group--m-vertical__close--MarginRight: calc(var(--pf-global--spacer--form-element) * -1);
-  --pf-c-label-group--m-vertical__close--MarginLeft: var(--pf-global--spacer--sm);
   --pf-c-label-group--m-vertical__close--c-button--PaddingRight: var(--pf-global--spacer--sm);
   --pf-c-label-group--m-vertical__close--c-button--PaddingLeft: var(--pf-global--spacer--sm);
-  --pf-c-label-group__list-item--MarginRight: var(--pf-global--spacer--xs);
-  --pf-c-label-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
   --pf-c-label-group__textarea--MinWidth: 12.5rem;
   --pf-c-label-group__textarea--PaddingTop: 0.125rem;
   --pf-c-label-group__textarea--PaddingRight: var(--pf-global--spacer--xs);
@@ -31,6 +35,8 @@
   --pf-c-label-group__textarea--PaddingLeft: var(--pf-global--spacer--xs);
   display: inline-flex;
   align-items: center;
+  row-gap: var(--pf-c-label-group--RowGap);
+  column-gap: var(--pf-c-label-group--ColumnGap);
 }
 .pf-c-label-group.pf-m-category {
   padding-top: var(--pf-c-label-group--m-category--PaddingTop);
@@ -42,11 +48,12 @@
   border-radius: var(--pf-c-label-group--m-category--BorderRadius);
 }
 .pf-c-label-group.pf-m-vertical {
-  --pf-c-label-group__list--MarginRight: 0;
-  --pf-c-label-group__list--MarginBottom: 0;
-  --pf-c-label-group__list-item--MarginRight: 0;
-  --pf-c-label-group__label--MarginRight: 0;
-  --pf-c-label-group__label--MarginBottom: var(--pf-c-label-group--m-vertical__label--MarginBottom);
+  --pf-c-label-group--RowGap: var(--pf-c-label-group-m-vertical--RowGap);
+  --pf-c-label-group--ColumnGap: var(--pf-c-label-group-m-vertical--ColumnGap);
+  --pf-c-label-group__main--RowGap: var(--pf-c-label-group-m-vertical__main--RowGap);
+  --pf-c-label-group__main--ColumnGap: var(--pf-c-label-group-m-vertical__main--ColumnGap);
+  --pf-c-label-group__list--RowGap: var(--pf-c-label-group-m-vertical__list--RowGap);
+  --pf-c-label-group__list--ColumnGap: var(--pf-c-label-group-m-vertical__list--ColumnGap);
   --pf-c-label-group__close--MarginTop: var(--pf-c-label-group--m-vertical__close--MarginTop);
   --pf-c-label-group__close--MarginLeft: var(--pf-c-label-group--m-vertical__close--MarginLeft);
   --pf-c-label-group__close--MarginBottom: 0;
@@ -63,9 +70,6 @@
 .pf-c-label-group.pf-m-vertical .pf-c-label-group__main {
   flex-direction: column;
 }
-.pf-c-label-group.pf-m-vertical .pf-c-label-group__list-item:last-child {
-  --pf-c-label-group__list-item--MarginBottom: 0;
-}
 .pf-c-label-group.pf-m-vertical .pf-c-label-group__close .pf-c-button {
   --pf-c-button--PaddingLeft: var(--pf-c-label-group--m-vertical__close--c-button--PaddingLeft);
   --pf-c-button--PaddingRight: var(--pf-c-label-group--m-vertical__close--c-button--PaddingRight);
@@ -87,19 +91,19 @@
   flex: 1;
   flex-wrap: wrap;
   align-items: baseline;
+  row-gap: var(--pf-c-label-group__main--RowGap);
+  column-gap: var(--pf-c-label-group__main--ColumnGap);
 }
 
 .pf-c-label-group__list {
   display: inline-flex;
   flex-wrap: wrap;
-  margin-right: var(--pf-c-label-group__list--MarginRight);
-  margin-bottom: var(--pf-c-label-group__list--MarginBottom);
+  row-gap: var(--pf-c-label-group__list--RowGap);
+  column-gap: var(--pf-c-label-group__list--ColumnGap);
 }
 
 .pf-c-label-group__list-item {
   display: inline-flex;
-  margin-right: var(--pf-c-label-group__list-item--MarginRight);
-  margin-bottom: var(--pf-c-label-group__list-item--MarginBottom);
 }
 
 .pf-c-label-group__label {
@@ -107,12 +111,12 @@
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: var(--pf-c-label-group__label--MaxWidth);
-  margin-right: var(--pf-c-label-group__label--MarginRight);
-  margin-bottom: var(--pf-c-label-group__label--MarginBottom);
   font-size: var(--pf-c-label-group__label--FontSize);
 }
 
 .pf-c-label-group__close {
+  display: flex;
+  align-self: start;
   margin-top: var(--pf-c-label-group__close--MarginTop);
   margin-right: var(--pf-c-label-group__close--MarginRight);
   margin-bottom: var(--pf-c-label-group__close--MarginBottom);

package/css/components/Menu/menu.css

@@ -9,66 +9,51 @@
 }
 
 .pf-c-menu__group, .pf-c-menu__list-item, .pf-c-menu__list {
-  --pf-hidden-visible--visible--Visibility: visible;
   --pf-hidden-visible--hidden--Display: none;
-  --pf-hidden-visible--hidden--Visibility: hidden;
   --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-  --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   display: var(--pf-hidden-visible--Display);
-  visibility: var(--pf-hidden-visible--Visibility);
 }
 .pf-m-hidden.pf-c-menu__group, .pf-m-hidden.pf-c-menu__list-item, .pf-m-hidden.pf-c-menu__list {
   --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-  --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
 }
 @media screen and (min-width: 576px) {
   .pf-m-hidden-on-sm.pf-c-menu__group, .pf-m-hidden-on-sm.pf-c-menu__list-item, .pf-m-hidden-on-sm.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-sm.pf-c-menu__group, .pf-m-visible-on-sm.pf-c-menu__list-item, .pf-m-visible-on-sm.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 @media screen and (min-width: 768px) {
   .pf-m-hidden-on-md.pf-c-menu__group, .pf-m-hidden-on-md.pf-c-menu__list-item, .pf-m-hidden-on-md.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-md.pf-c-menu__group, .pf-m-visible-on-md.pf-c-menu__list-item, .pf-m-visible-on-md.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 @media screen and (min-width: 992px) {
   .pf-m-hidden-on-lg.pf-c-menu__group, .pf-m-hidden-on-lg.pf-c-menu__list-item, .pf-m-hidden-on-lg.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-lg.pf-c-menu__group, .pf-m-visible-on-lg.pf-c-menu__list-item, .pf-m-visible-on-lg.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 @media screen and (min-width: 1200px) {
   .pf-m-hidden-on-xl.pf-c-menu__group, .pf-m-hidden-on-xl.pf-c-menu__list-item, .pf-m-hidden-on-xl.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-xl.pf-c-menu__group, .pf-m-visible-on-xl.pf-c-menu__list-item, .pf-m-visible-on-xl.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 @media screen and (min-width: 1450px) {
   .pf-m-hidden-on-2xl.pf-c-menu__group, .pf-m-hidden-on-2xl.pf-c-menu__list-item, .pf-m-hidden-on-2xl.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-2xl.pf-c-menu__group, .pf-m-visible-on-2xl.pf-c-menu__list-item, .pf-m-visible-on-2xl.pf-c-menu__list {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 
@@ -305,7 +290,6 @@
 }
 .pf-c-menu.pf-m-drilldown .pf-c-menu__list-item:not(.pf-m-current-path) .pf-c-menu {
   display: none;
-  visibility: hidden;
 }
 .pf-c-menu.pf-m-drilldown .pf-c-menu__item {
   outline-offset: var(--pf-c-menu__item--OutlineOffset);

package/css/components/NotificationDrawer/notification-drawer.css

@@ -100,6 +100,7 @@
 }
 
 .pf-c-notification-drawer__body {
+  flex: 1;
   overflow-y: auto;
   box-shadow: var(--pf-c-notification-drawer__body--ZIndex);
 }

package/css/components/Page/page.css

@@ -40,66 +40,51 @@
 }
 
 .pf-c-page__header-tools-item, .pf-c-page__header-tools-group {
-  --pf-hidden-visible--visible--Visibility: visible;
   --pf-hidden-visible--hidden--Display: none;
-  --pf-hidden-visible--hidden--Visibility: hidden;
   --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-  --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   display: var(--pf-hidden-visible--Display);
-  visibility: var(--pf-hidden-visible--Visibility);
 }
 .pf-m-hidden.pf-c-page__header-tools-item, .pf-m-hidden.pf-c-page__header-tools-group {
   --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-  --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
 }
 @media screen and (min-width: 576px) {
   .pf-m-hidden-on-sm.pf-c-page__header-tools-item, .pf-m-hidden-on-sm.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-sm.pf-c-page__header-tools-item, .pf-m-visible-on-sm.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 @media screen and (min-width: 768px) {
   .pf-m-hidden-on-md.pf-c-page__header-tools-item, .pf-m-hidden-on-md.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-md.pf-c-page__header-tools-item, .pf-m-visible-on-md.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 @media screen and (min-width: 992px) {
   .pf-m-hidden-on-lg.pf-c-page__header-tools-item, .pf-m-hidden-on-lg.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-lg.pf-c-page__header-tools-item, .pf-m-visible-on-lg.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 @media screen and (min-width: 1200px) {
   .pf-m-hidden-on-xl.pf-c-page__header-tools-item, .pf-m-hidden-on-xl.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-xl.pf-c-page__header-tools-item, .pf-m-visible-on-xl.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }
 @media screen and (min-width: 1450px) {
   .pf-m-hidden-on-2xl.pf-c-page__header-tools-item, .pf-m-hidden-on-2xl.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
   }
   .pf-m-visible-on-2xl.pf-c-page__header-tools-item, .pf-m-visible-on-2xl.pf-c-page__header-tools-group {
     --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
-    --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
   }
 }