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

package/components/Pagination/pagination.scss

@@ -19,7 +19,7 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
   // nav page select
   --#{$pagination}__nav-page-select--FontSize: var(--pf-t--global--font--size--body--default);
   --#{$pagination}__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
-  --#{$pagination}__nav-page-select--c-form-control--width-base: calc((var(--#{$form-control}--PaddingRight) + var(--#{$form-control}--PaddingLeft)) + (var(--#{$form-control}--before--BorderWidth) * 2));
+  --#{$pagination}__nav-page-select--c-form-control--width-base: calc((var(--#{$form-control}--PaddingInlineEnd) + var(--#{$form-control}--PaddingInlineStart)) + (var(--#{$form-control}--before--BorderWidth) * 2));
   --#{$pagination}__nav-page-select--c-form-control--width-chars: 2;
   --#{$pagination}__nav-page-select--c-form-control--Width: calc(var(--#{$pagination}__nav-page-select--c-form-control--width-base) + (var(--#{$pagination}__nav-page-select--c-form-control--width-chars) * 1ch));
 
@@ -31,19 +31,19 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
   // top
   --#{$pagination}--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --#{$pagination}--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
-  --#{$pagination}--m-sticky--PaddingTop: var(--pf-t--global--spacer--md);
-  --#{$pagination}--m-sticky--PaddingRight: var(--pf-t--global--spacer--lg);
-  --#{$pagination}--m-sticky--PaddingBottom: var(--pf-t--global--spacer--md);
-  --#{$pagination}--m-sticky--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --#{$pagination}--m-sticky--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --#{$pagination}--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --#{$pagination}--m-sticky--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --#{$pagination}--m-sticky--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --#{$pagination}--m-sticky--ZIndex: 100; // TODO: replace with z-index token
-  --#{$pagination}--m-sticky--Top: 0;
+  --#{$pagination}--m-sticky--InsetBlockStart: 0;
 
   // bottom
   --#{$pagination}--m-bottom--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --#{$pagination}--m-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
-  --#{$pagination}--m-bottom--Bottom: 0;
-  --#{$pagination}--m-bottom--PaddingRight: var(--pf-t--global--spacer--lg);
-  --#{$pagination}--m-bottom--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --#{$pagination}--m-bottom--InsetBlockEnd: 0;
+  --#{$pagination}--m-bottom--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --#{$pagination}--m-bottom--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --#{$pagination}--m-bottom--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
 
   // options menu
