@patternfly/patternfly 6.3.0-prerelease.25 → 6.3.0-prerelease.27

package/components/Page/page.css

@@ -111,6 +111,51 @@
     grid-template-columns: var(--pf-v6-c-page__sidebar--Width) 1fr;
   }
 }
+.pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
+  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+  --pf-v6-c-button__icon--TransitionDelay: 0s;
+  --pf-v6-c-button__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+  --pf-v6-c-button--hover__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+}
+.pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-expanded)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle :is(.pf-v6-c-button.pf-m-hamburger, .pf-v6-c-button.pf-m-hamburger:hover, .pf-v6-c-button.pf-m-hamburger:focus-visible) {
+  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+  --pf-v6-c-button__icon--TransitionDelay: 0s;
+  --pf-v6-c-button__icon--Scale: 1;
+  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+  --pf-v6-c-button--hover__icon--Scale: 1;
+}
+@media (min-width: 75rem) {
+  .pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger, .pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-expanded)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle :is(.pf-v6-c-button.pf-m-hamburger, .pf-v6-c-button.pf-m-hamburger:hover, .pf-v6-c-button.pf-m-hamburger:focus-visible) {
+    --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
+    --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
+    --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
+    --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
+    --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
+  }
+  .pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
+    --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+    --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+    --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+    --pf-v6-c-button__icon--TransitionDelay: 0s;
+    --pf-v6-c-button__icon--Scale: 1;
+    --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+    --pf-v6-c-button--hover__icon--Scale: 1;
+  }
+  .pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-collapsed)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
+    --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+    --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+    --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+    --pf-v6-c-button__icon--TransitionDelay: 0s;
+    --pf-v6-c-button__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+    --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+    --pf-v6-c-button--hover__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+  }
+}
 
 .pf-v6-c-page > .pf-v6-c-masthead {
   z-index: var(--pf-v6-c-page--c-masthead--ZIndex);

package/components/Page/page.scss

@@ -149,8 +149,37 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
       "header header"
       "sidebar main";
     grid-template-columns: var(--#{$page}__sidebar--Width) 1fr;
+  }
+
+  // Hamburger menu animation
+  // mobile - show expand on hover
+  > .#{$masthead} .#{$masthead}__toggle .#{$button}.pf-m-hamburger:is(:hover, :focus-visible) {
+    @include pf-v6-hamburger;
+  }
+
+  // mobile - show collapse when sidebar expanded
+  &:where(:has(> .#{$page}__sidebar.pf-m-expanded)) > .#{$masthead} .#{$masthead}__toggle :is(.#{$button}.pf-m-hamburger, .#{$button}.pf-m-hamburger:hover, .#{$button}.pf-m-hamburger:focus-visible) {
+    @include pf-v6-hamburger($collapse: true);
+  }
+
+  @media (min-width: $pf-v6-global--breakpoint--xl) {
+    // desktop - disable default arrow
+    > .#{$masthead} .#{$masthead}__toggle .#{$button}.pf-m-hamburger,
+    &:where(:has(> .#{$page}__sidebar.pf-m-expanded)) > .#{$masthead} .#{$masthead}__toggle :is(.#{$button}.pf-m-hamburger, .#{$button}.pf-m-hamburger:hover, .#{$button}.pf-m-hamburger:focus-visible) {
+      @include pf-v6-hamburger($reset: true);
+    }
+
+    // desktop - show collapse on hover
+    > .#{$masthead} .#{$masthead}__toggle .#{$button}.pf-m-hamburger:is(:hover, :focus-visible) {
+      @include pf-v6-hamburger($collapse: true);
+    }
+
+    // desktop - show expand on hover when sidebar collapsed
+    &:where(:has(> .#{$page}__sidebar.pf-m-collapsed)) > .#{$masthead} .#{$masthead}__toggle .#{$button}.pf-m-hamburger:is(:hover, :focus-visible) {
+      @include pf-v6-hamburger;
     }
   }
+}
 
 // Header
 .#{$page} > .#{$masthead} {

package/components/Progress/progress.css

@@ -106,6 +106,22 @@
   --pf-v6-c-progress__status-icon--Color: var(--pf-v6-c-progress--m-danger__status-icon--Color);
   --pf-v6-c-progress--m-inside__measure--Color: var(--pf-v6-c-progress--m-danger--m-inside__measure--Color);
 }
