@patternfly/patternfly 5.0.0-alpha.1 → 5.0.0-alpha.10

package/components/Pagination/pagination.css

@@ -7,6 +7,11 @@
 }
 
 .pf-c-pagination {
+  --pf-c-pagination--inset: 0;
+  --pf-c-pagination--PaddingRight: var(--pf-c-pagination--inset);
+  --pf-c-pagination--PaddingLeft: var(--pf-c-pagination--inset);
+  --pf-c-pagination--m-page-insets--inset: var(--pf-global--spacer--md);
+  --pf-c-pagination--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
   --pf-c-pagination--child--MarginRight: var(--pf-global--spacer--lg);
   --pf-c-pagination--m-bottom--child--MarginRight: 0;
   --pf-c-pagination--m-bottom--child--md--MarginRight: var(--pf-global--spacer--lg);
@@ -62,6 +67,8 @@
   flex-wrap: wrap;
   align-items: center;
   justify-content: flex-end;
+  padding-right: var(--pf-c-pagination--PaddingRight);
+  padding-left: var(--pf-c-pagination--PaddingLeft);
 }
 @media screen and (min-width: 768px) {
   .pf-c-pagination {
@@ -81,6 +88,8 @@
   .pf-c-pagination {
     --pf-c-pagination--m-bottom--md--PaddingRight: var(--pf-c-pagination--m-bottom--xl--PaddingRight);
     --pf-c-pagination--m-bottom--md--PaddingLeft: var(--pf-c-pagination--m-bottom--xl--PaddingLeft);
+    --pf-c-pagination__scroll-button--Width: var(--pf-c-pagination__scroll-button--xl--Width);
+    --pf-c-pagination--m-page-insets--inset: var(--pf-c-pagination--m-page-insets--xl--inset);
   }
 }
 .pf-c-pagination > *:not(:last-child):not(.pf-c-pagination__total-items) {
@@ -171,6 +180,9 @@
 .pf-c-pagination.pf-m-compact {
   --pf-c-pagination--child--MarginRight: var(--pf-c-pagination--m-compact--child--MarginRight);
 }
+.pf-c-pagination.pf-m-page-insets {
+  --pf-c-pagination--inset: var(--pf-c-pagination--m-page-insets--inset);
+}
 
 .pf-c-pagination__nav {
   display: var(--pf-c-pagination__nav--Display);
@@ -217,6 +229,42 @@
   --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
   --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
 }
+.pf-c-pagination.pf-m-inset-none {
+  --pf-c-pagination--inset: 0;
+}
+.pf-c-pagination.pf-m-inset-sm {
+  --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+}
+.pf-c-pagination.pf-m-inset-md {
+  --pf-c-pagination--inset: var(--pf-global--spacer--md);
+}
+.pf-c-pagination.pf-m-inset-lg {
+  --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+}
+.pf-c-pagination.pf-m-inset-xl {
+  --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+}
+.pf-c-pagination.pf-m-inset-2xl {
+  --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+}
+.pf-c-pagination.pf-m-inset-none {
+  --pf-c-pagination--inset: 0;
+}
+.pf-c-pagination.pf-m-inset-sm {
+  --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+}
+.pf-c-pagination.pf-m-inset-md {
+  --pf-c-pagination--inset: var(--pf-global--spacer--md);
+}
+.pf-c-pagination.pf-m-inset-lg {
+  --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+}
+.pf-c-pagination.pf-m-inset-xl {
+  --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+}
+.pf-c-pagination.pf-m-inset-2xl {
+  --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+}
 @media (min-width: 576px) {
   .pf-c-pagination.pf-m-display-summary-on-sm {
     --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
@@ -228,6 +276,42 @@
     --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
     --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
   }
+  .pf-c-pagination.pf-m-inset-none-on-sm {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
+  .pf-c-pagination.pf-m-inset-none-on-sm {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-sm {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
 }
 @media (min-width: 768px) {
   .pf-c-pagination.pf-m-display-summary-on-md {
@@ -240,6 +324,42 @@
     --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
     --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
   }
+  .pf-c-pagination.pf-m-inset-none-on-md {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
+  .pf-c-pagination.pf-m-inset-none-on-md {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-md {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
 }
 @media (min-width: 992px) {
   .pf-c-pagination.pf-m-display-summary-on-lg {
@@ -252,6 +372,42 @@
     --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
     --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
   }
+  .pf-c-pagination.pf-m-inset-none-on-lg {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
+  .pf-c-pagination.pf-m-inset-none-on-lg {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-lg {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
 }
 @media (min-width: 1200px) {
   .pf-c-pagination.pf-m-display-summary-on-xl {
@@ -264,6 +420,42 @@
     --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
     --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
   }
+  .pf-c-pagination.pf-m-inset-none-on-xl {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
+  .pf-c-pagination.pf-m-inset-none-on-xl {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
 }
 @media (min-width: 1450px) {
   .pf-c-pagination.pf-m-display-summary-on-2xl {
@@ -276,6 +468,42 @@
     --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
     --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
   }
+  .pf-c-pagination.pf-m-inset-none-on-2xl {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
+  .pf-c-pagination.pf-m-inset-none-on-2xl {
+    --pf-c-pagination--inset: 0;
+  }
+  .pf-c-pagination.pf-m-inset-sm-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--sm);
+  }
+  .pf-c-pagination.pf-m-inset-md-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--md);
+  }
+  .pf-c-pagination.pf-m-inset-lg-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--lg);
+  }
+  .pf-c-pagination.pf-m-inset-xl-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--xl);
+  }
+  .pf-c-pagination.pf-m-inset-2xl-on-2xl {
+    --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
+  }
 }
 
 :where(.pf-theme-dark) .pf-c-pagination {

package/components/Pagination/pagination.scss

@@ -1,6 +1,15 @@
 $pf-c-pagination--breakpoint-map: build-breakpoint-map();
+$pf-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl");
 
 .pf-c-pagination {
+  --pf-c-pagination--inset: 0;
+  --pf-c-pagination--PaddingRight: var(--pf-c-pagination--inset);
+  --pf-c-pagination--PaddingLeft: var(--pf-c-pagination--inset);
+
+  // Page insets
+  --pf-c-pagination--m-page-insets--inset: var(--pf-global--spacer--md);
+  --pf-c-pagination--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
+
   // children
   --pf-c-pagination--child--MarginRight: var(--pf-global--spacer--lg);
   --pf-c-pagination--m-bottom--child--MarginRight: 0;
@@ -86,12 +95,16 @@ $pf-c-pagination--breakpoint-map: build-breakpoint-map();
   @media screen and (min-width: $pf-global--breakpoint--xl) {
     --pf-c-pagination--m-bottom--md--PaddingRight: var(--pf-c-pagination--m-bottom--xl--PaddingRight);
     --pf-c-pagination--m-bottom--md--PaddingLeft: var(--pf-c-pagination--m-bottom--xl--PaddingLeft);
+    --pf-c-pagination__scroll-button--Width: var(--pf-c-pagination__scroll-button--xl--Width);
+    --pf-c-pagination--m-page-insets--inset: var(--pf-c-pagination--m-page-insets--xl--inset);
   }
 
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: flex-end;
+  padding-right: var(--pf-c-pagination--PaddingRight);
+  padding-left: var(--pf-c-pagination--PaddingLeft);
 
   // stylelint-disable selector-not-notation
   // update to single :not() in breaking change
@@ -194,7 +207,6 @@ $pf-c-pagination--breakpoint-map: build-breakpoint-map();
     }
   }
 
-
   .pf-c-options-menu__toggle {
     font-size: var(--pf-c-pagination--c-options-menu__toggle--FontSize);
   }
@@ -202,8 +214,13 @@ $pf-c-pagination--breakpoint-map: build-breakpoint-map();
   &.pf-m-compact {
     --pf-c-pagination--child--MarginRight: var(--pf-c-pagination--m-compact--child--MarginRight);
   }
+
+  &.pf-m-page-insets {
+    --pf-c-pagination--inset: var(--pf-c-pagination--m-page-insets--inset);
+  }
 }
 
+
 // nav
 .pf-c-pagination__nav {
   display: var(--pf-c-pagination__nav--Display);
@@ -268,6 +285,18 @@ $pf-c-pagination--breakpoint-map: build-breakpoint-map();
         --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
         --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
       }
+
+      @each $spacer, $spacer-value in $pf-c-pagination--variable-map {
+        &.pf-m-inset-#{$spacer}#{$breakpoint-name} {
+          --pf-c-pagination--inset: #{$spacer-value};
+        }
+      }
+
+      @each $spacer, $spacer-value in $pf-c-pagination--variable-map {
+        &.pf-m-inset-#{$spacer}#{$breakpoint-name} {
+          --pf-c-pagination--inset: #{$spacer-value};
+        }
+      }
     }
   }
 }

