@patternfly/react-styles 6.0.0-alpha.20 → 6.0.0-alpha.22

Sign up to get free protection for your applications and to get access to all the features.
Files changed (205) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/css/components/AboutModalBox/about-modal-box.css +64 -64
  3. package/css/components/Accordion/accordion.css +40 -40
  4. package/css/components/ActionList/action-list.css +1 -1
  5. package/css/components/Alert/alert-group.css +15 -15
  6. package/css/components/Alert/alert.css +47 -47
  7. package/css/components/Avatar/avatar.css +1 -1
  8. package/css/components/BackToTop/back-to-top.css +16 -16
  9. package/css/components/Backdrop/backdrop.css +1 -2
  10. package/css/components/BackgroundImage/background-image.css +1 -2
  11. package/css/components/Badge/badge.css +7 -7
  12. package/css/components/Banner/banner.css +14 -14
  13. package/css/components/Breadcrumb/breadcrumb.css +16 -17
  14. package/css/components/Breadcrumb/breadcrumb.d.ts +1 -1
  15. package/css/components/Breadcrumb/breadcrumb.js +1 -1
  16. package/css/components/Breadcrumb/breadcrumb.mjs +1 -1
  17. package/css/components/Button/button.css +94 -95
  18. package/css/components/CalendarMonth/calendar-month.css +43 -44
  19. package/css/components/Card/card.css +60 -61
  20. package/css/components/Check/check.css +3 -4
  21. package/css/components/ClipboardCopy/clipboard-copy.css +37 -38
  22. package/css/components/CodeBlock/code-block.css +20 -20
  23. package/css/components/CodeEditor/code-editor.css +34 -34
  24. package/css/components/Content/content.css +155 -130
  25. package/css/components/Content/content.d.ts +19 -0
  26. package/css/components/Content/content.js +19 -0
  27. package/css/components/Content/content.mjs +19 -0
  28. package/css/components/DataList/data-list-grid.css +98 -98
  29. package/css/components/DataList/data-list.css +282 -285
  30. package/css/components/DataList/data-list.d.ts +11 -11
  31. package/css/components/DataList/data-list.js +11 -11
  32. package/css/components/DataList/data-list.mjs +11 -11
  33. package/css/components/DatePicker/date-picker.css +15 -16
  34. package/css/components/DescriptionList/description-list.css +13 -13
  35. package/css/components/Divider/divider.css +27 -31
  36. package/css/components/DragDrop/drag-drop.css +2 -2
  37. package/css/components/Drawer/drawer.css +87 -90
  38. package/css/components/DualListSelector/dual-list-selector.css +60 -59
  39. package/css/components/EmptyState/empty-state.css +33 -33
  40. package/css/components/ExpandableSection/expandable-section.css +49 -49
  41. package/css/components/FileUpload/file-upload.css +1 -2
  42. package/css/components/Form/form.css +107 -108
  43. package/css/components/FormControl/form-control.css +45 -46
  44. package/css/components/HelperText/helper-text.css +3 -3
  45. package/css/components/Hint/hint.css +19 -18
  46. package/css/components/Hint/hint.d.ts +1 -2
  47. package/css/components/Hint/hint.js +1 -2
  48. package/css/components/Hint/hint.mjs +1 -2
  49. package/css/components/Icon/icon.css +1 -2
  50. package/css/components/InlineEdit/inline-edit.css +11 -12
  51. package/css/components/InputGroup/input-group.css +17 -18
  52. package/css/components/JumpLinks/jump-links.css +76 -77
  53. package/css/components/Label/label-group.css +27 -28
  54. package/css/components/Label/label.css +31 -32
  55. package/css/components/List/list.css +27 -27
  56. package/css/components/LogViewer/log-viewer.css +53 -77
  57. package/css/components/LogViewer/log-viewer.d.ts +0 -2
  58. package/css/components/LogViewer/log-viewer.js +0 -2
  59. package/css/components/LogViewer/log-viewer.mjs +0 -2
  60. package/css/components/Login/login.css +99 -104
  61. package/css/components/Login/login.d.ts +1 -1
  62. package/css/components/Login/login.js +1 -1
  63. package/css/components/Login/login.mjs +1 -1
  64. package/css/components/Masthead/masthead.css +1 -2
  65. package/css/components/Menu/menu.css +128 -84
  66. package/css/components/MenuToggle/menu-toggle.css +59 -60
  67. package/css/components/ModalBox/modal-box.css +41 -41
  68. package/css/components/MultipleFileUpload/multiple-file-upload.css +33 -34
  69. package/css/components/Nav/nav.css +1 -2
  70. package/css/components/NotificationBadge/notification-badge.css +17 -17
  71. package/css/components/NotificationDrawer/notification-drawer.css +42 -43
  72. package/css/components/NumberInput/number-input.css +8 -12
  73. package/css/components/OverflowMenu/overflow-menu.css +1 -1
  74. package/css/components/Page/page.css +146 -365
  75. package/css/components/Page/page.d.ts +0 -25
  76. package/css/components/Page/page.js +0 -25
  77. package/css/components/Page/page.mjs +0 -25
  78. package/css/components/Pagination/pagination.css +35 -38
  79. package/css/components/Panel/panel.css +25 -26
  80. package/css/components/Popover/popover.css +48 -48
  81. package/css/components/Progress/progress.css +5 -6
  82. package/css/components/ProgressStepper/progress-stepper.css +227 -229
  83. package/css/components/Radio/radio.css +7 -8
  84. package/css/components/Sidebar/sidebar.css +45 -46
  85. package/css/components/SimpleList/simple-list.css +19 -19
  86. package/css/components/Skeleton/skeleton.css +5 -6
  87. package/css/components/SkipToContent/skip-to-content.css +5 -5
  88. package/css/components/Slider/slider.css +26 -27
  89. package/css/components/Spinner/spinner.css +1 -2
  90. package/css/components/Switch/switch.css +5 -6
  91. package/css/components/TabContent/tab-content.css +25 -26
  92. package/css/components/Table/table-grid.css +404 -404
  93. package/css/components/Table/table-scrollable.css +17 -18
  94. package/css/components/Table/table-tree-view.css +257 -258
  95. package/css/components/Table/table-tree-view.d.ts +1 -1
  96. package/css/components/Table/table-tree-view.js +1 -1
  97. package/css/components/Table/table-tree-view.mjs +1 -1
  98. package/css/components/Table/table.css +174 -173
  99. package/css/components/Table/table.d.ts +7 -7
  100. package/css/components/Table/table.js +7 -7
  101. package/css/components/Table/table.mjs +7 -7
  102. package/css/components/Tabs/tabs.css +119 -120
  103. package/css/components/TextInputGroup/text-input-group.css +28 -29
  104. package/css/components/TextInputGroup/text-input-group.d.ts +1 -1
  105. package/css/components/TextInputGroup/text-input-group.js +1 -1
  106. package/css/components/TextInputGroup/text-input-group.mjs +1 -1
  107. package/css/components/Tile/tile.css +14 -15
  108. package/css/components/Timestamp/timestamp.css +1 -1
  109. package/css/components/Title/title.css +1 -1
  110. package/css/components/ToggleGroup/toggle-group.css +29 -30
  111. package/css/components/Toolbar/toolbar.css +250 -132
  112. package/css/components/Toolbar/toolbar.d.ts +2 -2
  113. package/css/components/Toolbar/toolbar.js +2 -2
  114. package/css/components/Toolbar/toolbar.mjs +2 -2
  115. package/css/components/Tooltip/tooltip.css +27 -27
  116. package/css/components/TreeView/tree-view.css +182 -183
  117. package/css/components/Truncate/truncate.css +1 -2
  118. package/css/components/Wizard/wizard.css +158 -140
  119. package/css/components/Wizard/wizard.d.ts +5 -2
  120. package/css/components/Wizard/wizard.js +5 -2
  121. package/css/components/Wizard/wizard.mjs +5 -2
  122. package/css/components/_index.css +23505 -0
  123. package/css/components/_index.d.ts +1497 -0
  124. package/css/components/_index.js +1498 -0
  125. package/css/components/_index.mjs +1496 -0
  126. package/css/docs/components/LogViewer/examples/LogViewer.css +9 -2
  127. package/css/docs/components/LogViewer/examples/LogViewer.d.ts +2 -0
  128. package/css/docs/components/LogViewer/examples/LogViewer.js +2 -0
  129. package/css/docs/components/LogViewer/examples/LogViewer.mjs +2 -0
  130. package/css/docs/components/Nav/examples/Navigation.css +0 -5
  131. package/css/docs/components/Nav/examples/Navigation.d.ts +0 -1
  132. package/css/docs/components/Nav/examples/Navigation.js +0 -1
  133. package/css/docs/components/Nav/examples/Navigation.mjs +0 -1
  134. package/css/docs/components/OverflowMenu/examples/overflow-menu.css +3 -27
  135. package/css/docs/components/Table/examples/Table.css +7 -0
  136. package/css/docs/components/Table/examples/Table.d.ts +2 -0
  137. package/css/docs/components/Table/examples/Table.js +2 -0
  138. package/css/docs/components/Table/examples/Table.mjs +2 -0
  139. package/css/docs/demos/Card/examples/Card.css +2 -2
  140. package/css/docs/demos/Toolbar/examples/Toolbar.css +1 -17
  141. package/css/docs/utilities/Alignment/examples/Alignment.css +2 -2
  142. package/css/docs/utilities/Display/examples/Display.css +3 -10
  143. package/css/docs/utilities/Display/examples/Display.d.ts +0 -8
  144. package/css/docs/utilities/Display/examples/Display.js +0 -8
  145. package/css/docs/utilities/Display/examples/Display.mjs +0 -8
  146. package/css/docs/utilities/Flex/examples/Flex.css +2 -2
  147. package/css/docs/utilities/Float/examples/Float.css +3 -3
  148. package/css/docs/utilities/Sizing/examples/Sizing.css +2 -2
  149. package/css/docs/utilities/Spacing/examples/Spacing.css +2 -2
  150. package/css/layouts/Bullseye/bullseye.css +1 -2
  151. package/css/layouts/Flex/flex.css +1 -2
  152. package/css/layouts/Gallery/gallery.css +1 -2
  153. package/css/layouts/Grid/grid.css +1 -2
  154. package/css/layouts/Level/level.css +1 -2
  155. package/css/layouts/Split/split.css +1 -2
  156. package/css/layouts/Stack/stack.css +1 -2
  157. package/css/layouts/_index.css +3454 -0
  158. package/css/layouts/_index.d.ts +846 -0
  159. package/css/layouts/_index.js +847 -0
  160. package/css/layouts/_index.mjs +845 -0
  161. package/css/utilities/BackgroundColor/{BackgroundColor.d.ts → background-color.d.ts} +1 -1
  162. package/css/utilities/BackgroundColor/{BackgroundColor.js → background-color.js} +1 -1
  163. package/css/utilities/BackgroundColor/{BackgroundColor.mjs → background-color.mjs} +1 -1
  164. package/css/utilities/Display/display.css +38 -0
  165. package/css/utilities/Display/display.d.ts +12 -0
  166. package/css/utilities/Display/display.js +12 -0
  167. package/css/utilities/Display/display.mjs +12 -0
  168. package/css/utilities/_index.css +7815 -0
  169. package/css/utilities/_index.d.ts +1671 -0
  170. package/css/utilities/_index.js +1672 -0
  171. package/css/utilities/_index.mjs +1670 -0
  172. package/package.json +3 -3
  173. package/css/components/AppLauncher/app-launcher.css +0 -244
  174. package/css/components/AppLauncher/app-launcher.d.ts +0 -29
  175. package/css/components/AppLauncher/app-launcher.js +0 -30
  176. package/css/components/AppLauncher/app-launcher.mjs +0 -28
  177. package/css/components/Chip/chip-group.css +0 -93
  178. package/css/components/Chip/chip-group.d.ts +0 -13
  179. package/css/components/Chip/chip-group.js +0 -14
  180. package/css/components/Chip/chip-group.mjs +0 -12
  181. package/css/components/Chip/chip.css +0 -122
  182. package/css/components/Chip/chip.d.ts +0 -16
  183. package/css/components/Chip/chip.js +0 -17
  184. package/css/components/Chip/chip.mjs +0 -15
  185. package/css/components/ContextSelector/context-selector.css +0 -336
  186. package/css/components/ContextSelector/context-selector.d.ts +0 -25
  187. package/css/components/ContextSelector/context-selector.js +0 -26
  188. package/css/components/ContextSelector/context-selector.mjs +0 -24
  189. package/css/components/Dropdown/dropdown.css +0 -686
  190. package/css/components/Dropdown/dropdown.d.ts +0 -55
  191. package/css/components/Dropdown/dropdown.js +0 -56
  192. package/css/components/Dropdown/dropdown.mjs +0 -54
  193. package/css/components/OptionsMenu/options-menu.css +0 -279
  194. package/css/components/OptionsMenu/options-menu.d.ts +0 -27
  195. package/css/components/OptionsMenu/options-menu.js +0 -28
  196. package/css/components/OptionsMenu/options-menu.mjs +0 -26
  197. package/css/components/Select/select.css +0 -599
  198. package/css/components/Select/select.d.ts +0 -61
  199. package/css/components/Select/select.js +0 -62
  200. package/css/components/Select/select.mjs +0 -60
  201. package/css/docs/components/Page/deprecated/PageHeader.css +0 -17
  202. package/css/docs/components/Page/deprecated/PageHeader.d.ts +0 -12
  203. package/css/docs/components/Page/deprecated/PageHeader.js +0 -13
  204. package/css/docs/components/Page/deprecated/PageHeader.mjs +0 -11
  205. /package/css/utilities/BackgroundColor/{BackgroundColor.css → background-color.css} +0 -0