+@media (prefers-reduced-motion: no-preference) {
+  .pf-v6-c-progress.pf-m-danger .pf-v6-c-progress__bar {
+    translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
+    animation-name: pf-v6-global-danger-jiggle-motion;
+    animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
+    animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
+    animation-fill-mode: both;
+  }
+}
+.pf-v6-c-progress.pf-m-danger .pf-v6-c-progress__status-icon {
+  --pf-v6-c-progress--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
+  --pf-v6-c-progress--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
+  animation-name: pf-v6-global-fade-in;
+  animation-duration: var(--pf-v6-c-progress--TransitionDuration--Opacity);
+  animation-timing-function: var(--pf-v6-c-progress--TransitionTimingFunction--Opacity);
+}
 
 .pf-v6-c-progress__description {
   grid-column: 1/2;

package/components/Progress/progress.scss

@@ -140,6 +140,16 @@
     --#{$progress}__indicator--BackgroundColor: var(--#{$progress}--m-danger__indicator--BackgroundColor);
     --#{$progress}__status-icon--Color: var(--#{$progress}--m-danger__status-icon--Color);
     --#{$progress}--m-inside__measure--Color: var(--#{$progress}--m-danger--m-inside__measure--Color);
+
+    .#{$progress}__bar {
+      @media (prefers-reduced-motion: no-preference) {
+        @include pf-v6-animate-danger-jiggle;
+      }
+    }
+
+    .#{$progress}__status-icon {
+      @include pf-v6-fade-default(#{$progress});
+    }
   }
 }
 
@@ -209,4 +219,4 @@
 
 .#{$progress}__measure {
   font-variant-numeric: tabular-nums;
-}
+}

package/components/TextInputGroup/text-input-group.css

@@ -103,6 +103,22 @@
   --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
   --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
 }
+@media (prefers-reduced-motion: no-preference) {
+  .pf-v6-c-text-input-group.pf-m-error {
+    translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
+    animation-name: pf-v6-global-danger-jiggle-motion;
+    animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
+    animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
+    animation-fill-mode: both;
+  }
+}
+.pf-v6-c-text-input-group.pf-m-error .pf-v6-c-text-input-group__icon.pf-m-status {
+  --pf-v6-c-text-input-group--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
+  --pf-v6-c-text-input-group--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
+  animation-name: pf-v6-global-fade-in;
+  animation-duration: var(--pf-v6-c-text-input-group--TransitionDuration--Opacity);
+  animation-timing-function: var(--pf-v6-c-text-input-group--TransitionTimingFunction--Opacity);
+}
 .pf-v6-c-text-input-group:hover {
   --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
 }

package/components/TextInputGroup/text-input-group.scss

@@ -128,6 +128,14 @@
     --#{$text-input-group}--BorderColor: var(--#{$text-input-group}--m-error--BorderColor);
     --#{$text-input-group}--m-hover--BorderColor: var(--#{$text-input-group}--m-hover--m-error--BorderColor);
     --#{$text-input-group}__icon--m-status--Color: var(--#{$text-input-group}__main--m-error__icon--m-status--Color);  