package/components/Popover/popover.css

@@ -172,14 +172,9 @@
 }
 
 :where(.pf-theme-dark) .pf-c-popover {
-  --pf-c-popover--BoxShadow: none;
-  --pf-c-popover__arrow--BoxShadow: none;
+  --pf-c-popover__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
   --pf-c-popover__arrow--BackgroundColor: var(--pf-c-popover__content--BackgroundColor);
   --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--200);
   --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--100);
   --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--100);
-}
-:where(.pf-theme-dark) .pf-c-popover,
-:where(.pf-theme-dark) .pf-c-popover .pf-c-popover__arrow {
-  border: 4px solid var(--pf-global--BorderColor--400);
 }

package/components/Popover/themes/dark/popover.scss

@@ -2,16 +2,10 @@
 
 @mixin pf-theme-dark-popover() {
   .pf-c-popover {
-    --pf-c-popover--BoxShadow: none;
-    --pf-c-popover__arrow--BoxShadow: none;
+    --pf-c-popover__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
     --pf-c-popover__arrow--BackgroundColor: var(--pf-c-popover__content--BackgroundColor);
     --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--200);
     --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--100);
     --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--100);
-
-    &,
-    .pf-c-popover__arrow {
-      border: 4px solid var(--pf-global--BorderColor--400);
-    }
   }
 }