@@ -78,19 +78,19 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
 
   &.pf-m-bottom {
     --#{$pagination}--m-sticky--BoxShadow: var(--#{$pagination}--m-bottom--m-sticky--BoxShadow);
-    --#{$pagination}--m-sticky--Top: auto;
+    --#{$pagination}--m-sticky--InsetBlockStart: auto;
 
     position: sticky;
-    inset-block-end: var(--#{$pagination}--m-bottom--Bottom);
+    inset-block-end: var(--#{$pagination}--m-bottom--InsetBlockEnd);
     justify-content: center;
-    padding-inline-start: var(--#{$pagination}--m-bottom--PaddingLeft);
-    padding-inline-end: var(--#{$pagination}--m-bottom--PaddingRight);
+    padding-inline-start: var(--#{$pagination}--m-bottom--PaddingInlineStart);
+    padding-inline-end: var(--#{$pagination}--m-bottom--PaddingInlineEnd);
     background-color: var(--#{$pagination}--m-bottom--BackgroundColor);
     box-shadow: var(--#{$pagination}--m-bottom--BoxShadow);
 
     &.pf-m-static {
-      --#{$pagination}--m-bottom--MarginTop: 0;
-      --#{$pagination}--m-bottom--BorderTopWidth: 0;
+      --#{$pagination}--m-bottom--MarginBlockStart: 0;
+      --#{$pagination}--m-bottom--BorderBlockStartWidth: 0;
 
       position: relative;
       box-shadow: none;
@@ -114,9 +114,9 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
     }
 
     @media screen and (min-width: $pf-v6-global--breakpoint--md) {
-      --#{$pagination}--m-bottom--BorderTopWidth: 0;
-      --#{$pagination}--m-bottom--MarginTop: 0;
-      --#{$pagination}--m-bottom--Bottom: auto;
+      --#{$pagination}--m-bottom--BorderBlockStartWidth: 0;
+      --#{$pagination}--m-bottom--MarginBlockStart: 0;
+      --#{$pagination}--m-bottom--InsetBlockEnd: auto;
 
       position: relative;
       justify-content: flex-end;
@@ -143,15 +143,15 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
   }
 
   &.pf-m-sticky {
-    --#{$pagination}--m-bottom--Bottom: 0;
+    --#{$pagination}--m-bottom--InsetBlockEnd: 0;
 
     position: sticky;
-    inset-block-start: var(--#{$pagination}--m-sticky--Top);
+    inset-block-start: var(--#{$pagination}--m-sticky--InsetBlockStart);
     z-index: var(--#{$pagination}--m-sticky--ZIndex);
-    padding-block-start: var(--#{$pagination}--m-sticky--PaddingTop);
-    padding-block-end: var(--#{$pagination}--m-sticky--PaddingBottom);
-    padding-inline-start: var(--#{$pagination}--m-sticky--PaddingLeft);
-    padding-inline-end: var(--#{$pagination}--m-sticky--PaddingRight);
+    padding-block-start: var(--#{$pagination}--m-sticky--PaddingBlockStart);
+    padding-block-end: var(--#{$pagination}--m-sticky--PaddingBlockEnd);
+    padding-inline-start: var(--#{$pagination}--m-sticky--PaddingInlineStart);
+    padding-inline-end: var(--#{$pagination}--m-sticky--PaddingInlineEnd);
     background-color: var(--#{$pagination}--m-sticky--BackgroundColor);
     box-shadow: var(--#{$pagination}--m-sticky--BoxShadow);
   }

package/components/Panel/panel.css

@@ -12,20 +12,20 @@
   --pf-v6-c-panel--m-raised--BoxShadow: var(--pf-t--global--box-shadow--md);
   --pf-v6-c-panel--m-raised--ZIndex: var(--pf-t--global--z-index--sm);
   --pf-v6-c-panel--m-raised--BackgroundColor: var(--pf-t--global--background--color--floating--default);
-  --pf-v6-c-panel__header--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__header--PaddingRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__header--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__header--PaddingLeft: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__header--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__header--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-panel__main--MaxHeight: none;
   --pf-v6-c-panel__main--Overflow: visible;
-  --pf-v6-c-panel__main-body--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__main-body--PaddingRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__main-body--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__main-body--PaddingLeft: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__footer--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__footer--PaddingRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__footer--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-panel__footer--PaddingLeft: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__main-body--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__main-body--PaddingInlineStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__footer--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__footer--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__footer--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-panel__footer--BoxShadow: none;
   --pf-v6-c-panel--m-scrollable__main--MaxHeight: 18.75rem;
   --pf-v6-c-panel--m-scrollable__main--Overflow: auto;
@@ -66,10 +66,10 @@
 }
 
 .pf-v6-c-panel__header {
-  padding-block-start: var(--pf-v6-c-panel__header--PaddingTop);
-  padding-block-end: var(--pf-v6-c-panel__header--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-panel__header--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-panel__header--PaddingRight);
+  padding-block-start: var(--pf-v6-c-panel__header--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-panel__header--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-panel__header--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-panel__header--PaddingInlineEnd);
 }
 
 .pf-v6-c-panel__main {
@@ -78,16 +78,16 @@
 }
 
 .pf-v6-c-panel__main-body {
-  padding-block-start: var(--pf-v6-c-panel__main-body--PaddingTop);
-  padding-block-end: var(--pf-v6-c-panel__main-body--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-panel__main-body--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-panel__main-body--PaddingRight);
+  padding-block-start: var(--pf-v6-c-panel__main-body--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-panel__main-body--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-panel__main-body--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-panel__main-body--PaddingInlineEnd);
 }
 
 .pf-v6-c-panel__footer {
-  padding-block-start: var(--pf-v6-c-panel__footer--PaddingTop);
-  padding-block-end: var(--pf-v6-c-panel__footer--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-panel__footer--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-panel__footer--PaddingRight);
+  padding-block-start: var(--pf-v6-c-panel__footer--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-panel__footer--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-panel__footer--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-panel__footer--PaddingInlineEnd);
   box-shadow: var(--pf-v6-c-panel__footer--BoxShadow);
 }

package/components/Panel/panel.scss

@@ -24,26 +24,26 @@
   --#{$panel}--m-raised--BackgroundColor: var(--pf-t--global--background--color--floating--default);
 
   // header
-  --#{$panel}__header--PaddingTop: var(--pf-t--global--spacer--md);
-  --#{$panel}__header--PaddingRight: var(--pf-t--global--spacer--md);
-  --#{$panel}__header--PaddingBottom: var(--pf-t--global--spacer--md);
-  --#{$panel}__header--PaddingLeft: var(--pf-t--global--spacer--md);
+  --#{$panel}__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --#{$panel}__header--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --#{$panel}__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --#{$panel}__header--PaddingInlineStart: var(--pf-t--global--spacer--md);
 
   // main
   --#{$panel}__main--MaxHeight: none;
   --#{$panel}__main--Overflow: visible;
 
   // body
-  --#{$panel}__main-body--PaddingTop: var(--pf-t--global--spacer--md);
-  --#{$panel}__main-body--PaddingRight: var(--pf-t--global--spacer--md);
-  --#{$panel}__main-body--PaddingBottom: var(--pf-t--global--spacer--md);
-  --#{$panel}__main-body--PaddingLeft: var(--pf-t--global--spacer--md);
+  --#{$panel}__main-body--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --#{$panel}__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --#{$panel}__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --#{$panel}__main-body--PaddingInlineStart: var(--pf-t--global--spacer--md);
 
   // footer
-  --#{$panel}__footer--PaddingTop: var(--pf-t--global--spacer--md);
-  --#{$panel}__footer--PaddingRight: var(--pf-t--global--spacer--md);
-  --#{$panel}__footer--PaddingBottom: var(--pf-t--global--spacer--md);
-  --#{$panel}__footer--PaddingLeft: var(--pf-t--global--spacer--md);
+  --#{$panel}__footer--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --#{$panel}__footer--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --#{$panel}__footer--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --#{$panel}__footer--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --#{$panel}__footer--BoxShadow: none;
 
   // scrollable
@@ -91,10 +91,10 @@
 }
 
 .#{$panel}__header {
-  padding-block-start: var(--#{$panel}__header--PaddingTop);
-  padding-block-end: var(--#{$panel}__header--PaddingBottom);
-  padding-inline-start: var(--#{$panel}__header--PaddingLeft);
-  padding-inline-end: var(--#{$panel}__header--PaddingRight);
+  padding-block-start: var(--#{$panel}__header--PaddingBlockStart);
+  padding-block-end: var(--#{$panel}__header--PaddingBlockEnd);
+  padding-inline-start: var(--#{$panel}__header--PaddingInlineStart);
+  padding-inline-end: var(--#{$panel}__header--PaddingInlineEnd);
 }
 
 .#{$panel}__main {
@@ -103,16 +103,16 @@
 }
 
 .#{$panel}__main-body {
-  padding-block-start: var(--#{$panel}__main-body--PaddingTop);
-  padding-block-end: var(--#{$panel}__main-body--PaddingBottom);
-  padding-inline-start: var(--#{$panel}__main-body--PaddingLeft);
-  padding-inline-end: var(--#{$panel}__main-body--PaddingRight);
+  padding-block-start: var(--#{$panel}__main-body--PaddingBlockStart);
+  padding-block-end: var(--#{$panel}__main-body--PaddingBlockEnd);
+  padding-inline-start: var(--#{$panel}__main-body--PaddingInlineStart);
+  padding-inline-end: var(--#{$panel}__main-body--PaddingInlineEnd);
 }
 
 .#{$panel}__footer {
-  padding-block-start: var(--#{$panel}__footer--PaddingTop);
-  padding-block-end: var(--#{$panel}__footer--PaddingBottom);
-  padding-inline-start: var(--#{$panel}__footer--PaddingLeft);
-  padding-inline-end: var(--#{$panel}__footer--PaddingRight);
+  padding-block-start: var(--#{$panel}__footer--PaddingBlockStart);
+  padding-block-end: var(--#{$panel}__footer--PaddingBlockEnd);
+  padding-inline-start: var(--#{$panel}__footer--PaddingInlineStart);
+  padding-inline-end: var(--#{$panel}__footer--PaddingInlineEnd);
   box-shadow: var(--#{$panel}__footer--BoxShadow);
 }

package/components/Popover/popover.css

@@ -1,7 +1,7 @@
 .pf-v6-c-popover {
   --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
-  --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingLeft) + var(--pf-v6-c-popover__content--PaddingRight) + 18.75rem);
-  --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingLeft) + var(--pf-v6-c-popover__content--PaddingRight) + 18.75rem);
+  --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
+  --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
   --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
   --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
   --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
@@ -10,10 +10,10 @@
   --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
   --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
   --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
-  --pf-v6-c-popover__content--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-popover__content--PaddingRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-popover__content--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-popover__content--PaddingLeft: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
   --pf-v6-c-popover__arrow--Width: 0.9375rem;
   --pf-v6-c-popover__arrow--Height: 0.9375rem;
@@ -31,22 +31,22 @@
   --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
   --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
   --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
-  --pf-v6-c-popover__arrow--m-inline-top--Top: var(--pf-t--global--border--radius--medium);
-  --pf-v6-c-popover__arrow--m-inline-bottom--Bottom: var(--pf-t--global--border--radius--medium);
-  --pf-v6-c-popover__arrow--m-block-left--Left: var(--pf-t--global--border--radius--medium);
-  --pf-v6-c-popover__arrow--m-block-right--Right: var(--pf-t--global--border--radius--medium);
-  --pf-v6-c-popover__close--Top: calc(var(--pf-v6-c-popover__content--PaddingTop) - (var(--pf-t--global--spacer--control--vertical--compact) * 1.5));
-  --pf-v6-c-popover__close--Right: var(--pf-v6-c-popover__content--PaddingRight);
-  --pf-v6-c-popover__close--sibling--PaddingRight: var(--pf-t--global--spacer--2xl);
-  --pf-v6-c-popover__header--MarginBottom: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - (var(--pf-t--global--spacer--control--vertical--compact) * 1.5));
+  --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
+  --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
+  --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-popover__title-text--FontFamily: var(--pf-t--global--font--family--body);
   --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--lg);
   --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
-  --pf-v6-c-popover__title-icon--MarginRight: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
   --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--font--size--heading--xs);
-  --pf-v6-c-popover__footer--MarginTop: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
   position: relative;
   min-width: var(--pf-v6-c-popover--MinWidth);
   max-width: var(--pf-v6-c-popover--MaxWidth);
@@ -55,10 +55,10 @@
   box-shadow: var(--pf-v6-c-popover--BoxShadow);
 }
 .pf-v6-c-popover.pf-m-no-padding {
-  --pf-v6-c-popover__content--PaddingTop: 0px;
-  --pf-v6-c-popover__content--PaddingRight: 0px;
-  --pf-v6-c-popover__content--PaddingBottom: 0px;
-  --pf-v6-c-popover__content--PaddingLeft: 0px;
+  --pf-v6-c-popover__content--PaddingBlockStart: 0px;
+  --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
+  --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
+  --pf-v6-c-popover__content--PaddingInlineStart: 0px;
 }
 .pf-v6-c-popover.pf-m-width-auto {
   --pf-v6-c-popover--MinWidth: auto;
@@ -67,8 +67,8 @@
 .pf-v6-c-popover:is(.pf-m-top,
 .pf-m-top-left,
 .pf-m-top-right) {
-  --pf-v6-c-popover__arrow--Bottom: var(--pf-v6-c-popover--m-top--Bottom, 0);
-  --pf-v6-c-popover__arrow--Left: var(--pf-v6-c-popover--m-top--Left, 50%);
+  --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
+  --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
   --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
   --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
   --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
@@ -76,8 +76,8 @@
 .pf-v6-c-popover:is(.pf-m-bottom,
 .pf-m-bottom-left,
 .pf-m-bottom-right) {
-  --pf-v6-c-popover__arrow--Top: var(--pf-v6-c-popover--m-bottom--Top, 0);
-  --pf-v6-c-popover__arrow--Left: var(--pf-v6-c-popover--m-bottom--Left, 50%);
+  --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
+  --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
   --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
   --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
   --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
@@ -85,8 +85,8 @@
 .pf-v6-c-popover:is(.pf-m-left,
 .pf-m-left-top,
 .pf-m-left-bottom) {
-  --pf-v6-c-popover__arrow--Top: var(--pf-v6-c-popover--m-left--Top, 50%);
-  --pf-v6-c-popover__arrow--Right: var(--pf-v6-c-popover--m-left--Right, 0);
+  --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
+  --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
   --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
   --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
   --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
@@ -94,31 +94,31 @@
 .pf-v6-c-popover:is(.pf-m-right,
 .pf-m-right-top,
 .pf-m-right-bottom) {
-  --pf-v6-c-popover__arrow--Top: var(--pf-v6-c-popover--m-right--Top, 50%);
-  --pf-v6-c-popover__arrow--Left: var(--pf-v6-c-popover--m-right--Left, 0);
+  --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
+  --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
   --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
   --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
   --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
 }
 .pf-v6-c-popover:is(.pf-m-left-top,
 .pf-m-right-top) {
-  --pf-v6-c-popover__arrow--Top: var(--pf-v6-c-popover__arrow--m-inline-top--Top);
+  --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
   --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
 }
 .pf-v6-c-popover:is(.pf-m-left-bottom,
 .pf-m-right-bottom) {
-  --pf-v6-c-popover__arrow--Top: auto;
-  --pf-v6-c-popover__arrow--Bottom: var(--pf-v6-c-popover__arrow--m-inline-bottom--Bottom);
+  --pf-v6-c-popover__arrow--InsetBlockStart: auto;
+  --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
 }
 .pf-v6-c-popover:is(.pf-m-top-left,
 .pf-m-bottom-left) {
-  --pf-v6-c-popover__arrow--Left: var(--pf-v6-c-popover__arrow--m-block-left--Left);
+  --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
   --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
 }
 .pf-v6-c-popover:is(.pf-m-top-right,
 .pf-m-bottom-right) {
-  --pf-v6-c-popover__arrow--Right: var(--pf-v6-c-popover__arrow--m-block-right--Right);
-  --pf-v6-c-popover__arrow--Left: auto;
+  --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
+  --pf-v6-c-popover__arrow--InsetInlineStart: auto;
 }
 .pf-v6-c-popover.pf-m-danger {
   --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
@@ -138,29 +138,29 @@
 
 .pf-v6-c-popover__content {
   position: relative;
-  padding-block-start: var(--pf-v6-c-popover__content--PaddingTop);
-  padding-block-end: var(--pf-v6-c-popover__content--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-popover__content--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-popover__content--PaddingRight);
+  padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
   background-color: var(--pf-v6-c-popover__content--BackgroundColor);
   border-radius: var(--pf-v6-c-popover__content--BorderRadius);
 }
 
 .pf-v6-c-popover__close {
   position: absolute;
-  inset-block-start: var(--pf-v6-c-popover__close--Top);
-  inset-inline-end: var(--pf-v6-c-popover__close--Right);
+  inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
+  inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
 }
 .pf-v6-c-popover__close + * {
-  padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingRight);
+  padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
 }
 
 .pf-v6-c-popover__arrow {
   position: absolute;
-  top: var(--pf-v6-c-popover__arrow--Top, auto);
-  right: var(--pf-v6-c-popover__arrow--Right, auto);
-  bottom: var(--pf-v6-c-popover__arrow--Bottom, auto);
-  left: var(--pf-v6-c-popover__arrow--Left, auto);
+  top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
+  right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
+  bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
+  left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
   width: var(--pf-v6-c-popover__arrow--Width);
   height: var(--pf-v6-c-popover__arrow--Height);
   pointer-events: none;
@@ -170,7 +170,7 @@
 }
 
 .pf-v6-c-popover__header {
-  margin-block-end: var(--pf-v6-c-popover__header--MarginBottom);
+  margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
 }
 
 .pf-v6-c-popover__title {
@@ -179,7 +179,7 @@
 }
 
 .pf-v6-c-popover__title-icon {
-  margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginRight);
+  margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
   font-size: var(--pf-v6-c-popover__title-icon--FontSize);
   color: var(--pf-v6-c-popover__title-icon--Color);
 }
@@ -196,5 +196,5 @@
 }
 
 .pf-v6-c-popover__footer {
-  margin-block-start: var(--pf-v6-c-popover__footer--MarginTop);
+  margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
 }