@patternfly/patternfly 6.0.0-alpha.173 → 6.0.0-alpha.175

package/patternfly.css

@@ -7650,6 +7650,7 @@ button.pf-v6-c-breadcrumb__link {
   --pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
   --pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color: var(--pf-t--global--text--color--status--danger--clicked);
   --pf-v6-c-button--m-link--m-inline--Display: inline-flex;
+  --pf-v6-c-button--m-link--m-inline--JustifyContent: flex-start;
   --pf-v6-c-button--m-link--m-inline--FontSize: initial;
   --pf-v6-c-button--m-link--m-inline--LineHeight: initial;
   --pf-v6-c-button--m-link--m-inline--FontWeight: initial;
@@ -7670,7 +7671,8 @@ button.pf-v6-c-breadcrumb__link {
   --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-button--m-plain--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-button--m-plain--Color: var(--pf-t--global--icon--color--regular);
+  --pf-v6-c-button--m-plain--Color: var(--pf-t--global--text--color--regular);
+  --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--icon--color--regular);
   --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
   --pf-v6-c-button--m-plain--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--m-plain--PaddingBlockStart) + var(--pf-v6-c-button--m-plain--PaddingBlockEnd));
   --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
@@ -7901,6 +7903,7 @@ button.pf-v6-c-breadcrumb__link {
 }
 .pf-v6-c-button.pf-m-link.pf-m-inline {
   --pf-v6-c-button--Display: var(--pf-v6-c-button--m-link--m-inline--Display);
+  --pf-v6-c-button--JustifyContent: var(--pf-v6-c-button--m-link--m-inline--JustifyContent);
   --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-link--m-inline--FontSize);
   --pf-v6-c-button--LineHeight: var(--pf-v6-c-button--m-link--m-inline--LineHeight);
   --pf-v6-c-button--FontWeight: var(--pf-v6-c-button--m-link--m-inline--FontWeight);
@@ -8020,6 +8023,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
 .pf-v6-c-button.pf-m-plain {
   --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-plain--BorderRadius);
   --pf-v6-c-button--Color: var(--pf-v6-c-button--m-plain--Color);
+  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-plain__icon--Color);
   --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-plain--BackgroundColor);
   --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-plain--PaddingBlockStart);
   --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--PaddingInlineEnd);
@@ -8655,8 +8659,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
 .pf-v6-c-card__title:not(:last-child) {
   padding-block-end: var(--pf-v6-c-card__title--not--last-child--PaddingBlockEnd);
 }
-.pf-v6-c-card__header button.pf-m-inline.pf-m-disabled,
-.pf-v6-c-card__title button.pf-m-inline.pf-m-disabled {
+.pf-v6-c-card__header .pf-v6-c-button.pf-m-inline:disabled,
+.pf-v6-c-card__title .pf-v6-c-button.pf-m-inline:disabled {
   --pf-v6-c-button--disabled--Color: var(--pf-v6-c-card--c-button--disabled--Color);
 }
 
@@ -8851,8 +8855,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
 }
 
 .pf-v6-c-clipboard-copy__actions-item .pf-v6-c-button.pf-m-plain {
-  --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--Color);
-  --pf-v6-c-button--m-plain--hover--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color);
+  --pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--Color);
+  --pf-v6-c-button--m-plain--hover__icon--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color);
 }
 
 :where(:root, .pf-v6-c-code-block) {
@@ -9139,16 +9143,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
   --pf-v6-c-content--blockquote--Color: var(--pf-t--global--text--color--subtle);
   --pf-v6-c-content--blockquote--BorderInlineStartColor: var(--pf-t--global--border--color--default);
   --pf-v6-c-content--blockquote--BorderInlineStartWidth: var(--pf-t--global--border--width--300);
-  --pf-v6-c-content--ol--PaddingInlineStart: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-content--ol--MarginInlineStart: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-content--ol--nested--MarginBlockStart: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-content--ol--nested--MarginInlineStart: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-content--ul--PaddingInlineStart: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-content--ul--MarginInlineStart: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-content--ul--nested--MarginBlockStart: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-content--ul--nested--MarginInlineStart: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-content--list--Gap: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-content--list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-content--list--nested--MarginBlockStart: var(--pf-v6-c-content--list--Gap);
   --pf-v6-c-content--ul--ListStyle: var(--pf-t--global--list-style);
-  --pf-v6-c-content--li--MarginBlockStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--2xl);
   --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--md);
   --pf-v6-c-content--dt--FontWeight: var(--pf-t--global--font--weight--body--bold);