package/components/Slider/slider.css

@@ -182,13 +182,6 @@
   z-index: var(--pf-c-slider__value--m-floating--ZIndex);
   transform: translate(var(--pf-c-slider__value--m-floating--TranslateX), var(--pf-c-slider__value--m-floating--TranslateY));
 }
-.pf-c-slider__value.pf-m-floating .pf-c-input-group {
-  align-items: center;
-}
-.pf-c-slider__value.pf-m-floating .pf-c-input-group__text {
-  position: absolute;
-  left: 100%;
-}
 .pf-c-slider__value .pf-c-form-control {
   width: var(--pf-c-slider__value--c-form-control--Width);
 }

package/components/Slider/slider.scss

@@ -218,15 +218,6 @@
     left: var(--pf-c-slider__value--m-floating--Left);
     z-index: var(--pf-c-slider__value--m-floating--ZIndex);
     transform: translate(var(--pf-c-slider__value--m-floating--TranslateX), var(--pf-c-slider__value--m-floating--TranslateY));
-
-    .pf-c-input-group {
-      align-items: center;
-    }
-
-    .pf-c-input-group__text {
-      position: absolute;
-      left: 100%;
-    }
   }
 
   .pf-c-form-control {

package/components/Toolbar/toolbar.css

@@ -54,13 +54,17 @@
   --pf-c-toolbar--PaddingBottom: var(--pf-global--spacer--md);
   --pf-c-toolbar__item--Display: block;
   --pf-c-toolbar__item--MinWidth--base: auto;
+  --pf-c-toolbar__item--AlignSelf: auto;
   --pf-c-toolbar__group--Display: flex;
+  --pf-c-toolbar__group--AlignItems: baseline;
+  --pf-c-toolbar__group--AlignSelf: auto;
   --pf-c-toolbar--m-sticky--ZIndex: var(--pf-global--ZIndex--xs);
   --pf-c-toolbar--m-sticky--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
   --pf-c-toolbar__content--Display: flex;
   --pf-c-toolbar__content--PaddingRight: var(--pf-global--spacer--md);
   --pf-c-toolbar__content--PaddingLeft: var(--pf-global--spacer--md);
   --pf-c-toolbar__content-section--Display: flex;
+  --pf-c-toolbar__content-section--AlignItems: baseline;
   --pf-c-toolbar--m-page-insets--inset: var(--pf-global--spacer--md);
   --pf-c-toolbar--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
   --pf-c-toolbar__expandable-content--Display: grid;
@@ -182,9 +186,22 @@
 .pf-c-toolbar__group {
   --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--spacer);
   --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__group--Display);