+    
+    @media (prefers-reduced-motion: no-preference) {
+      @include pf-v6-animate-danger-jiggle;
+    }
+    
+    .#{$text-input-group}__icon.pf-m-status {
+      @include pf-v6-fade-default(#{$text-input-group});
+    }
   }
   
   &:hover {

package/components/_index.css

@@ -1547,6 +1547,7 @@ button.pf-v6-c-breadcrumb__link {
   --pf-v6-c-button--TextDecorationLine: none;
   --pf-v6-c-button--TextDecorationStyle: none;
   --pf-v6-c-button--TextDecorationColor: currentcolor;
+  --pf-v6-c-button--TransitionDelay: 0s;
   --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
   --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
   --pf-v6-c-button--TransitionProperty: color, background, border-width, border-color;
@@ -1765,6 +1766,16 @@ button.pf-v6-c-breadcrumb__link {
   --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
   --pf-v6-c-button--m-notify__icon--AnimationDuration--notify: var(--pf-t--global--motion--duration--3xl);
   --pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify: var(--pf-t--global--motion--timing-function--default);
+  --pf-v6-c-button__icon--TransitionDelay: 0s;
+  --pf-v6-c-button__icon--TransitionTimingFunction: auto;
+  --pf-v6-c-button__icon--TransitionDuration: 0s;
+  --pf-v6-c-button__icon--TransitionProperty: none;
+  --pf-v6-c-button__icon--Rotate: 0deg;
+  --pf-v6-c-button__icon--Scale: 1;
+  --pf-v6-c-button--hover__icon--TransitionTimingFunction: auto;
+  --pf-v6-c-button--hover__icon--TransitionDuration: 0s;
+  --pf-v6-c-button--hover__icon--TransitionProperty: none;
+  --pf-v6-c-button--hover__icon--Rotate: 0deg;
   --pf-v6-c-button--m-favorite__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
   --pf-v6-c-button--m-favorite__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
   --pf-v6-c-button--m-favorited__icon--Color: var(--pf-t--global--color--favorite--default);
@@ -1790,9 +1801,28 @@ button.pf-v6-c-breadcrumb__link {
   --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
   --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
   --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
+  --pf-v6-c-button--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
+  --pf-v6-c-button--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
+  --pf-v6-c-button--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
+  --pf-v6-c-button--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
+  --pf-v6-c-button--m-settings--hover__icon--Rotate: 60deg;
   --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
   --pf-v6-c-button--m-block--Display: flex;
   --pf-v6-c-button--m-block--Width: 100%;
+  --pf-v6-c-button--hamburger-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
+  --pf-v6-c-button--hamburger-icon--TransitionDuration: var(--pf-t--global--motion--duration--md);
+  --pf-v6-c-button--hamburger-icon--top--path--base: path("M1,1 L9,1");
+  --pf-v6-c-button--hamburger-icon--middle--path--base: path("M1,5 L9,5");
+  --pf-v6-c-button--hamburger-icon--arrow--path--base: path("M1,5 L1,5 L1,5");
+  --pf-v6-c-button--hamburger-icon--bottom--path--base: path("M9,9 L1,9");
+  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
+  --pf-v6-c-button--hamburger-icon--middle--path: var(--pf-v6-c-button--hamburger-icon--middle--path--base);
+  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
+  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
+  --pf-v6-c-button--hamburger-icon--top--collapse--path: path("M5,1 L9,1");
+  --pf-v6-c-button--hamburger-icon--arrow--collapse--path: path("M3,7 L1,5 L3,3");
+  --pf-v6-c-button--hamburger-icon--bottom--collapse--path: path("M9,9 L5,9");
+  --pf-v6-c-button--m-hamburger__icon--m-expand--Scale: -1;
 }
 
 .pf-v6-c-button {
@@ -1824,9 +1854,11 @@ button.pf-v6-c-breadcrumb__link {
   border-start-end-radius: var(--pf-v6-c-button--BorderStartEndRadius, var(--pf-v6-c-button--BorderRadius));
   border-end-start-radius: var(--pf-v6-c-button--BorderEndStartRadius, var(--pf-v6-c-button--BorderRadius));
   border-end-end-radius: var(--pf-v6-c-button--BorderEndEndRadius, var(--pf-v6-c-button--BorderRadius));
+  transition-delay: var(--pf-v6-c-button--TransitionDelay);
   transition-timing-function: var(--pf-v6-c-button--TransitionTimingFunction);
   transition-duration: var(--pf-v6-c-button--TransitionDuration);
   transition-property: var(--pf-v6-c-button--TransitionProperty);
+  scale: var(--pf-v6-c-button--Scale, revert);
 }
 .pf-v6-c-button::after {
   position: absolute;
@@ -2096,7 +2128,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
 }
 .pf-v6-c-button.pf-m-favorited {
   --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
+  --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
   --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
+  --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
   --pf-v6-c-button__icon--favorite--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorite--Opacity);
   --pf-v6-c-button__icon--favorited--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorited--Opacity);
 }
@@ -2105,6 +2139,41 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
   animation-duration: var(--pf-v6-c-button--m-favorited__icon--AnimationDuration);
   animation-timing-function: var(--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction);
 }
+.pf-v6-c-button.pf-m-settings {
+  --pf-v6-c-button__icon--TransitionProperty: rotate;
+  --pf-v6-c-button__icon--TransitionDuration: var(--pf-v6-c-button--m-settings__icon--TransitionDuration);
+  --pf-v6-c-button__icon--TransitionTimingFunction: var(--pf-v6-c-button--m-settings__icon--TransitionTimingFunction);
+  --pf-v6-c-button--hover__icon--TransitionProperty: rotate;
+  --pf-v6-c-button--hover__icon--TransitionDuration: var(--pf-v6-c-button--m-settings--hover__icon--TransitionDuration);
+  --pf-v6-c-button--hover__icon--TransitionTimingFunction: var(--pf-v6-c-button--m-settings--hover__icon--TransitionTimingFunction);
+  --pf-v6-c-button--hover__icon--Rotate: var(--pf-v6-c-button--m-settings--hover__icon--Rotate);
+}
+.pf-v6-c-button.pf-m-hamburger {
+  --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
+  --pf-v6-c-button__icon--TransitionDuration: 0s;
+  --pf-v6-c-button__icon--TransitionProperty: scale;
+  --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
+  --pf-v6-c-button--hover__icon--TransitionDuration: 0s;
+  --pf-v6-c-button--hover__icon--TransitionProperty: scale;
+}
+.pf-v6-c-button.pf-m-hamburger.pf-m-expand {
+  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+  --pf-v6-c-button__icon--TransitionDelay: 0s;
+  --pf-v6-c-button__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+  --pf-v6-c-button--hover__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+}
+.pf-v6-c-button.pf-m-hamburger.pf-m-collapse {
+  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+  --pf-v6-c-button__icon--TransitionDelay: 0s;
+  --pf-v6-c-button__icon--Scale: 1;
+  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+  --pf-v6-c-button--hover__icon--Scale: 1;
+}
 .pf-v6-c-button:hover, .pf-v6-c-button:focus {
   --pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
   --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
@@ -2112,6 +2181,10 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
   --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
   --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
   --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
+  --pf-v6-c-button__icon--TransitionTimingFunction: var(--pf-v6-c-button--hover__icon--TransitionTimingFunction);
+  --pf-v6-c-button__icon--TransitionDuration: var(--pf-v6-c-button--hover__icon--TransitionDuration);
+  --pf-v6-c-button__icon--TransitionProperty: var(--pf-v6-c-button--hover__icon--TransitionProperty);
+  --pf-v6-c-button__icon--Rotate: var(--pf-v6-c-button--hover__icon--Rotate);
   text-decoration-line: var(--pf-v6-c-button--hover--TextDecorationLine);
   text-decoration-style: var(--pf-v6-c-button--hover--TextDecorationStyle);
   text-decoration-color: var(--pf-v6-c-button--hover--TextDecorationColor);
@@ -2174,6 +2247,12 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
   margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
   margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
   color: var(--pf-v6-c-button__icon--Color);
+  transition-delay: var(--pf-v6-c-button__icon--TransitionDelay);
+  transition-timing-function: var(--pf-v6-c-button__icon--TransitionTimingFunction);
+  transition-duration: var(--pf-v6-c-button__icon--TransitionDuration);
+  transition-property: var(--pf-v6-c-button__icon--TransitionProperty);
+  rotate: var(--pf-v6-c-button__icon--Rotate);
+  scale: var(--pf-v6-c-button__icon--Scale);
 }
 .pf-v6-c-button__icon.pf-m-start {
   --pf-v6-c-button__icon--MarginInlineEnd: var(--pf-v6-c-button__icon--m-start--MarginInlineEnd);
@@ -2218,6 +2297,30 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
   align-items: center;
 }
 
+.pf-v6-c-button--hamburger-icon path {
+  fill: none;
+  stroke: currentcolor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  transition: d var(--pf-v6-c-button--hamburger-icon--TransitionDuration) var(--pf-v6-c-button--hamburger-icon--TransitionTimingFunction);
+}
+
+.pf-v6-c-button--hamburger-icon--top {
+  d: var(--pf-v6-c-button--hamburger-icon--top--path);
+}
+
+.pf-v6-c-button--hamburger-icon--middle {
+  d: var(--pf-v6-c-button--hamburger-icon--middle--path);
+}
+
+.pf-v6-c-button--hamburger-icon--arrow {
+  d: var(--pf-v6-c-button--hamburger-icon--arrow--path);
+}
+
+.pf-v6-c-button--hamburger-icon--bottom {
+  d: var(--pf-v6-c-button--hamburger-icon--bottom--path);
+}
+
 @keyframes pf-v6-c-button-icon-notify {
   33% {
     transform: rotate(30deg);
@@ -7402,6 +7505,22 @@ ul) {
   --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
   --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
 }
+@media (prefers-reduced-motion: no-preference) {
+  .pf-v6-c-form-control.pf-m-error {
+    translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
+    animation-name: pf-v6-global-danger-jiggle-motion;
+    animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
+    animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
+    animation-fill-mode: both;
+  }
+}
+.pf-v6-c-form-control.pf-m-error .pf-v6-c-form-control__icon.pf-m-status {
+  --pf-v6-c-form-control--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
+  --pf-v6-c-form-control--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
+  animation-name: pf-v6-global-fade-in;
+  animation-duration: var(--pf-v6-c-form-control--TransitionDuration--Opacity);
+  animation-timing-function: var(--pf-v6-c-form-control--TransitionTimingFunction--Opacity);
+}
 .pf-v6-c-form-control.pf-m-error > textarea {
   padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd));
 }