@@ -4,6 +4,13 @@ declare const _default: {
4
4
  "check": "pf-v6-c-check",
5
5
  "dirRtl": "pf-v6-m-dir-rtl",
6
6
  "modifiers": {
7
+ "fixed": "pf-m-fixed",
8
+ "stickyHeader": "pf-m-sticky-header",
9
+ "nestedColumnHeader": "pf-m-nested-column-header",
10
+ "striped": "pf-m-striped",
11
+ "expandable": "pf-m-expandable",
12
+ "stripedEven": "pf-m-striped-even",
13
+ "ghostRow": "pf-m-ghost-row",
7
14
  "hidden": "pf-m-hidden",
8
15
  "hiddenOnSm": "pf-m-hidden-on-sm",
9
16
  "visibleOnSm": "pf-m-visible-on-sm",
@@ -15,13 +22,6 @@ declare const _default: {
15
22
  "visibleOnXl": "pf-m-visible-on-xl",
16
23
  "hiddenOn_2xl": "pf-m-hidden-on-2xl",
17
24
  "visibleOn_2xl": "pf-m-visible-on-2xl",
18
- "fixed": "pf-m-fixed",
19
- "stickyHeader": "pf-m-sticky-header",
20
- "nestedColumnHeader": "pf-m-nested-column-header",
21
- "striped": "pf-m-striped",
22
- "expandable": "pf-m-expandable",
23
- "stripedEven": "pf-m-striped-even",
24
- "ghostRow": "pf-m-ghost-row",
25
25
  "center": "pf-m-center",
26
26
  "help": "pf-m-help",
27
27
  "favorite": "pf-m-favorite",
@@ -6,6 +6,13 @@ exports.default = {
6
6
  "check": "pf-v6-c-check",
7
7
  "dirRtl": "pf-v6-m-dir-rtl",
8
8
  "modifiers": {
9
+ "fixed": "pf-m-fixed",
10
+ "stickyHeader": "pf-m-sticky-header",
11
+ "nestedColumnHeader": "pf-m-nested-column-header",
12
+ "striped": "pf-m-striped",
13
+ "expandable": "pf-m-expandable",
14
+ "stripedEven": "pf-m-striped-even",
15
+ "ghostRow": "pf-m-ghost-row",
9
16
  "hidden": "pf-m-hidden",
10
17
  "hiddenOnSm": "pf-m-hidden-on-sm",
11
18
  "visibleOnSm": "pf-m-visible-on-sm",
@@ -17,13 +24,6 @@ exports.default = {
17
24
  "visibleOnXl": "pf-m-visible-on-xl",
18
25
  "hiddenOn_2xl": "pf-m-hidden-on-2xl",
19
26
  "visibleOn_2xl": "pf-m-visible-on-2xl",
20
- "fixed": "pf-m-fixed",
21
- "stickyHeader": "pf-m-sticky-header",
22
- "nestedColumnHeader": "pf-m-nested-column-header",
23
- "striped": "pf-m-striped",
24
- "expandable": "pf-m-expandable",
25
- "stripedEven": "pf-m-striped-even",
26
- "ghostRow": "pf-m-ghost-row",
27
27
  "center": "pf-m-center",
28
28
  "help": "pf-m-help",
29
29
  "favorite": "pf-m-favorite",
@@ -4,6 +4,13 @@ export default {
4
4
  "check": "pf-v6-c-check",
5
5
  "dirRtl": "pf-v6-m-dir-rtl",
6
6
  "modifiers": {
7
+ "fixed": "pf-m-fixed",
8
+ "stickyHeader": "pf-m-sticky-header",
9
+ "nestedColumnHeader": "pf-m-nested-column-header",
10
+ "striped": "pf-m-striped",
11
+ "expandable": "pf-m-expandable",
12
+ "stripedEven": "pf-m-striped-even",
13
+ "ghostRow": "pf-m-ghost-row",
7
14
  "hidden": "pf-m-hidden",
8
15
  "hiddenOnSm": "pf-m-hidden-on-sm",
9
16
  "visibleOnSm": "pf-m-visible-on-sm",
@@ -15,13 +22,6 @@ export default {
15
22
  "visibleOnXl": "pf-m-visible-on-xl",
16
23
  "hiddenOn_2xl": "pf-m-hidden-on-2xl",
17
24
  "visibleOn_2xl": "pf-m-visible-on-2xl",
18
- "fixed": "pf-m-fixed",
19
- "stickyHeader": "pf-m-sticky-header",
20
- "nestedColumnHeader": "pf-m-nested-column-header",
21
- "striped": "pf-m-striped",
22
- "expandable": "pf-m-expandable",
23
- "stripedEven": "pf-m-striped-even",
24
- "ghostRow": "pf-m-ghost-row",
25
25
  "center": "pf-m-center",
26
26
  "help": "pf-m-help",
27
27
  "favorite": "pf-m-favorite",
@@ -1,25 +1,24 @@
1
- :where(:root),
2
- :where(.pf-v6-c-tabs) {
1
+ :where(:root, .pf-v6-c-tabs) {
3
2
  --pf-v6-c-tabs--inset: 0;
4
3
  --pf-v6-c-tabs--Width: auto;
5
4
  --pf-v6-c-tabs--before--BorderColor: var(--pf-t--global--border--color--default);
6
5
  --pf-v6-c-tabs--before--border-width--base: var(--pf-t--global--border--width--regular);
7
- --pf-v6-c-tabs--before--BorderTopWidth: 0;
8
- --pf-v6-c-tabs--before--BorderRightWidth: 0;
9
- --pf-v6-c-tabs--before--BorderBottomWidth: var(--pf-v6-c-tabs--before--border-width--base);
10
- --pf-v6-c-tabs--before--BorderLeftWidth: 0;
6
+ --pf-v6-c-tabs--before--BorderBlockStartWidth: 0;
7
+ --pf-v6-c-tabs--before--BorderInlineEndWidth: 0;
8
+ --pf-v6-c-tabs--before--BorderBlockEndWidth: var(--pf-v6-c-tabs--before--border-width--base);
9
+ --pf-v6-c-tabs--before--BorderInlineStartWidth: 0;
11
10
  --pf-v6-c-tabs--m-vertical--inset: var(--pf-t--global--spacer--sm);
12
11
  --pf-v6-c-tabs--m-page-insets--inset: var(--pf-t--global--spacer--md);
13
12
  --pf-v6-c-tabs--m-vertical--Width: 100%;
14
13
  --pf-v6-c-tabs--m-vertical--MaxWidth: 15.625rem;
15
14
  --pf-v6-c-tabs--m-vertical--m-box--inset: var(--pf-t--global--spacer--md);
16
15
  --pf-v6-c-tabs--m-vertical__list--before--BorderColor: var(--pf-v6-c-tabs--before--BorderColor);
17
- --pf-v6-c-tabs--m-vertical__list--before--BorderTopWidth: 0;
18
- --pf-v6-c-tabs--m-vertical__list--before--BorderRightWidth: 0;
19
- --pf-v6-c-tabs--m-vertical__list--before--BorderBottomWidth: 0;
20
- --pf-v6-c-tabs--m-vertical__list--before--BorderLeftWidth: var(--pf-v6-c-tabs--before--border-width--base);
21
- --pf-v6-c-tabs--m-box__item--m-current--first-child__link--before--BorderLeftWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
22
- --pf-v6-c-tabs--m-box__item--m-current--last-child__link--before--BorderRightWidth: var(--pf-v6-c-tabs--before--border-width--base);
16
+ --pf-v6-c-tabs--m-vertical__list--before--BorderBlockStartWidth: 0;
17
+ --pf-v6-c-tabs--m-vertical__list--before--BorderInlineEndWidth: 0;
18
+ --pf-v6-c-tabs--m-vertical__list--before--BorderBlockEndWidth: 0;
19
+ --pf-v6-c-tabs--m-vertical__list--before--BorderInlineStartWidth: var(--pf-v6-c-tabs--before--border-width--base);
20
+ --pf-v6-c-tabs--m-box__item--m-current--first-child__link--before--BorderInlineStartWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
21
+ --pf-v6-c-tabs--m-box__item--m-current--last-child__link--before--BorderInlineEndWidth: var(--pf-v6-c-tabs--before--border-width--base);
23
22
  --pf-v6-c-tabs__list--Display: flex;
24
23
  --pf-v6-c-tabs__item--BackgroundColor: transparent;
25
24
  --pf-v6-c-tabs__item--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -39,18 +38,18 @@
39
38
  --pf-v6-c-tabs__link--FontSize: var(--pf-t--global--font--size--sm);
40
39
  --pf-v6-c-tabs__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
41
40
  --pf-v6-c-tabs__link--BorderRadius: var(--pf-t--global--border--radius--small);
42
- --pf-v6-c-tabs__link--PaddingTop: var(--pf-t--global--spacer--xs);
43
- --pf-v6-c-tabs__link--PaddingRight: var(--pf-t--global--spacer--sm);
44
- --pf-v6-c-tabs__link--PaddingBottom: var(--pf-t--global--spacer--xs);
45
- --pf-v6-c-tabs__link--PaddingLeft: var(--pf-t--global--spacer--sm);
41
+ --pf-v6-c-tabs__link--PaddingBlockStart: var(--pf-t--global--spacer--xs);
42
+ --pf-v6-c-tabs__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
43
+ --pf-v6-c-tabs__link--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
44
+ --pf-v6-c-tabs__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
46
45
  --pf-v6-c-tabs__link--ColumnGap: var(--pf-t--global--spacer--sm);
47
46
  --pf-v6-c-tabs__link--disabled--Color: var(--pf-t--global--text--color--on-disabled);
48
47
  --pf-v6-c-tabs__link--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
49
48
  --pf-v6-c-tabs__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
50
49
  --pf-v6-c-tabs__item--m-current__link--Color: var(--pf-t--global--text--color--regular);
51
50
  --pf-v6-c-tabs__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
52
- --pf-v6-c-tabs--m-vertical__link--PaddingLeft: var(--pf-t--global--spacer--sm);
53
- --pf-v6-c-tabs--m-vertical__link--PaddingRight: var(--pf-t--global--spacer--sm);
51
+ --pf-v6-c-tabs--m-vertical__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
52
+ --pf-v6-c-tabs--m-vertical__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
54
53
  --pf-v6-c-tabs--m-box__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
55
54
  --pf-v6-c-tabs--m-box__link--disabled--Color: var(--pf-t--global--text--color--on-disabled);
56
55
  --pf-v6-c-tabs--m-box__link--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
@@ -64,26 +63,26 @@
64
63
  --pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
65
64
  --pf-v6-c-tabs__link--before--border-color--base: var(--pf-t--global--border--color--default);
66
65
  --pf-v6-c-tabs__link--before--border-width--base: var(--pf-t--global--border--width--regular);
67
- --pf-v6-c-tabs__link--before--BorderTopColor: var(--pf-v6-c-tabs__link--before--border-color--base);
68
- --pf-v6-c-tabs__link--before--BorderRightColor: var(--pf-v6-c-tabs__link--before--border-color--base);
69
- --pf-v6-c-tabs__link--before--BorderBottomColor: var(--pf-v6-c-tabs__link--before--border-color--base);
70
- --pf-v6-c-tabs__link--before--BorderLeftColor: var(--pf-v6-c-tabs__link--before--border-color--base);
71
- --pf-v6-c-tabs__link--before--BorderTopWidth: 0;
72
- --pf-v6-c-tabs__link--before--BorderRightWidth: 0;
73
- --pf-v6-c-tabs__link--before--BorderBottomWidth: 0;
74
- --pf-v6-c-tabs__link--before--BorderLeftWidth: 0;
75
- --pf-v6-c-tabs__link--before--Left: calc(var(--pf-v6-c-tabs__link--before--border-width--base) * -1);
76
- --pf-v6-c-tabs__link--disabled--before--BorderRightWidth: 0;
77
- --pf-v6-c-tabs__link--disabled--before--BorderBottomWidth: var(--pf-v6-c-tabs--before--border-width--base);
78
- --pf-v6-c-tabs__link--disabled--before--BorderLeftWidth: 0;
79
- --pf-v6-c-tabs__link--after--Top: auto;
80
- --pf-v6-c-tabs__link--after--Right: 0;
81
- --pf-v6-c-tabs__link--after--Bottom: 0;
66
+ --pf-v6-c-tabs__link--before--BorderBlockStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
67
+ --pf-v6-c-tabs__link--before--BorderInlineEndColor: var(--pf-v6-c-tabs__link--before--border-color--base);
68
+ --pf-v6-c-tabs__link--before--BorderBlockEndColor: var(--pf-v6-c-tabs__link--before--border-color--base);
69
+ --pf-v6-c-tabs__link--before--BorderInlineStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
70
+ --pf-v6-c-tabs__link--before--BorderBlockStartWidth: 0;
71
+ --pf-v6-c-tabs__link--before--BorderInlineEndWidth: 0;
72
+ --pf-v6-c-tabs__link--before--BorderBlockEndWidth: 0;
73
+ --pf-v6-c-tabs__link--before--BorderInlineStartWidth: 0;
74
+ --pf-v6-c-tabs__link--before--InsetInlineStart: calc(var(--pf-v6-c-tabs__link--before--border-width--base) * -1);
75
+ --pf-v6-c-tabs__link--disabled--before--BorderInlineEndWidth: 0;
76
+ --pf-v6-c-tabs__link--disabled--before--BorderBlockEndWidth: var(--pf-v6-c-tabs--before--border-width--base);
77
+ --pf-v6-c-tabs__link--disabled--before--BorderInlineStartWidth: 0;
78
+ --pf-v6-c-tabs__link--after--InsetBlockStart: auto;
79
+ --pf-v6-c-tabs__link--after--InsetInlineEnd: 0;
80
+ --pf-v6-c-tabs__link--after--InsetBlockEnd: 0;
82
81
  --pf-v6-c-tabs__link--after--BorderColor: var(--pf-t--global--border--color--default);
83
82
  --pf-v6-c-tabs__link--after--BorderWidth: 0;
84
- --pf-v6-c-tabs__link--after--BorderTopWidth: 0;
85
- --pf-v6-c-tabs__link--after--BorderRightWidth: 0;
86
- --pf-v6-c-tabs__link--after--BorderLeftWidth: 0;
83
+ --pf-v6-c-tabs__link--after--BorderBlockStartWidth: 0;
84
+ --pf-v6-c-tabs__link--after--BorderInlineEndWidth: 0;
85
+ --pf-v6-c-tabs__link--after--BorderInlineStartWidth: 0;
87
86
  --pf-v6-c-tabs__item--m-current__link--after--BorderColor: var(--pf-t--global--border--color--clicked);
88
87
  --pf-v6-c-tabs__item--m-current__link--after--BorderWidth: var(--pf-t--global--border--width--extra-strong);
89
88
  --pf-v6-c-tabs__scroll-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -96,9 +95,9 @@
96
95
  --pf-v6-c-tabs__scroll-button--TransitionDuration--opacity: .125s;
97
96
  --pf-v6-c-tabs__scroll-button--before--BorderColor: var(--pf-v6-c-tabs--before--BorderColor);
98
97
  --pf-v6-c-tabs__scroll-button--before--border-width--base: var(--pf-t--global--border--width--regular);
99
- --pf-v6-c-tabs__scroll-button--before--BorderRightWidth: 0;
100
- --pf-v6-c-tabs__scroll-button--before--BorderBottomWidth: var(--pf-v6-c-tabs__scroll-button--before--border-width--base);
101
- --pf-v6-c-tabs__scroll-button--before--BorderLeftWidth: 0;
98
+ --pf-v6-c-tabs__scroll-button--before--BorderInlineEndWidth: 0;
99
+ --pf-v6-c-tabs__scroll-button--before--BorderBlockEndWidth: var(--pf-v6-c-tabs__scroll-button--before--border-width--base);
100
+ --pf-v6-c-tabs__scroll-button--before--BorderInlineStartWidth: 0;
102
101
  --pf-v6-c-tabs__list--ScrollSnapTypeAxis: x;
103
102
  --pf-v6-c-tabs__list--ScrollSnapTypeStrictness: proximity;
104
103
  --pf-v6-c-tabs__list--ScrollSnapType: var(--pf-v6-c-tabs__list--ScrollSnapTypeAxis) var(--pf-v6-c-tabs__list--ScrollSnapTypeStrictness);
@@ -108,8 +107,8 @@
108
107
  --pf-v6-c-tabs__toggle-icon--Color: currentcolor;
109
108
  --pf-v6-c-tabs__toggle-icon--Transition: all 250ms cubic-bezier(.42, 0, .58, 1);
110
109
  --pf-v6-c-tabs__toggle-icon--Rotate: 0;
111
- --pf-v6-c-tabs__toggle-text--MarginLeft: 0;
112
- --pf-v6-c-tabs__toggle-button__toggle-text--MarginLeft: var(--pf-t--global--spacer--md);
110
+ --pf-v6-c-tabs__toggle-text--MarginInlineStart: 0;
111
+ --pf-v6-c-tabs__toggle-button__toggle-text--MarginInlineStart: var(--pf-t--global--spacer--md);
113
112
  --pf-v6-c-tabs__toggle-button__toggle-text--Color: var(--pf-t--global--text--color--regular);
114
113
  --pf-v6-c-tabs--m-expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
115
114
  --pf-v6-c-tabs--m-expanded__toggle-icon--Rotate: 90deg;
@@ -120,9 +119,9 @@
120
119
  --pf-v6-c-tabs--m-expandable--PaddingInlineEnd: var(--pf-t--global--spacer--md);
121
120
  --pf-v6-c-tabs__item-action--c-button--FontSize: var(--pf-t--global--font--size--sm);
122
121
  --pf-v6-c-tabs--m-subtab__item-action--c-button--FontSize: var(--pf-t--global--font--size--xs);
123
- --pf-v6-c-tabs__item-action-icon--MarginTop: 0.125rem;
122
+ --pf-v6-c-tabs__item-action-icon--MarginBlockStart: 0.125rem;
124
123
  --pf-v6-c-tabs__add--before--BorderColor: var(--pf-v6-c-tabs__link--before--border-color--base);
125
- --pf-v6-c-tabs__add--before--BorderLeftWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
124
+ --pf-v6-c-tabs__add--before--BorderInlineStartWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
126
125
  --pf-v6-c-tabs__add--c-button--FontSize: var(--pf-t--global--font--size--sm);
127
126
  --pf-v6-c-tabs--m-subtab__add--c-button--FontSize: var(--pf-t--global--font--size--xs);
128
127
  --pf-v6-c-tabs__add--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -150,10 +149,10 @@
150
149
  inset-inline-start: 0;
151
150
  inset-inline-end: 0;
152
151
  border: solid var(--pf-v6-c-tabs--before--BorderColor);
153
- border-block-start-width: var(--pf-v6-c-tabs--before--BorderTopWidth);
154
- border-block-end-width: var(--pf-v6-c-tabs--before--BorderBottomWidth);
155
- border-inline-start-width: var(--pf-v6-c-tabs--before--BorderLeftWidth);
156
- border-inline-end-width: var(--pf-v6-c-tabs--before--BorderRightWidth);
152
+ border-block-start-width: var(--pf-v6-c-tabs--before--BorderBlockStartWidth);
153
+ border-block-end-width: var(--pf-v6-c-tabs--before--BorderBlockEndWidth);
154
+ border-inline-start-width: var(--pf-v6-c-tabs--before--BorderInlineStartWidth);
155
+ border-inline-end-width: var(--pf-v6-c-tabs--before--BorderInlineEndWidth);
157
156
  }
158
157
  .pf-v6-c-tabs.pf-m-fill .pf-v6-c-tabs__list {
159
158
  flex-basis: 100%;
@@ -162,10 +161,10 @@
162
161
  flex-grow: 1;
163
162
  }
164
163
  .pf-v6-c-tabs.pf-m-fill .pf-v6-c-tabs__item:first-child {
165
- --pf-v6-c-tabs--m-box__item--m-current--first-child__link--before--BorderLeftWidth: 0;
164
+ --pf-v6-c-tabs--m-box__item--m-current--first-child__link--before--BorderInlineStartWidth: 0;
166
165
  }
167
166
  .pf-v6-c-tabs.pf-m-fill .pf-v6-c-tabs__item:last-child {
168
- --pf-v6-c-tabs--m-box__item--m-current--last-child__link--before--BorderRightWidth: 0;
167
+ --pf-v6-c-tabs--m-box__item--m-current--last-child__link--before--BorderInlineEndWidth: 0;
169
168
  }
170
169
  .pf-v6-c-tabs.pf-m-fill .pf-v6-c-tabs__link {
171
170
  flex-basis: 100%;
@@ -183,11 +182,11 @@
183
182
  transform: translateX(0);
184
183
  }
185
184
  .pf-v6-c-tabs.pf-m-no-border-bottom {
186
- --pf-v6-c-tabs--before--BorderBottomWidth: 0;
187
- --pf-v6-c-tabs__link--disabled--before--BorderBottomWidth: 0;
185
+ --pf-v6-c-tabs--before--BorderBlockEndWidth: 0;
186
+ --pf-v6-c-tabs__link--disabled--before--BorderBlockEndWidth: 0;
188
187
  }
189
188
  .pf-v6-c-tabs.pf-m-box .pf-v6-c-tabs__link, .pf-v6-c-tabs.pf-m-vertical .pf-v6-c-tabs__link {
190
- --pf-v6-c-tabs__link--after--BorderBottomWidth: 0;
189
+ --pf-v6-c-tabs__link--after--BorderBlockEndWidth: 0;
191
190
  }
192
191
  .pf-v6-c-tabs.pf-m-box {
193
192
  --pf-v6-c-tabs__item--BackgroundColor: var(--pf-v6-c-tabs--m-box__item--BackgroundColor);
@@ -197,25 +196,25 @@
197
196
  --pf-v6-c-tabs__link--disabled--BackgroundColor: var(--pf-v6-c-tabs--m-box__link--disabled--BackgroundColor);
198
197
  --pf-v6-c-tabs__link--hover--BackgroundColor: var(--pf-v6-c-tabs--m-box__link--hover--BackgroundColor);
199
198
  --pf-v6-c-tabs__item--m-current__link--BackgroundColor: var(--pf-v6-c-tabs--m-box__item--m-current__link--BackgroundColor);
200
- --pf-v6-c-tabs__link--before--BorderBottomWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
201
- --pf-v6-c-tabs__link--after--Top: 0;
202
- --pf-v6-c-tabs__link--after--Bottom: auto;
199
+ --pf-v6-c-tabs__link--before--BorderBlockEndWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
200
+ --pf-v6-c-tabs__link--after--InsetBlockStart: 0;
201
+ --pf-v6-c-tabs__link--after--InsetBlockEnd: auto;
203
202
  }
204
203
  .pf-v6-c-tabs.pf-m-box .pf-v6-c-tabs__link {
205
- --pf-v6-c-tabs__link--after--BorderTopWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
204
+ --pf-v6-c-tabs__link--after--BorderBlockStartWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
206
205
  }
207
206
  .pf-v6-c-tabs.pf-m-box .pf-v6-c-tabs__item:last-child {
208
- --pf-v6-c-tabs__link--before--BorderRightWidth: 0;
207
+ --pf-v6-c-tabs__link--before--BorderInlineEndWidth: 0;
209
208
  }
210
209
  .pf-v6-c-tabs.pf-m-box .pf-v6-c-tabs__item.pf-m-current {
211
210
  --pf-v6-c-tabs__link--BackgroundColor: var(--pf-v6-c-tabs__item--m-current__link--BackgroundColor);
212
- --pf-v6-c-tabs__link--before--BorderBottomColor: var(--pf-v6-c-tabs__link--BackgroundColor);
211
+ --pf-v6-c-tabs__link--before--BorderBlockEndColor: var(--pf-v6-c-tabs__link--BackgroundColor);
213
212
  }
214
213
  .pf-v6-c-tabs.pf-m-box .pf-v6-c-tabs__item.pf-m-current:first-child .pf-v6-c-tabs__link::before {
215
- border-inline-start-width: var(--pf-v6-c-tabs--m-box__item--m-current--first-child__link--before--BorderLeftWidth);
214
+ border-inline-start-width: var(--pf-v6-c-tabs--m-box__item--m-current--first-child__link--before--BorderInlineStartWidth);
216
215
  }
217
216
  .pf-v6-c-tabs.pf-m-box .pf-v6-c-tabs__item.pf-m-current:last-child .pf-v6-c-tabs__link::before {
218
- border-inline-end-width: var(--pf-v6-c-tabs--m-box__item--m-current--last-child__link--before--BorderRightWidth);
217
+ border-inline-end-width: var(--pf-v6-c-tabs--m-box__item--m-current--last-child__link--before--BorderInlineEndWidth);
219
218
  }
220
219
  .pf-v6-c-tabs.pf-m-box.pf-m-scrollable .pf-v6-c-tabs__item.pf-m-current:first-child .pf-v6-c-tabs__link::before {
221
220
  inset-inline-start: calc(var(--pf-v6-c-tabs__link--before--border-width--base) * -1);
@@ -224,7 +223,7 @@
224
223
  inset-inline-start: calc(var(--pf-v6-c-tabs__link--before--border-width--base) * -1);
225
224
  }
226
225
  .pf-v6-c-tabs.pf-m-box .pf-v6-c-tabs__item.pf-m-current + .pf-v6-c-tabs__item {
227
- --pf-v6-c-tabs__link--before--Left: 0;
226
+ --pf-v6-c-tabs__link--before--InsetInlineStart: 0;
228
227
  }
229
228
  .pf-v6-c-tabs.pf-m-box.pf-m-secondary {
230
229
  --pf-v6-c-tabs__item--BackgroundColor: var(--pf-v6-c-tabs--m-box--m-secondary__item--BackgroundColor);
@@ -238,17 +237,17 @@
238
237
  .pf-v6-c-tabs.pf-m-vertical {
239
238
  --pf-v6-c-tabs--Width: var(--pf-v6-c-tabs--m-vertical--Width);
240
239
  --pf-v6-c-tabs--inset: var(--pf-v6-c-tabs--m-vertical--inset);
241
- --pf-v6-c-tabs--before--BorderBottomWidth: 0;
240
+ --pf-v6-c-tabs--before--BorderBlockEndWidth: 0;
242
241
  --pf-v6-c-tabs__item--PaddingInlineStart: var(--pf-v6-c-tabs--m-vertical__item--PaddingInlineStart);
243
242
  --pf-v6-c-tabs__item--PaddingInlineEnd: var(--pf-v6-c-tabs--m-vertical__item--PaddingInlineEnd);
244
- --pf-v6-c-tabs__link--PaddingLeft: var(--pf-v6-c-tabs--m-vertical__link--PaddingLeft);
245
- --pf-v6-c-tabs__link--PaddingRight: var(--pf-v6-c-tabs--m-vertical__link--PaddingRight);
246
- --pf-v6-c-tabs__link--before--Left: 0;
247
- --pf-v6-c-tabs__link--disabled--before--BorderBottomWidth: 0;
248
- --pf-v6-c-tabs__link--disabled--before--BorderLeftWidth: var(--pf-v6-c-tabs--before--border-width--base);
249
- --pf-v6-c-tabs__link--after--Top: 0;
250
- --pf-v6-c-tabs__link--after--Bottom: 0;
251
- --pf-v6-c-tabs__link--after--Right: auto;
243
+ --pf-v6-c-tabs__link--PaddingInlineStart: var(--pf-v6-c-tabs--m-vertical__link--PaddingInlineStart);
244
+ --pf-v6-c-tabs__link--PaddingInlineEnd: var(--pf-v6-c-tabs--m-vertical__link--PaddingInlineEnd);
245
+ --pf-v6-c-tabs__link--before--InsetInlineStart: 0;
246
+ --pf-v6-c-tabs__link--disabled--before--BorderBlockEndWidth: 0;
247
+ --pf-v6-c-tabs__link--disabled--before--BorderInlineStartWidth: var(--pf-v6-c-tabs--before--border-width--base);
248
+ --pf-v6-c-tabs__link--after--InsetBlockStart: 0;
249
+ --pf-v6-c-tabs__link--after--InsetBlockEnd: 0;
250
+ --pf-v6-c-tabs__link--after--InsetInlineEnd: auto;
252
251
  --pf-v6-c-tabs__list--ScrollSnapTypeAxis: var(--pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis);
253
252
  display: inline-flex;
254
253
  flex-direction: column;
@@ -266,10 +265,10 @@
266
265
  position: absolute;
267
266
  inset-inline-end: auto;
268
267
  border: solid var(--pf-v6-c-tabs--m-vertical__list--before--BorderColor);
269
- border-block-start-width: var(--pf-v6-c-tabs--m-vertical__list--before--BorderTopWidth);
270
- border-block-end-width: var(--pf-v6-c-tabs--m-vertical__list--before--BorderBottomWidth);
271
- border-inline-start-width: var(--pf-v6-c-tabs--m-vertical__list--before--BorderLeftWidth);
272
- border-inline-end-width: var(--pf-v6-c-tabs--m-vertical__list--before--BorderRightWidth);
268
+ border-block-start-width: var(--pf-v6-c-tabs--m-vertical__list--before--BorderBlockStartWidth);
269
+ border-block-end-width: var(--pf-v6-c-tabs--m-vertical__list--before--BorderBlockEndWidth);
270
+ border-inline-start-width: var(--pf-v6-c-tabs--m-vertical__list--before--BorderInlineStartWidth);
271
+ border-inline-end-width: var(--pf-v6-c-tabs--m-vertical__list--before--BorderInlineEndWidth);
273
272
  }
274
273
  .pf-v6-c-tabs.pf-m-vertical .pf-v6-c-tabs__item:first-child {
275
274
  margin-block-start: var(--pf-v6-c-tabs--inset);
@@ -278,8 +277,8 @@
278
277
  margin-block-end: var(--pf-v6-c-tabs--inset);
279
278
  }
280
279
  .pf-v6-c-tabs.pf-m-vertical .pf-v6-c-tabs__link {
281
- --pf-v6-c-tabs__link--after--BorderTopWidth: 0;
282
- --pf-v6-c-tabs__link--after--BorderLeftWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
280
+ --pf-v6-c-tabs__link--after--BorderBlockStartWidth: 0;
281
+ --pf-v6-c-tabs__link--after--BorderInlineStartWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
283
282
  max-width: 100%;
284
283
  text-align: start;
285
284
  }
@@ -359,29 +358,29 @@
359
358
  }
360
359
  .pf-v6-c-tabs.pf-m-box.pf-m-vertical {
361
360
  --pf-v6-c-tabs--inset: var(--pf-v6-c-tabs--m-vertical--m-box--inset);
362
- --pf-v6-c-tabs--m-vertical__list--before--BorderLeftWidth: 0;
363
- --pf-v6-c-tabs--m-vertical__list--before--BorderRightWidth: var(--pf-v6-c-tabs--before--border-width--base);
364
- --pf-v6-c-tabs__link--before--BorderRightWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
365
- --pf-v6-c-tabs__link--disabled--before--BorderRightWidth: var(--pf-v6-c-tabs--before--border-width--base);
366
- --pf-v6-c-tabs__link--disabled--before--BorderBottomWidth: var(--pf-v6-c-tabs--before--border-width--base);
367
- --pf-v6-c-tabs__link--disabled--before--BorderLeftWidth: 0;
361
+ --pf-v6-c-tabs--m-vertical__list--before--BorderInlineStartWidth: 0;
362
+ --pf-v6-c-tabs--m-vertical__list--before--BorderInlineEndWidth: var(--pf-v6-c-tabs--before--border-width--base);
363
+ --pf-v6-c-tabs__link--before--BorderInlineEndWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
364
+ --pf-v6-c-tabs__link--disabled--before--BorderInlineEndWidth: var(--pf-v6-c-tabs--before--border-width--base);
365
+ --pf-v6-c-tabs__link--disabled--before--BorderBlockEndWidth: var(--pf-v6-c-tabs--before--border-width--base);
366
+ --pf-v6-c-tabs__link--disabled--before--BorderInlineStartWidth: 0;
368
367
  }
369
368
  .pf-v6-c-tabs.pf-m-box.pf-m-vertical .pf-v6-c-tabs__list::before {
370
369
  inset-inline-start: auto;
371
370
  inset-inline-end: 0;
372
371
  }
373
372
  .pf-v6-c-tabs.pf-m-box.pf-m-vertical .pf-v6-c-tabs__item:last-child {
374
- --pf-v6-c-tabs__link--before--BorderRightWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
373
+ --pf-v6-c-tabs__link--before--BorderInlineEndWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
375
374
  }
376
375
  .pf-v6-c-tabs.pf-m-box.pf-m-vertical .pf-v6-c-tabs__item:first-child {
377
- --pf-v6-c-tabs__link--before--BorderTopWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
376
+ --pf-v6-c-tabs__link--before--BorderBlockStartWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
378
377
  }
379
378
  .pf-v6-c-tabs.pf-m-box.pf-m-vertical .pf-v6-c-tabs__item.pf-m-current {
380
- --pf-v6-c-tabs__link--before--BorderRightColor: var(--pf-v6-c-tabs__item--m-current__link--BackgroundColor);
381
- --pf-v6-c-tabs__link--before--BorderBottomColor: var(--pf-v6-c-tabs__link--before--border-color--base);
379
+ --pf-v6-c-tabs__link--before--BorderInlineEndColor: var(--pf-v6-c-tabs__item--m-current__link--BackgroundColor);
380
+ --pf-v6-c-tabs__link--before--BorderBlockEndColor: var(--pf-v6-c-tabs__link--before--border-color--base);
382
381
  }
383
382
  .pf-v6-c-tabs.pf-m-box.pf-m-vertical .pf-v6-c-tabs__item:first-child.pf-m-current {
384
- --pf-v6-c-tabs__link--before--BorderTopWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
383
+ --pf-v6-c-tabs__link--before--BorderBlockStartWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
385
384
  }
386
385
  .pf-v6-c-tabs.pf-m-box.pf-m-vertical .pf-v6-c-tabs__link::after {
387
386
  inset-block-start: calc(var(--pf-v6-c-tabs__link--before--border-width--base) * -1);
@@ -409,7 +408,7 @@
409
408
  }
410
409
 
411
410
  .pf-v6-c-tabs__toggle-button {
412
- --pf-v6-c-tabs__toggle-text--MarginLeft: var(--pf-v6-c-tabs__toggle-button__toggle-text--MarginLeft);
411
+ --pf-v6-c-tabs__toggle-text--MarginInlineStart: var(--pf-v6-c-tabs__toggle-button__toggle-text--MarginInlineStart);
413
412
  --pf-v6-c-tabs__toggle-text--Color: var(--pf-v6-c-tabs__toggle-button__toggle-text--Color);
414
413
  }
415
414
  .pf-v6-c-tabs__toggle-button .pf-v6-c-button {
@@ -429,7 +428,7 @@
429
428
  }
430
429
 
431
430
  .pf-v6-c-tabs__toggle-text {
432
- margin-inline-start: var(--pf-v6-c-tabs__toggle-text--MarginLeft);
431
+ margin-inline-start: var(--pf-v6-c-tabs__toggle-text--MarginInlineStart);
433
432
  color: var(--pf-v6-c-tabs__toggle-text--Color, inherit);
434
433
  }
435
434
 
@@ -515,10 +514,10 @@
515
514
  flex: 1;
516
515
  column-gap: var(--pf-v6-c-tabs__link--ColumnGap);
517
516
  align-items: center;
518
- padding-block-start: var(--pf-v6-c-tabs__link--PaddingTop);
519
- padding-block-end: var(--pf-v6-c-tabs__link--PaddingBottom);
520
- padding-inline-start: var(--pf-v6-c-tabs__link--PaddingLeft);
521
- padding-inline-end: var(--pf-v6-c-tabs__link--PaddingRight);
517
+ padding-block-start: var(--pf-v6-c-tabs__link--PaddingBlockStart);
518
+ padding-block-end: var(--pf-v6-c-tabs__link--PaddingBlockEnd);
519
+ padding-inline-start: var(--pf-v6-c-tabs__link--PaddingInlineStart);
520
+ padding-inline-end: var(--pf-v6-c-tabs__link--PaddingInlineEnd);
522
521
  font-size: var(--pf-v6-c-tabs__link--FontSize);
523
522
  color: var(--pf-v6-c-tabs__link--Color);
524
523
  text-decoration: none;
@@ -526,31 +525,31 @@
526
525
  border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
527
526
  }
528
527
  .pf-v6-c-tabs__item.pf-m-action, .pf-v6-c-tabs__link {
529
- --pf-v6-c-tabs__link--after--BorderBottomWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
528
+ --pf-v6-c-tabs__link--after--BorderBlockEndWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
530
529
  }
531
530
 
532
531
  .pf-v6-c-tabs__item.pf-m-action::before, .pf-v6-c-tabs__link::before {
533
532
  pointer-events: none;
534
- border-block-start-color: var(--pf-v6-c-tabs__link--before--BorderTopColor);
535
- border-block-start-width: var(--pf-v6-c-tabs__link--before--BorderTopWidth);
536
- border-block-end-color: var(--pf-v6-c-tabs__link--before--BorderBottomColor);
537
- border-block-end-width: var(--pf-v6-c-tabs__link--before--BorderBottomWidth);
538
- border-inline-start-color: var(--pf-v6-c-tabs__link--before--BorderLeftColor);
539
- border-inline-start-width: var(--pf-v6-c-tabs__link--before--BorderLeftWidth);
540
- border-inline-end-color: var(--pf-v6-c-tabs__link--before--BorderRightColor);
541
- border-inline-end-width: var(--pf-v6-c-tabs__link--before--BorderRightWidth);
533
+ border-block-start-color: var(--pf-v6-c-tabs__link--before--BorderBlockStartColor);
534
+ border-block-start-width: var(--pf-v6-c-tabs__link--before--BorderBlockStartWidth);
535
+ border-block-end-color: var(--pf-v6-c-tabs__link--before--BorderBlockEndColor);
536
+ border-block-end-width: var(--pf-v6-c-tabs__link--before--BorderBlockEndWidth);
537
+ border-inline-start-color: var(--pf-v6-c-tabs__link--before--BorderInlineStartColor);
538
+ border-inline-start-width: var(--pf-v6-c-tabs__link--before--BorderInlineStartWidth);
539
+ border-inline-end-color: var(--pf-v6-c-tabs__link--before--BorderInlineEndColor);
540
+ border-inline-end-width: var(--pf-v6-c-tabs__link--before--BorderInlineEndWidth);
542
541
  }
543
542
 
544
543
  .pf-v6-c-tabs__item.pf-m-action::after, .pf-v6-c-tabs__link::after {
545
- inset-block-start: var(--pf-v6-c-tabs__link--after--Top);
546
- inset-block-end: var(--pf-v6-c-tabs__link--after--Bottom);
547
- inset-inline-start: var(--pf-v6-c-tabs__link--before--Left);
548
- inset-inline-end: var(--pf-v6-c-tabs__link--after--Right);
544
+ inset-block-start: var(--pf-v6-c-tabs__link--after--InsetBlockStart);
545
+ inset-block-end: var(--pf-v6-c-tabs__link--after--InsetBlockEnd);
546
+ inset-inline-start: var(--pf-v6-c-tabs__link--before--InsetInlineStart);
547
+ inset-inline-end: var(--pf-v6-c-tabs__link--after--InsetInlineEnd);
549
548
  border-color: var(--pf-v6-c-tabs__link--after--BorderColor);
550
- border-block-start-width: var(--pf-v6-c-tabs__link--after--BorderTopWidth);
551
- border-block-end-width: var(--pf-v6-c-tabs__link--after--BorderBottomWidth);
552
- border-inline-start-width: var(--pf-v6-c-tabs__link--after--BorderLeftWidth);
553
- border-inline-end-width: var(--pf-v6-c-tabs__link--after--BorderRightWidth);
549
+ border-block-start-width: var(--pf-v6-c-tabs__link--after--BorderBlockStartWidth);
550
+ border-block-end-width: var(--pf-v6-c-tabs__link--after--BorderBlockEndWidth);
551
+ border-inline-start-width: var(--pf-v6-c-tabs__link--after--BorderInlineStartWidth);
552
+ border-inline-end-width: var(--pf-v6-c-tabs__link--after--BorderInlineEndWidth);
554
553
  }
555
554
 
556
555
  .pf-v6-c-tabs__link:where(:hover, :focus) {
@@ -561,9 +560,9 @@
561
560
  }
562
561
  .pf-v6-c-tabs__item.pf-m-action.pf-m-disabled, .pf-v6-c-tabs__link:disabled, .pf-v6-c-tabs__link.pf-m-disabled, .pf-v6-c-tabs__link.pf-m-aria-disabled {
563
562
  --pf-v6-c-tabs__link--Color: var(--pf-v6-c-tabs__link--disabled--Color);
564
- --pf-v6-c-tabs__link--before--BorderRightWidth: var(--pf-v6-c-tabs__link--disabled--before--BorderRightWidth);
565
- --pf-v6-c-tabs__link--before--BorderBottomWidth: var(--pf-v6-c-tabs__link--disabled--before--BorderBottomWidth);
566
- --pf-v6-c-tabs__link--before--BorderLeftWidth: var(--pf-v6-c-tabs__link--disabled--before--BorderLeftWidth);
563
+ --pf-v6-c-tabs__link--before--BorderInlineEndWidth: var(--pf-v6-c-tabs__link--disabled--before--BorderInlineEndWidth);
564
+ --pf-v6-c-tabs__link--before--BorderBlockEndWidth: var(--pf-v6-c-tabs__link--disabled--before--BorderBlockEndWidth);
565
+ --pf-v6-c-tabs__link--before--BorderInlineStartWidth: var(--pf-v6-c-tabs__link--disabled--before--BorderInlineStartWidth);
567
566
  --pf-v6-c-tabs__link--after--BorderWidth: 0;
568
567
  }
569
568
 
@@ -601,7 +600,7 @@
601
600
 
602
601
  .pf-v6-c-tabs__item-action-icon {
603
602
  display: inline-block;
604
- margin-block-start: var(--pf-v6-c-tabs__item-action-icon--MarginTop);
603
+ margin-block-start: var(--pf-v6-c-tabs__item-action-icon--MarginBlockStart);
605
604
  }
606
605
 
607
606
  .pf-v6-c-tabs__scroll-button {
@@ -615,17 +614,17 @@
615
614
  .pf-v6-c-tabs__scroll-button::before {
616
615
  border-color: var(--pf-v6-c-tabs__scroll-button--before--BorderColor);
617
616
  border-block-start-width: 0;
618
- border-block-end-width: var(--pf-v6-c-tabs__scroll-button--before--BorderBottomWidth);
619
- border-inline-start-width: var(--pf-v6-c-tabs__scroll-button--before--BorderLeftWidth);
620
- border-inline-end-width: var(--pf-v6-c-tabs__scroll-button--before--BorderRightWidth);
617
+ border-block-end-width: var(--pf-v6-c-tabs__scroll-button--before--BorderBlockEndWidth);
618
+ border-inline-start-width: var(--pf-v6-c-tabs__scroll-button--before--BorderInlineStartWidth);
619
+ border-inline-end-width: var(--pf-v6-c-tabs__scroll-button--before--BorderInlineEndWidth);
621
620
  }
622
621
  .pf-v6-c-tabs__scroll-button:nth-of-type(1) {
623
- --pf-v6-c-tabs__scroll-button--before--BorderRightWidth: var(--pf-v6-c-tabs__scroll-button--before--border-width--base);
622
+ --pf-v6-c-tabs__scroll-button--before--BorderInlineEndWidth: var(--pf-v6-c-tabs__scroll-button--before--border-width--base);
624
623
  margin-inline-end: calc(var(--pf-v6-c-tabs__scroll-button--Width) * -1);
625
624
  transform: translateX(-100%);
626
625
  }
627
626
  .pf-v6-c-tabs__scroll-button:nth-of-type(2) {
628
- --pf-v6-c-tabs__scroll-button--before--BorderLeftWidth: var(--pf-v6-c-tabs__scroll-button--before--border-width--base);
627
+ --pf-v6-c-tabs__scroll-button--before--BorderInlineStartWidth: var(--pf-v6-c-tabs__scroll-button--before--border-width--base);
629
628
  margin-inline-start: calc(var(--pf-v6-c-tabs__scroll-button--Width) * -1);
630
629
  transform: translateX(100%);
631
630
  }
@@ -639,7 +638,7 @@
639
638
  padding-inline-end: var(--pf-v6-c-tabs__add--PaddingInlineEnd);
640
639
  }
641
640
  .pf-v6-c-tabs__add::before {
642
- border-inline-start: var(--pf-v6-c-tabs__add--before--BorderLeftWidth) solid var(--pf-v6-c-tabs__add--before--BorderColor);
641
+ border-inline-start: var(--pf-v6-c-tabs__add--before--BorderInlineStartWidth) solid var(--pf-v6-c-tabs__add--before--BorderColor);
643
642
  }
644
643
  .pf-v6-c-tabs__add .pf-v6-c-button {
645
644
  --pf-v6-c-button--FontSize: var(--pf-v6-c-tabs__add--c-button--FontSize);