-  align-items: center;
+  align-items: var(--pf-c-toolbar__group--AlignItems);
+  align-self: var(--pf-c-toolbar__group--AlignSelf);
   margin-right: var(--pf-c-toolbar--spacer);
 }
+.pf-c-toolbar__group.pf-m-align-items-center {
+  align-items: center;
+}
+.pf-c-toolbar__group.pf-m-align-items-baseline {
+  align-items: baseline;
+}
+.pf-c-toolbar__group.pf-m-align-self-center {
+  align-self: center;
+}
+.pf-c-toolbar__group.pf-m-align-self-baseline {
+  align-self: baseline;
+}
 .pf-c-toolbar__group.pf-m-button-group {
   --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-button-group--spacer);
 }
@@ -225,6 +242,7 @@
   --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width);
   --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth);
   --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__item--Display);
+  align-self: var(--pf-c-toolbar__item--AlignSelf);
   width: var(--pf-c-toolbar__item--Width--base);
   min-width: var(--pf-c-toolbar__item--MinWidth--base);
   margin-right: var(--pf-c-toolbar--spacer);
@@ -279,6 +297,12 @@
     --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-2xl, var(--pf-c-toolbar__item--MinWidth-on-xl, var(--pf-c-toolbar__item--MinWidth-on-lg, var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth))))));
   }
 }
+.pf-c-toolbar__item.pf-m-align-self-center {
+  align-self: center;
+}
+.pf-c-toolbar__item.pf-m-align-self-baseline {
+  align-self: baseline;
+}
 .pf-c-toolbar__item.pf-m-overflow-menu {
   --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-overflow-menu--spacer);
 }
@@ -323,20 +347,24 @@
 .pf-c-toolbar__content,
 .pf-c-toolbar__content-section {
   flex-wrap: wrap;
-  align-items: center;
 }
 
 .pf-c-toolbar__content {
   --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__content--Display);
   position: relative;
+  align-items: center;
   padding-right: var(--pf-c-toolbar__content--PaddingRight);
   padding-left: var(--pf-c-toolbar__content--PaddingLeft);
 }
 
 .pf-c-toolbar__content-section {
   --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__content-section--Display);
+  align-items: var(--pf-c-toolbar__content-section--AlignItems);
   width: 100%;
 }
+.pf-c-toolbar__content-section.pf-m-align-items-center {
+  align-items: center;
+}
 
 .pf-c-toolbar__expandable-content {
   position: absolute;

package/components/Toolbar/toolbar.scss

@@ -13,9 +13,12 @@ $pf-c-toolbar--inset-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl"
   // Item
   --pf-c-toolbar__item--Display: block;
   --pf-c-toolbar__item--MinWidth--base: auto;
+  --pf-c-toolbar__item--AlignSelf: auto;
 
   // Group
   --pf-c-toolbar__group--Display: flex;
+  --pf-c-toolbar__group--AlignItems: baseline;
+  --pf-c-toolbar__group--AlignSelf: auto;
 
   // Sticky
   --pf-c-toolbar--m-sticky--ZIndex: var(--pf-global--ZIndex--xs);
@@ -28,6 +31,7 @@ $pf-c-toolbar--inset-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl"
 
   // Content section
   --pf-c-toolbar__content-section--Display: flex;
+  --pf-c-toolbar__content-section--AlignItems: baseline;
 
   // Insets
   --pf-c-toolbar--m-page-insets--inset: var(--pf-global--spacer--md); // make this the default inset at breaking change
@@ -208,9 +212,26 @@ $pf-c-toolbar--inset-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl"
 
   @include pf-hidden-visible(var(--pf-c-toolbar__group--Display));
 
-  align-items: center;
+  align-items: var(--pf-c-toolbar__group--AlignItems);
+  align-self: var(--pf-c-toolbar__group--AlignSelf);
   margin-right: var(--pf-c-toolbar--spacer);
 
+  &.pf-m-align-items-center {
+    align-items: center;
+  }
+
+  &.pf-m-align-items-baseline {
+    align-items: baseline;
+  }
+
+  &.pf-m-align-self-center {
+    align-self: center;
+  }
+
+  &.pf-m-align-self-baseline {
+    align-self: baseline;
+  }
+
   // Button group
   &.pf-m-button-group {
     --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-button-group--spacer);
@@ -270,10 +291,19 @@ $pf-c-toolbar--inset-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl"
   @include pf-build-css-variable-stack("--pf-c-toolbar__item--MinWidth--base", "--pf-c-toolbar__item--MinWidth", $pf-c-toolbar--breakpoint-map);
   @include pf-hidden-visible(var(--pf-c-toolbar__item--Display));
 
+  align-self: var(--pf-c-toolbar__item--AlignSelf);
   width: var(--pf-c-toolbar__item--Width--base);
   min-width: var(--pf-c-toolbar__item--MinWidth--base);
   margin-right: var(--pf-c-toolbar--spacer);
 
+  &.pf-m-align-self-center {
+    align-self: center;
+  }
+
+  &.pf-m-align-self-baseline {
+    align-self: baseline;
+  }
+
   // Overflow menu
   &.pf-m-overflow-menu {
     --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-overflow-menu--spacer);
@@ -329,7 +359,6 @@ $pf-c-toolbar--inset-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl"
   }
 }
 