@@ -10504,6 +10623,14 @@ ul.pf-v6-c-list {
   --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
   --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
   --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
+  --pf-v6-c-menu-toggle__icon--TransitionDelay: 0s;
+  --pf-v6-c-menu-toggle__icon--TransitionDuration: 0s;
+  --pf-v6-c-menu-toggle__icon--TransitionProperty: none;
+  --pf-v6-c-menu-toggle--hover__icon--TransitionDelay: 0s;
+  --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: 0s;
+  --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: none;
+  --pf-v6-c-menu-toggle__icon--Rotate: 0deg;
+  --pf-v6-c-menu-toggle--hover__icon--Rotate: 0deg;
   --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
   --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
   --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
@@ -10601,6 +10728,11 @@ ul.pf-v6-c-list {
   --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
   --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
   --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
+  --pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
+  --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
+  --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
+  --pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate: 60deg;
 }
 
 .pf-v6-c-menu-toggle {
@@ -10714,6 +10846,10 @@ ul.pf-v6-c-list {
   --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
   --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
   --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
+  --pf-v6-c-menu-toggle__icon--TransitionDelay: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDelay);
+  --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDuration);
+  --pf-v6-c-menu-toggle__icon--TransitionProperty: var(--pf-v6-c-menu-toggle--hover__icon--TransitionProperty);
+  --pf-v6-c-menu-toggle__icon--Rotate: var(--pf-v6-c-menu-toggle--hover__icon--Rotate);
 }
 .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
   --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
