@patternfly/patternfly 6.0.0-alpha.121 → 6.0.0-alpha.123

package/components/CalendarMonth/calendar-month.scss

@@ -2,35 +2,35 @@
 
 :where(:root, .#{$calendar-month}) {
   --#{$calendar-month}--BackgroundColor: var(--pf-t--global--background--color--primary--default);
-  --#{$calendar-month}--PaddingTop: var(--pf-t--global--spacer--lg);
-  --#{$calendar-month}--PaddingRight: var(--pf-t--global--spacer--lg);
-  --#{$calendar-month}--PaddingBottom: var(--pf-t--global--spacer--md);
-  --#{$calendar-month}--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --#{$calendar-month}--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --#{$calendar-month}--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --#{$calendar-month}--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --#{$calendar-month}--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --#{$calendar-month}--FontSize: var(--pf-t--global--font--size--sm);
 
   // header
-  --#{$calendar-month}__header--MarginBottom: var(--pf-t--global--spacer--md);
+  --#{$calendar-month}__header--MarginBlockEnd: var(--pf-t--global--spacer--md);
   --#{$calendar-month}__header--Gap: var(--pf-t--global--spacer--xs);
   --#{$calendar-month}__header-year--Width: 9ch;
-  --#{$calendar-month}__header-nav-control--MarginRight: 0;
-  --#{$calendar-month}__header-nav-control--MarginLeft: 0;
+  --#{$calendar-month}__header-nav-control--MarginInlineEnd: 0;
+  --#{$calendar-month}__header-nav-control--MarginInlineStart: 0;
 
   // week days thead
-  --#{$calendar-month}__days--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
-  --#{$calendar-month}__days--BorderBottomColor: var(--pf-t--global--border--color--default);
+  --#{$calendar-month}__days--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
+  --#{$calendar-month}__days--BorderBlockEndColor: var(--pf-t--global--border--color--default);
 
   // day th
-  --#{$calendar-month}__day--PaddingBottom: var(--pf-t--global--spacer--md);
+  --#{$calendar-month}__day--PaddingBlockEnd: var(--pf-t--global--spacer--md);
   --#{$calendar-month}__day--FontWeight: var(--pf-t--global--font--weight--body);
   --#{$calendar-month}__day--Color: var(--pf-t--global--text--color--regular);
 
 
   // dates td
-  --#{$calendar-month}__dates-cell--PaddingTop: #{pf-size-prem(2px)};
-  --#{$calendar-month}__dates-cell--PaddingRight: #{pf-size-prem(2px)};
-  --#{$calendar-month}__dates-cell--PaddingBottom: #{pf-size-prem(2px)};
-  --#{$calendar-month}__dates-cell--PaddingLeft: #{pf-size-prem(2px)};
-  --#{$calendar-month}__dates-row--first-child__dates-cell--PaddingTop: var(--pf-t--global--spacer--sm);
+  --#{$calendar-month}__dates-cell--PaddingBlockStart: #{pf-size-prem(2px)};
+  --#{$calendar-month}__dates-cell--PaddingInlineEnd: #{pf-size-prem(2px)};
+  --#{$calendar-month}__dates-cell--PaddingBlockEnd: #{pf-size-prem(2px)};
+  --#{$calendar-month}__dates-cell--PaddingInlineStart: #{pf-size-prem(2px)};
+  --#{$calendar-month}__dates-row--first-child__dates-cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
   --#{$calendar-month}__dates-cell--m-current__date--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
   --#{$calendar-month}__dates-cell--m-selected__date--BackgroundColor: var(--pf-t--global--color--brand--default);
   --#{$calendar-month}__dates-cell--m-selected__date--hover--BackgroundColor: var(--pf-t--global--color--brand--default);
@@ -38,13 +38,13 @@
   --#{$calendar-month}__dates-cell--m-selected__date--focus--after--BorderColor: var(--pf-t--global--border--color--brand--default);
   --#{$calendar-month}__dates-cell--m-selected__date--Color: var(--pf-t--global--text--color--on-brand--default);
   --#{$calendar-month}__dates-cell--before--BackgroundColor: transparent;
-  --#{$calendar-month}__dates-cell--before--Top: 0;
-  --#{$calendar-month}__dates-cell--before--Right: 0;
-  --#{$calendar-month}__dates-cell--before--Bottom: var(--#{$calendar-month}__dates-cell--PaddingBottom);
-  --#{$calendar-month}__dates-cell--before--Left: 0;
+  --#{$calendar-month}__dates-cell--before--InsetBlockStart: 0;
+  --#{$calendar-month}__dates-cell--before--InsetInlineEnd: 0;
+  --#{$calendar-month}__dates-cell--before--InsetBlockEnd: var(--#{$calendar-month}__dates-cell--PaddingBlockEnd);
+  --#{$calendar-month}__dates-cell--before--InsetInlineStart: 0;
   --#{$calendar-month}__dates-cell--m-in-range--before--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
-  --#{$calendar-month}__dates-cell--m-in-range--m-start-range--before--Left: 50%;
-  --#{$calendar-month}__dates-cell--m-in-range--m-end-range--before--Right: 50%;
+  --#{$calendar-month}__dates-cell--m-in-range--m-start-range--before--InsetInlineStart: 50%;
+  --#{$calendar-month}__dates-cell--m-in-range--m-end-range--before--InsetInlineEnd: 50%;
   --#{$calendar-month}__dates-cell--m-in-range__date--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
   --#{$calendar-month}__dates-cell--m-in-range__date--hover--BorderWidth: var(--pf-t--global--border--width--regular);
   --#{$calendar-month}__dates-cell--m-in-range__date--hover--BorderColor: var(--pf-t--global--border--color--hover);
@@ -74,10 +74,10 @@
 :where(.#{$calendar-month}) {
   display: inline-flex;
   flex-direction: column;
-  padding-block-start: var(--#{$calendar-month}--PaddingTop);
-  padding-block-end: var(--#{$calendar-month}--PaddingBottom);
-  padding-inline-start: var(--#{$calendar-month}--PaddingLeft);
-  padding-inline-end: var(--#{$calendar-month}--PaddingRight);
+  padding-block-start: var(--#{$calendar-month}--PaddingBlockStart);
+  padding-block-end: var(--#{$calendar-month}--PaddingBlockEnd);
+  padding-inline-start: var(--#{$calendar-month}--PaddingInlineStart);
+  padding-inline-end: var(--#{$calendar-month}--PaddingInlineEnd);
   font-size: var(--#{$calendar-month}--FontSize);
   background-color: var(--#{$calendar-month}--BackgroundColor);
 }
@@ -85,14 +85,14 @@
 .#{$calendar-month}__header {
   display: flex;
   gap: var(--#{$calendar-month}__header--Gap);
-  margin-block-end: var(--#{$calendar-month}__header--MarginBottom);
+  margin-block-end: var(--#{$calendar-month}__header--MarginBlockEnd);
 }
 
 .#{$calendar-month}__header-nav-control {
   @include pf-v6-mirror-inline-on-rtl;
 
-  margin-inline-start: var(--#{$calendar-month}__header-nav-control--MarginLeft);
-  margin-inline-end: var(--#{$calendar-month}__header-nav-control--MarginRight);
+  margin-inline-start: var(--#{$calendar-month}__header-nav-control--MarginInlineStart);
+  margin-inline-end: var(--#{$calendar-month}__header-nav-control--MarginInlineEnd);
 
 }
 
@@ -114,35 +114,35 @@
 
 .#{$calendar-month}__days {
   color: var(--#{$calendar-month}__day--Color);
-  border-block-end: var(--#{$calendar-month}__days--BorderBottomWidth) solid var(--#{$calendar-month}__days--BorderBottomColor);
+  border-block-end: var(--#{$calendar-month}__days--BorderBlockEndWidth) solid var(--#{$calendar-month}__days--BorderBlockEndColor);
 }
 
 .#{$calendar-month}__day {
-  padding-block-end: var(--#{$calendar-month}__day--PaddingBottom);
+  padding-block-end: var(--#{$calendar-month}__day--PaddingBlockEnd);
   font-weight: var(--#{$calendar-month}__day--FontWeight);
   text-align: center;
 }
 
 .#{$calendar-month}__dates-row:first-child {
-  --#{$calendar-month}__dates-cell--PaddingTop: var(--#{$calendar-month}__dates-row--first-child__dates-cell--PaddingTop);
+  --#{$calendar-month}__dates-cell--PaddingBlockStart: var(--#{$calendar-month}__dates-row--first-child__dates-cell--PaddingBlockStart);
 }
 
 .#{$calendar-month}__dates-cell {
-  --#{$calendar-month}__dates-cell--before--Top: var(--#{$calendar-month}__dates-cell--PaddingTop);
+  --#{$calendar-month}__dates-cell--before--InsetBlockStart: var(--#{$calendar-month}__dates-cell--PaddingBlockStart);
 
   position: relative;
-  padding-block-start: var(--#{$calendar-month}__dates-cell--PaddingTop);
-  padding-block-end: var(--#{$calendar-month}__dates-cell--PaddingBottom);
-  padding-inline-start: var(--#{$calendar-month}__dates-cell--PaddingLeft);
-  padding-inline-end: var(--#{$calendar-month}__dates-cell--PaddingRight);
+  padding-block-start: var(--#{$calendar-month}__dates-cell--PaddingBlockStart);
+  padding-block-end: var(--#{$calendar-month}__dates-cell--PaddingBlockEnd);
+  padding-inline-start: var(--#{$calendar-month}__dates-cell--PaddingInlineStart);
+  padding-inline-end: var(--#{$calendar-month}__dates-cell--PaddingInlineEnd);
   text-align: center;
 
   &::before {
     position: absolute;
-    inset-block-start: var(--#{$calendar-month}__dates-cell--before--Top);
-    inset-block-end: var(--#{$calendar-month}__dates-cell--before--Bottom);
-    inset-inline-start: var(--#{$calendar-month}__dates-cell--before--Left);
-    inset-inline-end: var(--#{$calendar-month}__dates-cell--before--Right);
+    inset-block-start: var(--#{$calendar-month}__dates-cell--before--InsetBlockStart);
+    inset-block-end: var(--#{$calendar-month}__dates-cell--before--InsetBlockEnd);
+    inset-inline-start: var(--#{$calendar-month}__dates-cell--before--InsetInlineStart);
+    inset-inline-end: var(--#{$calendar-month}__dates-cell--before--InsetInlineEnd);
     content: "";
     background-color: var(--#{$calendar-month}__dates-cell--before--BackgroundColor);
   }
@@ -160,11 +160,11 @@
   }
 
   &.pf-m-start-range {
-    --#{$calendar-month}__dates-cell--before--Left: var(--#{$calendar-month}__dates-cell--m-in-range--m-start-range--before--Left);
+    --#{$calendar-month}__dates-cell--before--InsetInlineStart: var(--#{$calendar-month}__dates-cell--m-in-range--m-start-range--before--InsetInlineStart);
   }
 
   &.pf-m-end-range {
-    --#{$calendar-month}__dates-cell--before--Right: var(--#{$calendar-month}__dates-cell--m-in-range--m-end-range--before--Right);
+    --#{$calendar-month}__dates-cell--before--InsetInlineEnd: var(--#{$calendar-month}__dates-cell--m-in-range--m-end-range--before--InsetInlineEnd);
   }
 
   &.pf-m-adjacent-month {

package/components/Card/card.css

@@ -4,12 +4,12 @@
   --pf-v6-c-card--BorderStyle: solid;
   --pf-v6-c-card--BorderWidth: var(--pf-t--global--border--width--box--default);
   --pf-v6-c-card--BorderRadius: var(--pf-t--global--border--radius--medium);
-  --pf-v6-c-card--first-child--PaddingTop: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-card--child--PaddingRight: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-card--child--PaddingBottom: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-card--child--PaddingLeft: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-card--c-divider--child--PaddingTop: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-card__title--not--last-child--PaddingBottom: var(--pf-t--global--spacer--md);
+  --pf-v6-c-card--first-child--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-card--child--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-card--child--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-card--child--PaddingInlineStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-card--c-divider--child--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-card__title--not--last-child--PaddingBlockEnd: var(--pf-t--global--spacer--md);
   --pf-v6-c-card__title-text--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-card__title-text--FontFamily: var(--pf-t--global--font--family--heading);
   --pf-v6-c-card__title-text--FontSize: var(--pf-t--global--font--size--heading--sm);
@@ -19,14 +19,14 @@
   --pf-v6-c-card__body--FontSize: var(--pf-t--global--font--size--body--default);
   --pf-v6-c-card__footer--FontSize: var(--pf-t--global--font--size--body--default);
   --pf-v6-c-card__footer--Color: var(--pf-t--global--text--color--subtle);
-  --pf-v6-c-card__actions--PaddingLeft: var(--pf-t--global--spacer--md);
+  --pf-v6-c-card__actions--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-card__actions--Gap: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-card__actions--MarginTop: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
-  --pf-v6-c-card__actions--MarginBottom: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
-  --pf-v6-c-card__header-toggle--MarginTop: calc(var(--pf-t--global--spacer--button--vertical--default) * -1);
-  --pf-v6-c-card__header-toggle--MarginRight: var(--pf-t--global--spacer--xs);
-  --pf-v6-c-card__header-toggle--MarginBottom: calc(var(--pf-t--global--spacer--button--vertical--default) * -1);
-  --pf-v6-c-card__header-toggle--MarginLeft: calc(var(--pf-t--global--spacer--md) * -1);
+  --pf-v6-c-card__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --pf-v6-c-card__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --pf-v6-c-card__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--button--vertical--default) * -1);
+  --pf-v6-c-card__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
+  --pf-v6-c-card__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--button--vertical--default) * -1);
+  --pf-v6-c-card__header-toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--md) * -1);
   --pf-v6-c-card__header-toggle-icon--Transition: var(--pf-t--global--transition);
   --pf-v6-c-card--m-expanded__header-toggle-icon--Rotate: 90deg;
   --pf-v6-c-card--m-selectable--BorderWidth: var(--pf-v6-c-card--BorderWidth);
@@ -47,28 +47,28 @@
   --pf-v6-c-card--m-compact__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
   --pf-v6-c-card--m-compact__body--FontSize: var(--pf-t--global--font--size--body--default);
   --pf-v6-c-card--m-compact__footer--FontSize: var(--pf-t--global--font--size--body--sm);
-  --pf-v6-c-card--m-compact--first-child--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-card--m-compact--child--PaddingRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-card--m-compact--child--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-card--m-compact--child--PaddingLeft: var(--pf-t--global--spacer--md);
-  --pf-v6-c-card--m-compact--c-divider--child--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-card--m-compact__title--not--last-child--PaddingBottom: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-card--m-compact--first-child--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-card--m-compact--child--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-card--m-compact--child--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-card--m-compact--child--PaddingInlineStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-card--m-compact--c-divider--child--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-card--m-compact__title--not--last-child--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-card--m-display-lg__title-text--FontSize: var(--pf-t--global--font--size--heading--md);
   --pf-v6-c-card--m-display-lg__body--FontSize: var(--pf-t--global--font--size--body--lg);
   --pf-v6-c-card--m-display-lg__footer--FontSize: var(--pf-t--global--font--size--body--default);
-  --pf-v6-c-card--m-display-lg--first-child--PaddingTop: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-card--m-display-lg--child--PaddingRight: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-card--m-display-lg--child--PaddingBottom: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-card--m-display-lg--child--PaddingLeft: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-card--m-display-lg--c-divider--child--PaddingTop: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-card--m-display-lg__title--not--last-child--PaddingBottom: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-card--m-display-lg--first-child--PaddingBlockStart: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-card--m-display-lg--child--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-card--m-display-lg--child--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-card--m-display-lg--child--PaddingInlineStart: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-card--m-display-lg--c-divider--child--PaddingBlockStart: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-card--m-display-lg__title--not--last-child--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
   --pf-v6-c-card--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
   --pf-v6-c-card--m-secondary--BorderColor: transparent;
   --pf-v6-c-card--m-full-height--Height: 100%;
   --pf-v6-c-card--m-plain--BorderColor: transparent;
   --pf-v6-c-card--m-plain--BackgroundColor: transparent;
-  --pf-v6-c-card__header--m-toggle-right--toggle--MarginRight: calc(var(--pf-t--global--spacer--button--horizontal--compact) * -1);
-  --pf-v6-c-card__header--m-toggle-right--toggle--MarginLeft: var(--pf-t--global--spacer--xs);
+  --pf-v6-c-card__header--m-toggle-right--toggle--MarginInlineEnd: calc(var(--pf-t--global--spacer--button--horizontal--compact) * -1);
+  --pf-v6-c-card__header--m-toggle-right--toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
 }
 
 .pf-v6-c-card {
@@ -119,23 +119,23 @@
   --pf-v6-c-card__title-text--FontSize: var(--pf-v6-c-card--m-compact__title-text--FontSize);
   --pf-v6-c-card__body--FontSize: var(--pf-v6-c-card--m-compact__body--FontSize);
   --pf-v6-c-card__footer--FontSize: var(--pf-v6-c-card--m-compact__footer--FontSize);
-  --pf-v6-c-card--first-child--PaddingTop: var(--pf-v6-c-card--m-compact--first-child--PaddingTop);
-  --pf-v6-c-card--child--PaddingRight: var(--pf-v6-c-card--m-compact--child--PaddingRight);
-  --pf-v6-c-card--child--PaddingBottom: var(--pf-v6-c-card--m-compact--child--PaddingBottom);
-  --pf-v6-c-card--child--PaddingLeft: var(--pf-v6-c-card--m-compact--child--PaddingLeft);
-  --pf-v6-c-card--c-divider--child--PaddingTop: var(--pf-v6-c-card--m-compact--c-divider--child--PaddingTop);
-  --pf-v6-c-card__title--not--last-child--PaddingBottom: var(--pf-v6-c-card--m-compact__title--not--last-child--PaddingBottom);
+  --pf-v6-c-card--first-child--PaddingBlockStart: var(--pf-v6-c-card--m-compact--first-child--PaddingBlockStart);
+  --pf-v6-c-card--child--PaddingInlineEnd: var(--pf-v6-c-card--m-compact--child--PaddingInlineEnd);
+  --pf-v6-c-card--child--PaddingBlockEnd: var(--pf-v6-c-card--m-compact--child--PaddingBlockEnd);
+  --pf-v6-c-card--child--PaddingInlineStart: var(--pf-v6-c-card--m-compact--child--PaddingInlineStart);
+  --pf-v6-c-card--c-divider--child--PaddingBlockStart: var(--pf-v6-c-card--m-compact--c-divider--child--PaddingBlockStart);
+  --pf-v6-c-card__title--not--last-child--PaddingBlockEnd: var(--pf-v6-c-card--m-compact__title--not--last-child--PaddingBlockEnd);
 }
 .pf-v6-c-card.pf-m-display-lg {
   --pf-v6-c-card__title-text--FontSize: var(--pf-v6-c-card--m-display-lg__title-text--FontSize);
   --pf-v6-c-card__body--FontSize: var(--pf-v6-c-card--m-display-lg__body--FontSize);
   --pf-v6-c-card__footer--FontSize: var(--pf-v6-c-card--m-display-lg__footer--FontSize);
-  --pf-v6-c-card--first-child--PaddingTop: var(--pf-v6-c-card--m-display-lg--first-child--PaddingTop);
-  --pf-v6-c-card--child--PaddingRight: var(--pf-v6-c-card--m-display-lg--child--PaddingRight);
-  --pf-v6-c-card--child--PaddingBottom: var(--pf-v6-c-card--m-display-lg--child--PaddingBottom);
-  --pf-v6-c-card--child--PaddingLeft: var(--pf-v6-c-card--m-display-lg--child--PaddingLeft);
-  --pf-v6-c-card--c-divider--child--PaddingTop: var(--pf-v6-c-card--m-display-lg--c-divider--child--PaddingTop);
-  --pf-v6-c-card__title--not--last-child--PaddingBottom: var(--pf-v6-c-card--m-display-lg__title--not--last-child--PaddingBottom);
+  --pf-v6-c-card--first-child--PaddingBlockStart: var(--pf-v6-c-card--m-display-lg--first-child--PaddingBlockStart);
+  --pf-v6-c-card--child--PaddingInlineEnd: var(--pf-v6-c-card--m-display-lg--child--PaddingInlineEnd);
+  --pf-v6-c-card--child--PaddingBlockEnd: var(--pf-v6-c-card--m-display-lg--child--PaddingBlockEnd);
+  --pf-v6-c-card--child--PaddingInlineStart: var(--pf-v6-c-card--m-display-lg--child--PaddingInlineStart);
+  --pf-v6-c-card--c-divider--child--PaddingBlockStart: var(--pf-v6-c-card--m-display-lg--c-divider--child--PaddingBlockStart);
+  --pf-v6-c-card__title--not--last-child--PaddingBlockEnd: var(--pf-v6-c-card--m-display-lg__title--not--last-child--PaddingBlockEnd);
 }
 .pf-v6-c-card.pf-m-secondary {
   --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-secondary--BorderColor);
@@ -152,7 +152,7 @@
   height: var(--pf-v6-c-card--m-full-height--Height);
 }
 .pf-v6-c-card > .pf-v6-c-divider + .pf-v6-c-card__header, .pf-v6-c-card > .pf-v6-c-divider + .pf-v6-c-card__title, .pf-v6-c-card > .pf-v6-c-divider + .pf-v6-c-card__body, .pf-v6-c-card > .pf-v6-c-divider + .pf-v6-c-card__footer {
-  padding-block-start: var(--pf-v6-c-card--c-divider--child--PaddingTop);
+  padding-block-start: var(--pf-v6-c-card--c-divider--child--PaddingBlockStart);
 }
 
 .pf-v6-c-card__header {
@@ -161,13 +161,13 @@
   align-items: center;
 }
 .pf-v6-c-card__header .pf-v6-c-card__title {
-  --pf-v6-c-card--first-child--PaddingTop: 0;
-  --pf-v6-c-card__title--not--last-child--PaddingBottom: 0;
+  --pf-v6-c-card--first-child--PaddingBlockStart: 0;
+  --pf-v6-c-card__title--not--last-child--PaddingBlockEnd: 0;
   padding: 0;
 }
 .pf-v6-c-card__header.pf-m-toggle-right {
-  --pf-v6-c-card__header-toggle--MarginRight: var(--pf-v6-c-card__header--m-toggle-right--toggle--MarginRight);
-  --pf-v6-c-card__header-toggle--MarginLeft: var(--pf-v6-c-card__header--m-toggle-right--toggle--MarginLeft);
+  --pf-v6-c-card__header-toggle--MarginInlineEnd: var(--pf-v6-c-card__header--m-toggle-right--toggle--MarginInlineEnd);
+  --pf-v6-c-card__header-toggle--MarginInlineStart: var(--pf-v6-c-card__header--m-toggle-right--toggle--MarginInlineStart);
 }
 .pf-v6-c-card__header.pf-m-toggle-right .pf-v6-c-card__header-toggle {
   order: 2;
@@ -179,10 +179,10 @@
 
 .pf-v6-c-card__header-toggle {
   align-self: flex-start;
-  margin-block-start: var(--pf-v6-c-card__header-toggle--MarginTop);
-  margin-block-end: var(--pf-v6-c-card__header-toggle--MarginBottom);
-  margin-inline-start: var(--pf-v6-c-card__header-toggle--MarginLeft);
-  margin-inline-end: var(--pf-v6-c-card__header-toggle--MarginRight);
+  margin-block-start: var(--pf-v6-c-card__header-toggle--MarginBlockStart);
+  margin-block-end: var(--pf-v6-c-card__header-toggle--MarginBlockEnd);
+  margin-inline-start: var(--pf-v6-c-card__header-toggle--MarginInlineStart);
+  margin-inline-end: var(--pf-v6-c-card__header-toggle--MarginInlineEnd);
 }
 
 .pf-v6-c-card__header-toggle-icon {
@@ -207,9 +207,9 @@
   align-items: center;
   align-self: flex-start;
   order: 1;
-  padding-inline-start: var(--pf-v6-c-card__actions--PaddingLeft);
-  margin-block-start: var(--pf-v6-c-card__actions--MarginTop);
-  margin-block-end: var(--pf-v6-c-card__actions--MarginBottom);
+  padding-inline-start: var(--pf-v6-c-card__actions--PaddingInlineStart);
+  margin-block-start: var(--pf-v6-c-card__actions--MarginBlockStart);
+  margin-block-end: var(--pf-v6-c-card__actions--MarginBlockEnd);
   margin-inline-start: auto;
 }
 .pf-v6-c-card__actions + .pf-v6-c-card__title,
@@ -218,8 +218,8 @@
   padding: 0;
 }
 .pf-v6-c-card__actions.pf-m-no-offset {
-  --pf-v6-c-card__actions--MarginTop: 0;
-  --pf-v6-c-card__actions--MarginBottom: 0;
+  --pf-v6-c-card__actions--MarginBlockStart: 0;
+  --pf-v6-c-card__actions--MarginBlockEnd: 0;
 }
 
 .pf-v6-c-card__selectable-actions .pf-v6-c-check__label,
@@ -277,20 +277,20 @@
 .pf-v6-c-card__title,
 .pf-v6-c-card__body,
 .pf-v6-c-card__footer {
-  padding-block-end: var(--pf-v6-c-card--child--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-card--child--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-card--child--PaddingRight);
+  padding-block-end: var(--pf-v6-c-card--child--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-card--child--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-card--child--PaddingInlineEnd);
 }
 .pf-v6-c-card__header:first-child,
 .pf-v6-c-card__title:first-child,
 .pf-v6-c-card__body:first-child,
 .pf-v6-c-card__footer:first-child {
-  padding-block-start: var(--pf-v6-c-card--first-child--PaddingTop);
+  padding-block-start: var(--pf-v6-c-card--first-child--PaddingBlockStart);
 }
 
 .pf-v6-c-card__header:not(:last-child),
 .pf-v6-c-card__title:not(:last-child) {
-  padding-block-end: var(--pf-v6-c-card__title--not--last-child--PaddingBottom);
+  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 {
@@ -298,7 +298,7 @@
 }
 
 .pf-v6-c-card__expandable-content {
-  --pf-v6-c-card--first-child--PaddingTop: 0;
+  --pf-v6-c-card--first-child--PaddingBlockStart: 0;
 }
 
 .pf-v6-c-card__body:not(.pf-m-no-fill) {

package/components/Card/card.scss

@@ -6,12 +6,12 @@
   --#{$card}--BorderStyle: solid;
   --#{$card}--BorderWidth: var(--pf-t--global--border--width--box--default);
   --#{$card}--BorderRadius: var(--pf-t--global--border--radius--medium);
-  --#{$card}--first-child--PaddingTop: var(--pf-t--global--spacer--lg);
-  --#{$card}--child--PaddingRight: var(--pf-t--global--spacer--lg);
-  --#{$card}--child--PaddingBottom: var(--pf-t--global--spacer--lg);
-  --#{$card}--child--PaddingLeft: var(--pf-t--global--spacer--lg);
-  --#{$card}--c-divider--child--PaddingTop: var(--pf-t--global--spacer--lg);
-  --#{$card}__title--not--last-child--PaddingBottom: var(--pf-t--global--spacer--md);
+  --#{$card}--first-child--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --#{$card}--child--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --#{$card}--child--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
+  --#{$card}--child--PaddingInlineStart: var(--pf-t--global--spacer--lg);
+  --#{$card}--c-divider--child--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --#{$card}__title--not--last-child--PaddingBlockEnd: var(--pf-t--global--spacer--md);
   --#{$card}__title-text--Color: var(--pf-t--global--text--color--regular);
   --#{$card}__title-text--FontFamily: var(--pf-t--global--font--family--heading);
   --#{$card}__title-text--FontSize: var(--pf-t--global--font--size--heading--sm);
@@ -21,16 +21,16 @@
   --#{$card}__body--FontSize: var(--pf-t--global--font--size--body--default);
   --#{$card}__footer--FontSize: var(--pf-t--global--font--size--body--default);
   --#{$card}__footer--Color: var(--pf-t--global--text--color--subtle);
-  --#{$card}__actions--PaddingLeft: var(--pf-t--global--spacer--md);
+  --#{$card}__actions--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --#{$card}__actions--Gap: var(--pf-t--global--spacer--sm);
-  --#{$card}__actions--MarginTop: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
-  --#{$card}__actions--MarginBottom: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --#{$card}__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --#{$card}__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
 
   // Expandable
-  --#{$card}__header-toggle--MarginTop: calc(var(--pf-t--global--spacer--button--vertical--default) * -1);
-  --#{$card}__header-toggle--MarginRight: var(--pf-t--global--spacer--xs);
-  --#{$card}__header-toggle--MarginBottom: calc(var(--pf-t--global--spacer--button--vertical--default) * -1);
-  --#{$card}__header-toggle--MarginLeft: calc(var(--pf-t--global--spacer--md) * -1);
+  --#{$card}__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--button--vertical--default) * -1);
+  --#{$card}__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
+  --#{$card}__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--button--vertical--default) * -1);
+  --#{$card}__header-toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--md) * -1);
   --#{$card}__header-toggle-icon--Transition: var(--pf-t--global--transition);
   --#{$card}--m-expanded__header-toggle-icon--Rotate: 90deg;
 
@@ -69,23 +69,23 @@
   --#{$card}--m-compact__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
   --#{$card}--m-compact__body--FontSize: var(--pf-t--global--font--size--body--default);
   --#{$card}--m-compact__footer--FontSize: var(--pf-t--global--font--size--body--sm);
-  --#{$card}--m-compact--first-child--PaddingTop: var(--pf-t--global--spacer--md);
-  --#{$card}--m-compact--child--PaddingRight: var(--pf-t--global--spacer--md);
-  --#{$card}--m-compact--child--PaddingBottom: var(--pf-t--global--spacer--md);
-  --#{$card}--m-compact--child--PaddingLeft: var(--pf-t--global--spacer--md);
-  --#{$card}--m-compact--c-divider--child--PaddingTop: var(--pf-t--global--spacer--md);
-  --#{$card}--m-compact__title--not--last-child--PaddingBottom: var(--pf-t--global--spacer--sm);
+  --#{$card}--m-compact--first-child--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --#{$card}--m-compact--child--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --#{$card}--m-compact--child--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --#{$card}--m-compact--child--PaddingInlineStart: var(--pf-t--global--spacer--md);
+  --#{$card}--m-compact--c-divider--child--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --#{$card}--m-compact__title--not--last-child--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
 
   // Display large
   --#{$card}--m-display-lg__title-text--FontSize: var(--pf-t--global--font--size--heading--md);
   --#{$card}--m-display-lg__body--FontSize: var(--pf-t--global--font--size--body--lg);
   --#{$card}--m-display-lg__footer--FontSize: var(--pf-t--global--font--size--body--default);
-  --#{$card}--m-display-lg--first-child--PaddingTop: var(--pf-t--global--spacer--xl);
-  --#{$card}--m-display-lg--child--PaddingRight: var(--pf-t--global--spacer--xl);
-  --#{$card}--m-display-lg--child--PaddingBottom: var(--pf-t--global--spacer--xl);
-  --#{$card}--m-display-lg--child--PaddingLeft: var(--pf-t--global--spacer--xl);
-  --#{$card}--m-display-lg--c-divider--child--PaddingTop: var(--pf-t--global--spacer--xl);
-  --#{$card}--m-display-lg__title--not--last-child--PaddingBottom: var(--pf-t--global--spacer--lg);
+  --#{$card}--m-display-lg--first-child--PaddingBlockStart: var(--pf-t--global--spacer--xl);
+  --#{$card}--m-display-lg--child--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
+  --#{$card}--m-display-lg--child--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
+  --#{$card}--m-display-lg--child--PaddingInlineStart: var(--pf-t--global--spacer--xl);
+  --#{$card}--m-display-lg--c-divider--child--PaddingBlockStart: var(--pf-t--global--spacer--xl);
+  --#{$card}--m-display-lg__title--not--last-child--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
 
   // Secondary
   --#{$card}--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
@@ -99,8 +99,8 @@
   --#{$card}--m-plain--BackgroundColor: transparent;
 
   // Toggle right
-  --#{$card}__header--m-toggle-right--toggle--MarginRight: calc(var(--pf-t--global--spacer--button--horizontal--compact) * -1);
-  --#{$card}__header--m-toggle-right--toggle--MarginLeft: var(--pf-t--global--spacer--xs);
+  --#{$card}__header--m-toggle-right--toggle--MarginInlineEnd: calc(var(--pf-t--global--spacer--button--horizontal--compact) * -1);
+  --#{$card}__header--m-toggle-right--toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
 }
 
 .#{$card} {
@@ -175,24 +175,24 @@
     --#{$card}__title-text--FontSize: var(--#{$card}--m-compact__title-text--FontSize);
     --#{$card}__body--FontSize: var(--#{$card}--m-compact__body--FontSize);
     --#{$card}__footer--FontSize: var(--#{$card}--m-compact__footer--FontSize);
-    --#{$card}--first-child--PaddingTop: var(--#{$card}--m-compact--first-child--PaddingTop);
-    --#{$card}--child--PaddingRight: var(--#{$card}--m-compact--child--PaddingRight);
-    --#{$card}--child--PaddingBottom: var(--#{$card}--m-compact--child--PaddingBottom);
-    --#{$card}--child--PaddingLeft: var(--#{$card}--m-compact--child--PaddingLeft);
-    --#{$card}--c-divider--child--PaddingTop: var(--#{$card}--m-compact--c-divider--child--PaddingTop);
-    --#{$card}__title--not--last-child--PaddingBottom: var(--#{$card}--m-compact__title--not--last-child--PaddingBottom);
+    --#{$card}--first-child--PaddingBlockStart: var(--#{$card}--m-compact--first-child--PaddingBlockStart);
+    --#{$card}--child--PaddingInlineEnd: var(--#{$card}--m-compact--child--PaddingInlineEnd);
+    --#{$card}--child--PaddingBlockEnd: var(--#{$card}--m-compact--child--PaddingBlockEnd);
+    --#{$card}--child--PaddingInlineStart: var(--#{$card}--m-compact--child--PaddingInlineStart);
+    --#{$card}--c-divider--child--PaddingBlockStart: var(--#{$card}--m-compact--c-divider--child--PaddingBlockStart);
+    --#{$card}__title--not--last-child--PaddingBlockEnd: var(--#{$card}--m-compact__title--not--last-child--PaddingBlockEnd);
   }
 
   &.pf-m-display-lg {
     --#{$card}__title-text--FontSize: var(--#{$card}--m-display-lg__title-text--FontSize);
     --#{$card}__body--FontSize: var(--#{$card}--m-display-lg__body--FontSize);
     --#{$card}__footer--FontSize: var(--#{$card}--m-display-lg__footer--FontSize);
-    --#{$card}--first-child--PaddingTop: var(--#{$card}--m-display-lg--first-child--PaddingTop);
-    --#{$card}--child--PaddingRight: var(--#{$card}--m-display-lg--child--PaddingRight);
-    --#{$card}--child--PaddingBottom: var(--#{$card}--m-display-lg--child--PaddingBottom);
-    --#{$card}--child--PaddingLeft: var(--#{$card}--m-display-lg--child--PaddingLeft);
-    --#{$card}--c-divider--child--PaddingTop: var(--#{$card}--m-display-lg--c-divider--child--PaddingTop);
-    --#{$card}__title--not--last-child--PaddingBottom: var(--#{$card}--m-display-lg__title--not--last-child--PaddingBottom);
+    --#{$card}--first-child--PaddingBlockStart: var(--#{$card}--m-display-lg--first-child--PaddingBlockStart);
+    --#{$card}--child--PaddingInlineEnd: var(--#{$card}--m-display-lg--child--PaddingInlineEnd);
+    --#{$card}--child--PaddingBlockEnd: var(--#{$card}--m-display-lg--child--PaddingBlockEnd);
+    --#{$card}--child--PaddingInlineStart: var(--#{$card}--m-display-lg--child--PaddingInlineStart);
+    --#{$card}--c-divider--child--PaddingBlockStart: var(--#{$card}--m-display-lg--c-divider--child--PaddingBlockStart);
+    --#{$card}__title--not--last-child--PaddingBlockEnd: var(--#{$card}--m-display-lg__title--not--last-child--PaddingBlockEnd);
   }
 
   &.pf-m-secondary {
@@ -220,7 +220,7 @@
     & + .#{$card}__title,
     & + .#{$card}__body,
     & + .#{$card}__footer {
-      padding-block-start: var(--#{$card}--c-divider--child--PaddingTop);
+      padding-block-start: var(--#{$card}--c-divider--child--PaddingBlockStart);
     }
   }
 }
@@ -231,15 +231,15 @@
   align-items: center;
 
   .#{$card}__title {
-    --#{$card}--first-child--PaddingTop: 0;
-    --#{$card}__title--not--last-child--PaddingBottom: 0;
+    --#{$card}--first-child--PaddingBlockStart: 0;
+    --#{$card}__title--not--last-child--PaddingBlockEnd: 0;
 
     padding: 0;
   }
 
   &.pf-m-toggle-right {
-    --#{$card}__header-toggle--MarginRight: var(--#{$card}__header--m-toggle-right--toggle--MarginRight);
-    --#{$card}__header-toggle--MarginLeft: var(--#{$card}__header--m-toggle-right--toggle--MarginLeft);
+    --#{$card}__header-toggle--MarginInlineEnd: var(--#{$card}__header--m-toggle-right--toggle--MarginInlineEnd);
+    --#{$card}__header-toggle--MarginInlineStart: var(--#{$card}__header--m-toggle-right--toggle--MarginInlineStart);
 
     .#{$card}__header-toggle {
       order: 2;
@@ -253,10 +253,10 @@
 
 .#{$card}__header-toggle {
   align-self: flex-start;
-  margin-block-start: var(--#{$card}__header-toggle--MarginTop);
-  margin-block-end: var(--#{$card}__header-toggle--MarginBottom);
-  margin-inline-start: var(--#{$card}__header-toggle--MarginLeft);
-  margin-inline-end: var(--#{$card}__header-toggle--MarginRight);
+  margin-block-start: var(--#{$card}__header-toggle--MarginBlockStart);
+  margin-block-end: var(--#{$card}__header-toggle--MarginBlockEnd);
+  margin-inline-start: var(--#{$card}__header-toggle--MarginInlineStart);
+  margin-inline-end: var(--#{$card}__header-toggle--MarginInlineEnd);
 }
 
 .#{$card}__header-toggle-icon {
@@ -280,9 +280,9 @@
   align-items: center;
   align-self: flex-start;
   order: 1;
-  padding-inline-start: var(--#{$card}__actions--PaddingLeft);
-  margin-block-start: var(--#{$card}__actions--MarginTop);
-  margin-block-end: var(--#{$card}__actions--MarginBottom);
+  padding-inline-start: var(--#{$card}__actions--PaddingInlineStart);
+  margin-block-start: var(--#{$card}__actions--MarginBlockStart);
+  margin-block-end: var(--#{$card}__actions--MarginBlockEnd);
   margin-inline-start: auto;
 
   + .#{$card}__title,
@@ -292,8 +292,8 @@
   }
 
   &.pf-m-no-offset {
-    --#{$card}__actions--MarginTop: 0;
-    --#{$card}__actions--MarginBottom: 0;
+    --#{$card}__actions--MarginBlockStart: 0;
+    --#{$card}__actions--MarginBlockEnd: 0;
   }
 }
 
@@ -357,19 +357,19 @@
 .#{$card}__title,
 .#{$card}__body,
 .#{$card}__footer {
-  padding-block-end: var(--#{$card}--child--PaddingBottom);
-  padding-inline-start: var(--#{$card}--child--PaddingLeft);
-  padding-inline-end: var(--#{$card}--child--PaddingRight);
+  padding-block-end: var(--#{$card}--child--PaddingBlockEnd);
+  padding-inline-start: var(--#{$card}--child--PaddingInlineStart);
+  padding-inline-end: var(--#{$card}--child--PaddingInlineEnd);
 
   &:first-child {
-    padding-block-start: var(--#{$card}--first-child--PaddingTop);
+    padding-block-start: var(--#{$card}--first-child--PaddingBlockStart);
   }
 }
 
 .#{$card}__header,
 .#{$card}__title {
   &:not(:last-child) {
-    padding-block-end: var(--#{$card}__title--not--last-child--PaddingBottom);
+    padding-block-end: var(--#{$card}__title--not--last-child--PaddingBlockEnd);
   }
 
   // Normal disabled button color won't show on the disabled card
@@ -379,7 +379,7 @@
 }
 
 .#{$card}__expandable-content {
-  --#{$card}--first-child--PaddingTop: 0;
+  --#{$card}--first-child--PaddingBlockStart: 0;
 }
 
 .#{$card}__body:not(.pf-m-no-fill) {

package/components/Check/check.css

@@ -9,7 +9,7 @@
   --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
   --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
   --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
-  --pf-v6-c-check__label-required--MarginLeft: var(--pf-t--global--spacer--xs);
+  --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
   --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
   --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
   --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
@@ -72,7 +72,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
 }
 
 .pf-v6-c-check__label-required {
-  margin-inline-start: var(--pf-v6-c-check__label-required--MarginLeft);
+  margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
   font-size: var(--pf-v6-c-check__label-required--FontSize);
   color: var(--pf-v6-c-check__label-required--Color);
 }