-
 .pf-c-toolbar__expand-all-icon {
   display: inline-block;
   transition: var(--pf-c-toolbar__expand-all-icon--Transition);
@@ -339,7 +368,6 @@ $pf-c-toolbar--inset-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl"
 .pf-c-toolbar__content,
 .pf-c-toolbar__content-section {
   flex-wrap: wrap;
-  align-items: center;
 }
 
 // Content
@@ -347,6 +375,7 @@ $pf-c-toolbar--inset-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl"
   @include pf-hidden-visible(var(--pf-c-toolbar__content--Display));
 
   position: relative;
+  align-items: center;
   padding-right: var(--pf-c-toolbar__content--PaddingRight);
   padding-left: var(--pf-c-toolbar__content--PaddingLeft);
 }
@@ -355,7 +384,12 @@ $pf-c-toolbar--inset-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl"
 .pf-c-toolbar__content-section {
   @include pf-hidden-visible(var(--pf-c-toolbar__content-section--Display));
 
+  align-items: var(--pf-c-toolbar__content-section--AlignItems);
   width: 100%;
+
+  &.pf-m-align-items-center {
+    align-items: center;
+  }
 }
 
 // Expandable content

package/components/Tooltip/themes/dark/tooltip.scss

@@ -2,17 +2,14 @@
 
 @mixin pf-theme-dark-tooltip() {
   .pf-c-tooltip {
-    --pf-c-tooltip--BoxShadow: none;
     --pf-c-tooltip__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
-  }
-
-  .pf-c-tooltip,
-  .pf-c-tooltip__arrow {
-    border: var(--pf-global--BorderWidth--lg) solid var(--pf-global--BorderColor--300);
+    --pf-c-tooltip__arrow--BoxShadow: var(--pf-global--BoxShadow--lg);
   }
 
   .pf-c-tooltip__arrow {
     --pf-c-tooltip__arrow--Width: #{pf-size-prem(15px)};
     --pf-c-tooltip__arrow--Height: #{pf-size-prem(15px)};
+
+    box-shadow: var(--pf-c-tooltip__arrow--BoxShadow);
   }
 }

package/components/Tooltip/tooltip.css

@@ -83,14 +83,11 @@
 }
 
 :where(.pf-theme-dark) .pf-c-tooltip {
-  --pf-c-tooltip--BoxShadow: none;
   --pf-c-tooltip__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
-}
-:where(.pf-theme-dark) .pf-c-tooltip,
-:where(.pf-theme-dark) .pf-c-tooltip__arrow {
-  border: var(--pf-global--BorderWidth--lg) solid var(--pf-global--BorderColor--300);
+  --pf-c-tooltip__arrow--BoxShadow: var(--pf-global--BoxShadow--lg);
 }
 :where(.pf-theme-dark) .pf-c-tooltip__arrow {
   --pf-c-tooltip__arrow--Width: 0.9375rem;
   --pf-c-tooltip__arrow--Height: 0.9375rem;
+  box-shadow: var(--pf-c-tooltip__arrow--BoxShadow);
 }