@@ -10769,6 +10905,15 @@ ul.pf-v6-c-list {
     opacity: 1;
   }
 }
+.pf-v6-c-menu-toggle.pf-m-settings {
+  --pf-v6-c-menu-toggle__icon--TransitionProperty: rotate;
+  --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration);
+  --pf-v6-c-menu-toggle__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction);
+  --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: rotate;
+  --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration);
+  --pf-v6-c-menu-toggle--hover__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction);
+  --pf-v6-c-menu-toggle--hover__icon--Rotate: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate);
+}
 .pf-v6-c-menu-toggle.pf-m-placeholder {
   --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
 }
@@ -10930,6 +11075,10 @@ ul.pf-v6-c-list {
 
 .pf-v6-c-menu-toggle__icon {
   flex-shrink: 0;
+  transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
+  transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
+  transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
+  rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
 }
 .pf-v6-c-menu-toggle__icon :where(picture, img) {
   vertical-align: middle;
@@ -12146,6 +12295,51 @@ ul.pf-v6-c-list {
     grid-template-columns: var(--pf-v6-c-page__sidebar--Width) 1fr;
   }
 }
+.pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
+  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+  --pf-v6-c-button__icon--TransitionDelay: 0s;
+  --pf-v6-c-button__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+  --pf-v6-c-button--hover__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+}
+.pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-expanded)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle :is(.pf-v6-c-button.pf-m-hamburger, .pf-v6-c-button.pf-m-hamburger:hover, .pf-v6-c-button.pf-m-hamburger:focus-visible) {
+  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+  --pf-v6-c-button__icon--TransitionDelay: 0s;
+  --pf-v6-c-button__icon--Scale: 1;
+  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+  --pf-v6-c-button--hover__icon--Scale: 1;
+}
+@media (min-width: 75rem) {
+  .pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger, .pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-expanded)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle :is(.pf-v6-c-button.pf-m-hamburger, .pf-v6-c-button.pf-m-hamburger:hover, .pf-v6-c-button.pf-m-hamburger:focus-visible) {
+    --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
+    --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
+    --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
+    --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
+    --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
+  }
+  .pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
+    --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+    --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+    --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+    --pf-v6-c-button__icon--TransitionDelay: 0s;
+    --pf-v6-c-button__icon--Scale: 1;
+    --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+    --pf-v6-c-button--hover__icon--Scale: 1;
+  }
+  .pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-collapsed)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
+    --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
+    --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
+    --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
+    --pf-v6-c-button__icon--TransitionDelay: 0s;
+    --pf-v6-c-button__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+    --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
+    --pf-v6-c-button--hover__icon--Scale: var(--pf-v6-c-button--m-hamburger__icon--m-expand--Scale);
+  }
+}
 
 .pf-v6-c-page > .pf-v6-c-masthead {
   z-index: var(--pf-v6-c-page--c-masthead--ZIndex);
@@ -13443,6 +13637,22 @@ ul.pf-v6-c-list {
   --pf-v6-c-progress__status-icon--Color: var(--pf-v6-c-progress--m-danger__status-icon--Color);
   --pf-v6-c-progress--m-inside__measure--Color: var(--pf-v6-c-progress--m-danger--m-inside__measure--Color);
 }
+@media (prefers-reduced-motion: no-preference) {
+  .pf-v6-c-progress.pf-m-danger .pf-v6-c-progress__bar {
+    translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
+    animation-name: pf-v6-global-danger-jiggle-motion;
+    animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
+    animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
+    animation-fill-mode: both;
+  }
+}
+.pf-v6-c-progress.pf-m-danger .pf-v6-c-progress__status-icon {
+  --pf-v6-c-progress--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
+  --pf-v6-c-progress--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
+  animation-name: pf-v6-global-fade-in;
+  animation-duration: var(--pf-v6-c-progress--TransitionDuration--Opacity);
+  animation-timing-function: var(--pf-v6-c-progress--TransitionTimingFunction--Opacity);
+}
 
 .pf-v6-c-progress__description {
   grid-column: 1/2;
@@ -19662,6 +19872,22 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
   --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
 }
+@media (prefers-reduced-motion: no-preference) {
+  .pf-v6-c-text-input-group.pf-m-error {
+    translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
+    animation-name: pf-v6-global-danger-jiggle-motion;
+    animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
+    animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
+    animation-fill-mode: both;
+  }
+}
+.pf-v6-c-text-input-group.pf-m-error .pf-v6-c-text-input-group__icon.pf-m-status {
+  --pf-v6-c-text-input-group--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
+  --pf-v6-c-text-input-group--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
+  animation-name: pf-v6-global-fade-in;
+  animation-duration: var(--pf-v6-c-text-input-group--TransitionDuration--Opacity);
+  animation-timing-function: var(--pf-v6-c-text-input-group--TransitionTimingFunction--Opacity);
+}
 .pf-v6-c-text-input-group:hover {
   --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
 }

package/docs/components/Breadcrumb/examples/Breadcrumb.md

@@ -161,7 +161,7 @@ cssPrefix: pf-v6-c-breadcrumb
       </span>
       <span class="pf-v6-c-breadcrumb__dropdown">
         <button
-          class="pf-v6-c-menu-toggle pf-m-plain pf-m-small pf-m-text"
+          class="pf-v6-c-menu-toggle pf-m-text pf-m-small pf-m-plain"
           type="button"
           aria-expanded="false"
           aria-label="Menu toggle"

package/docs/components/Button/examples/Button.md

@@ -2095,6 +2095,84 @@ A favorite button should use a plain button with the star icon. Applying `.pf-m-
 
 ```
 
+### Settings
+
+```html
+<button
+  class="pf-v6-c-button pf-m-settings pf-m-plain"
+  type="button"
+  aria-label="Settings"
+>
+  <span class="pf-v6-c-button__icon">
+    <i class="fas fa-cog" aria-hidden="true"></i>
+  </span>
+</button>
+
+```
+
+### Hamburger
+
+```html
+<button
+  class="pf-v6-c-button pf-m-hamburger pf-m-plain"
+  type="button"
+  aria-label="Hamburger"
+>
+  <span class="pf-v6-c-button__icon">
+    <svg
+      viewBox="0 0 10 10"
+      class="pf-v6-c-button--hamburger-icon pf-v6-svg"
+      width="1em"
+      height="1em"
+    >
+      <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
+      <path class="pf-v6-c-button--hamburger-icon--middle" d="M1,5 L9,5" />
+      <path class="pf-v6-c-button--hamburger-icon--arrow" d="M1,5 L1,5 L1,5" />
+      <path class="pf-v6-c-button--hamburger-icon--bottom" d="M9,9 L1,9" />
+    </svg>
+  </span>
+</button>
+<button
+  class="pf-v6-c-button pf-m-expand pf-m-hamburger pf-m-plain"
+  type="button"
+  aria-label="Hamburger"
+>
+  <span class="pf-v6-c-button__icon">
+    <svg
+      viewBox="0 0 10 10"
+      class="pf-v6-c-button--hamburger-icon pf-v6-svg"
+      width="1em"
+      height="1em"
+    >
+      <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
+      <path class="pf-v6-c-button--hamburger-icon--middle" d="M1,5 L9,5" />
+      <path class="pf-v6-c-button--hamburger-icon--arrow" d="M1,5 L1,5 L1,5" />
+      <path class="pf-v6-c-button--hamburger-icon--bottom" d="M9,9 L1,9" />
+    </svg>
+  </span>
+</button>
+<button
+  class="pf-v6-c-button pf-m-collapse pf-m-hamburger pf-m-plain"
+  type="button"
+  aria-label="Hamburger"
+>
+  <span class="pf-v6-c-button__icon">
+    <svg
+      viewBox="0 0 10 10"
+      class="pf-v6-c-button--hamburger-icon pf-v6-svg"
+      width="1em"
+      height="1em"
+    >
+      <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
+      <path class="pf-v6-c-button--hamburger-icon--middle" d="M1,5 L9,5" />
+      <path class="pf-v6-c-button--hamburger-icon--arrow" d="M1,5 L1,5 L1,5" />
+      <path class="pf-v6-c-button--hamburger-icon--bottom" d="M9,9 L1,9" />
+    </svg>
+  </span>
+</button>
+
+```
+
 ## Documentation
 
 ### Overview
@@ -2126,7 +2204,7 @@ Semantic buttons and links are important for usability as well as accessibility.
 | `.pf-v6-c-button` | `<button>, <span>` |  Initiates a button. Always use it with a modifier class. **Required** |
 | `.pf-v6-c-button__icon` | `<span>` | Initiates a button icon. |
 | `.pf-v6-c-button__progress` | `<span>` | Initiates a button progress container. |
-| `.pf-v6-c-button__count` | `<span>` | Initiates a button count container. **Note:** Count should only be used on link buttons.|
+| `.pf-v6-c-button__count` | `<span>` | Initiates a button count container. **Note:** Count should only be used on link buttons. |
 | `.pf-m-primary` | `.pf-v6-c-button` | Modifies for primary styles. |
 | `.pf-m-secondary` | `.pf-v6-c-button` | Modifies for secondary styles. |
 | `.pf-m-tertiary` | `.pf-v6-c-button` | Modifies for tertiary styles. |
@@ -2149,5 +2227,9 @@ Semantic buttons and links are important for usability as well as accessibility.
 | `.pf-m-in-progress` | `.pf-v6-c-button` | Indicates that the button is in the in progress state. |
 | `.pf-m-stateful` | `.pf-v6-c-button` | Indicates that the button is used for one of read, unread, and attention states. **Note:** Always use with a modifier of `.pf-m-read`, `.pf-m-unread`, or `.pf-m-attention`. |
 | `.pf-m-notify` | `.pf-v6-c-button` | Indicates that the button should show the user notification of an event. **Note:** This is intended for use with a bell icon in the notification badge. |
-| `.pf-m-favorite` | `.pf-v6-c-button .pf-m-plain` | Modifies a plain button to be a favorite button. **Note:** This is intended for use with a star icon. |
-| `.pf-m-favorited` | `.pf-v6-c-button .pf-m-plain .pf-m-favorite` | Modifies a favorite button to indicate that item is favorited.  |
+| `.pf-m-favorite` | `.pf-v6-c-button.pf-m-plain` | Modifies a plain button to be a favorite button. **Note:** This is intended for use with a star icon. |
+| `.pf-m-favorited` | `.pf-v6-c-button.pf-m-plain.pf-m-favorite` | Modifies a favorite button to indicate that item is favorited. |
+| `.pf-m-settings` | `.pf-v6-c-button.pf-m-plain` | Modifies a plain button to be a settings button. |
+| `.pf-m-hamburger` | `.pf-v6-c-button.pf-m-plain` | Modifies a plain button to be a hamburger button. |
+| `.pf-m-expand` | `.pf-v6-c-button.pf-m-hamburger` | Modifies a hamburger button to indicate that it will expand a menu. |
+| `.pf-m-collapse` | `.pf-v6-c-button.pf-m-hamburger` | Modifies a hamburger button to indicate that it will collapse a menu. |