@@ -9218,17 +9216,6 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
   margin-block-end: 0;
 }
 
-:is(.pf-v6-c-content--ol,
-.pf-v6-c-content--ul, .pf-v6-c-content ol, .pf-v6-c-content ul) {
-  margin: 0;
-}
-:is(.pf-v6-c-content--ol,
-.pf-v6-c-content--ul, .pf-v6-c-content ol, .pf-v6-c-content ul).pf-m-plain {
-  padding-inline-start: 0;
-  margin-inline-start: 0;
-  list-style: none;
-}
-
 :is(.pf-v6-c-content--h1, .pf-v6-c-content h1) {
   margin-block-start: var(--pf-v6-c-content--h1--MarginBlockStart);
   margin-block-end: var(--pf-v6-c-content--h1--MarginBlockEnd);
@@ -9302,36 +9289,29 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
   border: none;
 }
 
-:is(.pf-v6-c-content--ol, .pf-v6-c-content ol) {
-  padding-inline-start: var(--pf-v6-c-content--ol--PaddingInlineStart);
-  margin-inline-start: var(--pf-v6-c-content--ol--MarginInlineStart);
+:is(.pf-v6-c-content--ol,
+.pf-v6-c-content--ul, .pf-v6-c-content ol, .pf-v6-c-content ul) {
+  display: flex;
+  flex-direction: column;
+  gap: var(--pf-v6-c-content--list--Gap);
+  padding-inline-start: var(--pf-v6-c-content--list--PaddingInlineStart);
 }
-:is(.pf-v6-c-content--ol, .pf-v6-c-content ol) :is(.pf-v6-c-content--ul,
-ul) {
-  --pf-v6-c-content--ul--MarginInlineStart: var(--pf-v6-c-content--ul--nested--MarginInlineStart);
-  margin-block-start: var(--pf-v6-c-content--ul--nested--MarginBlockStart);
+:is(.pf-v6-c-content--ol,
+.pf-v6-c-content--ul, .pf-v6-c-content ol, .pf-v6-c-content ul).pf-m-plain {
+  padding-inline-start: 0;
+  list-style: none;
 }
-:is(.pf-v6-c-content--ol, .pf-v6-c-content ol) :is(.pf-v6-c-content--ol,
-ol) {
-  --pf-v6-c-content--ol--MarginInlineStart: var(--pf-v6-c-content--ol--nested--MarginInlineStart);
-  margin-block-start: var(--pf-v6-c-content--ol--nested--MarginBlockStart);
+:is(.pf-v6-c-content--ol,
+.pf-v6-c-content--ul, .pf-v6-c-content ol, .pf-v6-c-content ul) :is(.pf-v6-c-content--ol,
+.pf-v6-c-content--ul,
+ol,
+ul) {
+  margin-block-start: var(--pf-v6-c-content--list--nested--MarginBlockStart);
 }
 
 :is(.pf-v6-c-content--ul, .pf-v6-c-content ul) {
-  padding-inline-start: var(--pf-v6-c-content--ul--PaddingInlineStart);
-  margin-inline-start: var(--pf-v6-c-content--ul--MarginInlineStart);
   list-style: var(--pf-v6-c-content--ul--ListStyle);
 }
-:is(.pf-v6-c-content--ul, .pf-v6-c-content ul) :is(.pf-v6-c-content--ul,
-ul) {
-  --pf-v6-c-content--ul--MarginInlineStart: var(--pf-v6-c-content--ul--nested--MarginInlineStart);
-  margin-block-start: var(--pf-v6-c-content--ul--nested--MarginBlockStart);
-}
-:is(.pf-v6-c-content--ul, .pf-v6-c-content ul) :is(.pf-v6-c-content--ol,
-ol) {
-  --pf-v6-c-content--ol--MarginInlineStart: var(--pf-v6-c-content--ol--nested--MarginInlineStart);
-  margin-block-start: var(--pf-v6-c-content--ol--nested--MarginBlockStart);
-}
 
 :is(.pf-v6-c-content--dl, .pf-v6-c-content dl) {
   display: grid;
@@ -13806,8 +13786,6 @@ label.pf-v6-c-input-group__text {
   --pf-v6-c-jump-links__toggle-icon--Transition: var(--pf-t--global--transition);
   --pf-v6-c-jump-links__toggle-icon--Rotate: 0;
   --pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
-  --pf-v6-c-jump-links__toggle-text--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
-  --pf-v6-c-jump-links__toggle-text--Color: var(--pf-t--global--text--color--regular);
 }
 
 .pf-v6-c-jump-links {
@@ -14003,11 +13981,6 @@ label.pf-v6-c-input-group__text {
   scale: -1 1;
 }
 
-.pf-v6-c-jump-links__toggle-text {
-  margin-inline-start: var(--pf-v6-c-jump-links__toggle-text--MarginInlineStart);
-  color: var(--pf-v6-c-jump-links__toggle-text--Color);
-}
-
 :where(:root, .pf-v6-c-label) {
   --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
   --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
@@ -14198,7 +14171,7 @@ label.pf-v6-c-input-group__text {
   --pf-v6-c-label--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
   --pf-v6-c-label--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
   --pf-v6-c-label--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
-  --pf-v6-c-label--m-disabled--c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
+  --pf-v6-c-label--m-disabled--c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
 }
 
 .pf-v6-c-label {
@@ -14441,7 +14414,7 @@ label.pf-v6-c-input-group__text {
   pointer-events: none;
 }
 .pf-v6-c-label.pf-m-disabled .pf-v6-c-button {
-  --pf-v6-c-button--m-plain--disabled--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled--Color);
+  --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled__icon--Color);
 }
 
 .pf-v6-c-label,
@@ -14638,14 +14611,16 @@ input.pf-v6-c-label__content {
 
 :where(:root, .pf-v6-c-list) {
   --pf-v6-c-list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-list--nested--MarginBlockStart: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-list--nested--MarginInlineStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
-  --pf-v6-c-list--li--MarginBlockStart: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-list--m-inline--li--MarginInlineEnd: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-list--m-bordered--li--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-list--m-bordered--li--BorderBlockEndColor: var(--pf-t--global--border--color--default);
-  --pf-v6-c-list--m-bordered--li--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
+  --pf-v6-c-list--Gap: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-list--nested--PaddingBlockStart: var(--pf-v6-c-list--Gap);
+  --pf-v6-c-list--m-plain--PaddingInlineStart: 0;
+  --pf-v6-c-list--m-inline--PaddingInlineStart: 0;
+  --pf-v6-c-list--m-inline--ColumnGap: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-list--m-inline--RowGap: var(--pf-t--global--spacer--xs);
+  --pf-v6-c-list--m-bordered--li--PaddingBlockStart: var(--pf-v6-c-list--Gap);
+  --pf-v6-c-list--m-bordered--li--BorderBlockStartColor: var(--pf-t--global--border--color--default);
+  --pf-v6-c-list--m-bordered--li--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
   --pf-v6-c-list__item-icon--MinWidth: var(--pf-t--global--icon--size--sm);
   --pf-v6-c-list__item-icon--MarginBlockStart: var(--pf-t--global--spacer--xs);
   --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -14657,32 +14632,18 @@ input.pf-v6-c-label__content {
 }
 
 .pf-v6-c-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--pf-v6-c-list--Gap);
   padding-inline-start: var(--pf-v6-c-list--PaddingInlineStart);
 }
-.pf-v6-c-list ol,
-.pf-v6-c-list ul {
-  margin-block-start: var(--pf-v6-c-list--nested--MarginBlockStart);
-  margin-inline-start: var(--pf-v6-c-list--nested--MarginInlineStart);
-}
-.pf-v6-c-list li + li {
-  margin-block-start: var(--pf-v6-c-list--li--MarginBlockStart);
+.pf-v6-c-list .pf-v6-c-list {
+  padding-block-start: var(--pf-v6-c-list--nested--PaddingBlockStart);
 }
 ul.pf-v6-c-list {
   list-style: var(--pf-v6-c-list--ul--ListStyle);
 }
 
-.pf-v6-c-list .pf-v6-c-list__item {
-  display: flex;
-}
-.pf-v6-c-list .pf-v6-c-list__item-icon {
-  flex-shrink: 0;
-  min-width: var(--pf-v6-c-list__item-icon--MinWidth);
-  margin-block-start: var(--pf-v6-c-list__item-icon--MarginBlockStart);
-  margin-inline-end: var(--pf-v6-c-list__item-icon--MarginInlineEnd);
-  font-size: var(--pf-v6-c-list__item-icon--FontSize);
-  line-height: 1;
-  color: var(--pf-v6-c-list__item-icon--Color);
-}
 .pf-v6-c-list.pf-m-icon-lg {
   --pf-v6-c-list__item-icon--MinWidth: var(--pf-v6-c-list--m-icon-lg__item-icon--MinWidth);
   --pf-v6-c-list__item-icon--MarginBlockStart: 0;
@@ -14690,28 +14651,33 @@ ul.pf-v6-c-list {
   --pf-v6-c-list__item-icon--FontSize: var(--pf-v6-c-list--m-icon-lg__item-icon--FontSize);
 }
 .pf-v6-c-list.pf-m-plain {
-  --pf-v6-c-list--PaddingInlineStart: 0;
+  --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-plain--PaddingInlineStart);
   list-style: none;
 }
 .pf-v6-c-list.pf-m-inline {
-  --pf-v6-c-list--PaddingInlineStart: 0;
-  display: flex;
+  --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-inline--PaddingInlineStart);
+  --pf-v6-c-list--Gap: var(--pf-v6-c-list--m-inline--RowGap) var(--pf-v6-c-list--m-inline--ColumnGap);
+  flex-direction: row;
   flex-wrap: wrap;
   list-style: none;
 }
-.pf-v6-c-list.pf-m-inline li {
-  --pf-v6-c-list--li--MarginBlockStart: 0;
-}
-.pf-v6-c-list.pf-m-inline li:not(:last-child) {
-  margin-inline-end: var(--pf-v6-c-list--m-inline--li--MarginInlineEnd);
+.pf-v6-c-list.pf-m-bordered > * + * {
+  padding-block-start: var(--pf-v6-c-list--m-bordered--li--PaddingBlockStart);
+  border-block-start: var(--pf-v6-c-list--m-bordered--li--BorderBlockStartWidth) solid var(--pf-v6-c-list--m-bordered--li--BorderBlockStartColor);
 }
-.pf-v6-c-list.pf-m-bordered > * {
-  padding-block-end: var(--pf-v6-c-list--m-bordered--li--PaddingBlockEnd);
-  border-block-end: var(--pf-v6-c-list--m-bordered--li--BorderBlockEndWidth) solid var(--pf-v6-c-list--m-bordered--li--BorderBlockEndColor);
+
+.pf-v6-c-list__item {
+  display: flex;
 }
-.pf-v6-c-list.pf-m-bordered > :last-child {
-  --pf-v6-c-list--m-bordered--li--PaddingBlockEnd: 0;
-  --pf-v6-c-list--m-bordered--li--BorderBlockEndWidth: 0;
+
+.pf-v6-c-list__item-icon {
+  flex-shrink: 0;
+  min-width: var(--pf-v6-c-list__item-icon--MinWidth);
+  margin-block-start: var(--pf-v6-c-list__item-icon--MarginBlockStart);
+  margin-inline-end: var(--pf-v6-c-list__item-icon--MarginInlineEnd);
+  font-size: var(--pf-v6-c-list__item-icon--FontSize);
+  line-height: 1;
+  color: var(--pf-v6-c-list__item-icon--Color);
 }
 
 :where(:root, .pf-v6-c-log-viewer) {
@@ -24463,13 +24429,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   --pf-v6-c-tabs__item--ScrollSnapAlign: end;
   --pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis: y;
   --pf-v6-c-tabs__toggle--Display: flex;
-  --pf-v6-c-tabs__toggle-icon--Color: currentcolor;
   --pf-v6-c-tabs__toggle-icon--Transition: all 250ms cubic-bezier(.42, 0, .58, 1);
   --pf-v6-c-tabs__toggle-icon--Rotate: 0;
-  --pf-v6-c-tabs__toggle-text--MarginInlineStart: 0;
-  --pf-v6-c-tabs__toggle-button__toggle-text--MarginInlineStart: var(--pf-t--global--spacer--md);
-  --pf-v6-c-tabs__toggle-button__toggle-text--Color: var(--pf-t--global--text--color--regular);
-  --pf-v6-c-tabs--m-expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
   --pf-v6-c-tabs--m-expanded__toggle-icon--Rotate: 90deg;
   --pf-v6-c-tabs--m-expandable--RowGap: var(--pf-t--global--spacer--sm);
   --pf-v6-c-tabs--m-expandable--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -24706,7 +24667,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
 }
 .pf-v6-c-tabs.pf-m-vertical.pf-m-expanded {
   --pf-v6-c-tabs__list--Display: flex;
-  --pf-v6-c-tabs__toggle-icon--Color: var(--pf-v6-c-tabs--m-expanded__toggle-icon--Color);
   --pf-v6-c-tabs__toggle-icon--Rotate: var(--pf-v6-c-tabs--m-expanded__toggle-icon--Rotate);
 }
 .pf-v6-c-tabs.pf-m-box.pf-m-vertical {
@@ -24760,19 +24720,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   align-items: center;
 }
 
-.pf-v6-c-tabs__toggle-button {
-  --pf-v6-c-tabs__toggle-text--MarginInlineStart: var(--pf-v6-c-tabs__toggle-button__toggle-text--MarginInlineStart);
-  --pf-v6-c-tabs__toggle-text--Color: var(--pf-v6-c-tabs__toggle-button__toggle-text--Color);
-}
 .pf-v6-c-tabs__toggle-button .pf-v6-c-button {
-  display: flex;
-  text-align: start;
+  justify-content: start;
   white-space: normal;
 }
 
 .pf-v6-c-tabs__toggle-icon {
   display: inline-block;
-  color: var(--pf-v6-c-tabs__toggle-icon--Color);
   transition: var(--pf-v6-c-tabs__toggle-icon--Transition);
   transform: rotate(var(--pf-v6-c-tabs__toggle-icon--Rotate));
 }
@@ -24780,11 +24734,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   scale: -1 1;
 }
 
-.pf-v6-c-tabs__toggle-text {
-  margin-inline-start: var(--pf-v6-c-tabs__toggle-text--MarginInlineStart);
-  color: var(--pf-v6-c-tabs__toggle-text--Color, inherit);
-}
-
 .pf-v6-c-tabs__list {
   scrollbar-width: none;
   -ms-overflow-style: -ms-autohiding-scrollbar;
@@ -28103,7 +28052,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
 }
 
 .pf-v6-c-number-input__icon {
-  display: flex;
   font-size: var(--pf-v6-c-number-input__icon--FontSize);
 }