@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
@@ -2,7 +2,7 @@ import './table-tree-view.css';
2
2
  declare const _default: {
3
3
  "button": "pf-v6-c-button",
4
4
  "dirRtl": "pf-v6-m-dir-rtl",
5
- "dropdown": "pf-v6-c-dropdown",
5
+ "menuToggle": "pf-v6-c-menu-toggle",
6
6
  "modifiers": {
7
7
  "treeView": "pf-m-tree-view",
8
8
  "noInset": "pf-m-no-inset",
@@ -4,7 +4,7 @@ require('./table-tree-view.css');
4
4
  exports.default = {
5
5
  "button": "pf-v6-c-button",
6
6
  "dirRtl": "pf-v6-m-dir-rtl",
7
- "dropdown": "pf-v6-c-dropdown",
7
+ "menuToggle": "pf-v6-c-menu-toggle",
8
8
  "modifiers": {
9
9
  "treeView": "pf-m-tree-view",
10
10
  "noInset": "pf-m-no-inset",
@@ -2,7 +2,7 @@ import './table-tree-view.css';
2
2
  export default {
3
3
  "button": "pf-v6-c-button",
4
4
  "dirRtl": "pf-v6-m-dir-rtl",
5
- "dropdown": "pf-v6-c-dropdown",
5
+ "menuToggle": "pf-v6-c-menu-toggle",
6
6
  "modifiers": {
7
7
  "treeView": "pf-m-tree-view",
8
8
  "noInset": "pf-m-no-inset",
@@ -1,82 +1,32 @@
1
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td) {
2
- --pf-v6-hidden-visible--hidden--Display: none;
3
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
4
- display: var(--pf-v6-hidden-visible--Display);
5
- }
6
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-hidden:where(th, td) {
7
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
8
- }
9
- @media screen and (min-width: 576px) {
10
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-hidden-on-sm:where(th, td) {
11
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
12
- }
13
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-visible-on-sm:where(th, td) {
14
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
15
- }
16
- }
17
- @media screen and (min-width: 768px) {
18
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-hidden-on-md:where(th, td) {
19
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
20
- }
21
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-visible-on-md:where(th, td) {
22
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
23
- }
24
- }
25
- @media screen and (min-width: 992px) {
26
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-hidden-on-lg:where(th, td) {
27
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
28
- }
29
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-visible-on-lg:where(th, td) {
30
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
31
- }
32
- }
33
- @media screen and (min-width: 1200px) {
34
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-hidden-on-xl:where(th, td) {
35
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
36
- }
37
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-visible-on-xl:where(th, td) {
38
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
39
- }
40
- }
41
- @media screen and (min-width: 1450px) {
42
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-hidden-on-2xl:where(th, td) {
43
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
44
- }
45
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > .pf-m-visible-on-2xl:where(th, td) {
46
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
47
- }
48
- }
49
-
50
- :where(:root),
51
- :where(.pf-v6-c-table) {
1
+ :where(:root, .pf-v6-c-table) {
52
2
  --pf-v6-c-table--BackgroundColor: var(--pf-t--global--background--color--primary--default);
53
3
  --pf-v6-c-table--BorderColor: var(--pf-t--global--border--color--default);
54
4
  --pf-v6-c-table--border-width--base: var(--pf-t--global--border--width--divider--default);
55
5
  --pf-v6-c-table__caption--FontSize: var(--pf-t--global--font--size--body--default);
56
6
  --pf-v6-c-table__caption--Color: var(--pf-t--global--text--color--subtle);
57
- --pf-v6-c-table__caption--PaddingTop: var(--pf-t--global--spacer--md);
58
- --pf-v6-c-table__caption--PaddingRight: var(--pf-t--global--spacer--lg);
59
- --pf-v6-c-table__caption--PaddingBottom: var(--pf-t--global--spacer--md);
60
- --pf-v6-c-table__caption--PaddingLeft: var(--pf-t--global--spacer--lg);
7
+ --pf-v6-c-table__caption--PaddingBlockStart: var(--pf-t--global--spacer--md);
8
+ --pf-v6-c-table__caption--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
9
+ --pf-v6-c-table__caption--PaddingBlockEnd: var(--pf-t--global--spacer--md);
10
+ --pf-v6-c-table__caption--PaddingInlineStart: var(--pf-t--global--spacer--lg);
61
11
  --pf-v6-c-table__thead--cell--FontSize: var(--pf-t--global--font--size--body--sm);
62
12
  --pf-v6-c-table__thead--cell--FontWeight: var(--pf-t--global--font--weight--body--bold);
63
- --pf-v6-c-table__thead__toggle--PaddingBottom: var(--pf-t--global--spacer--xs);
64
- --pf-v6-c-table__tbody--cell--PaddingTop: var(--pf-v6-c-table--cell--Padding--base);
65
- --pf-v6-c-table__tbody--cell--PaddingBottom: var(--pf-v6-c-table--cell--Padding--base);
13
+ --pf-v6-c-table__thead__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
14
+ --pf-v6-c-table__tbody--cell--PaddingBlockStart: var(--pf-v6-c-table--cell--Padding--base);
15
+ --pf-v6-c-table__tbody--cell--PaddingBlockEnd: var(--pf-v6-c-table--cell--Padding--base);
66
16
  --pf-v6-c-table__tbody--cell--FontSize: var(--pf-t--global--font--size--body--default);
67
- --pf-v6-c-table__tr--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
68
- --pf-v6-c-table__tr--BorderBottomColor: var(--pf-t--global--border--color--default);
17
+ --pf-v6-c-table__tr--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
18
+ --pf-v6-c-table__tr--BorderBlockEndColor: var(--pf-t--global--border--color--default);
69
19
  --pf-v6-c-table--cell--Padding--base: var(--pf-t--global--spacer--md);
70
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table--cell--Padding--base);
71
- --pf-v6-c-table--cell--PaddingRight: var(--pf-v6-c-table--cell--Padding--base);
72
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table--cell--Padding--base);
73
- --pf-v6-c-table--cell--PaddingLeft: var(--pf-v6-c-table--cell--Padding--base);
20
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--cell--Padding--base);
21
+ --pf-v6-c-table--cell--PaddingInlineEnd: var(--pf-v6-c-table--cell--Padding--base);
22
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--cell--Padding--base);
23
+ --pf-v6-c-table--cell--PaddingInlineStart: var(--pf-v6-c-table--cell--Padding--base);
74
24
  --pf-v6-c-table--cell--FontSize: var(--pf-t--global--font--size--body--default);
75
25
  --pf-v6-c-table--cell--FontWeight: var(--pf-t--global--font--weight--body);
76
26
  --pf-v6-c-table--cell--LineHeight: var(--pf-t--global--font--line-height--body);
77
27
  --pf-v6-c-table--cell--Color: var(--pf-t--global--text--color--regular);
78
28
  --pf-v6-c-table--cell--first-last-child--PaddingInline: var(--pf-t--global--spacer--sm);
79
- --pf-v6-c-table__tr--m-first-cell-offset-reset--cell--PaddingLeft: var(--pf-v6-c-table--cell--Padding--base);
29
+ --pf-v6-c-table__tr--m-first-cell-offset-reset--cell--PaddingInlineStart: var(--pf-v6-c-table--cell--Padding--base);
80
30
  --pf-v6-c-table--cell--MinWidth: 0;
81
31
  --pf-v6-c-table--cell--MaxWidth: none;
82
32
  --pf-v6-c-table--cell--Width: auto;
@@ -84,81 +34,82 @@
84
34
  --pf-v6-c-table--cell--TextOverflow: clip;
85
35
  --pf-v6-c-table--cell--WhiteSpace: normal;
86
36
  --pf-v6-c-table--cell--WordBreak: normal;
87
- --pf-v6-c-table--cell--m-border-right--before--BorderRightWidth: var(--pf-t--global--border--width--divider--default);
88
- --pf-v6-c-table--cell--m-border-right--before--BorderRightColor: var(--pf-t--global--border--color--default);
89
- --pf-v6-c-table--cell--m-border-left--before--BorderLeftWidth: var(--pf-t--global--border--width--divider--default);
90
- --pf-v6-c-table--cell--m-border-left--before--BorderLeftColor: var(--pf-t--global--border--color--default);
37
+ --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
38
+ --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
39
+ --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
40
+ --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
91
41
  --pf-v6-c-table--cell--m-help--MinWidth: 11ch;
92
42
  --pf-v6-c-table--m-truncate--cell--MaxWidth: 1px;
93
- --pf-v6-c-table--m-truncate--cell--MinWidth: calc(5ch + var(--pf-v6-c-table--cell--PaddingRight) + var(--pf-v6-c-table--cell--PaddingLeft));
43
+ --pf-v6-c-table--m-truncate--cell--MinWidth: calc(5ch + var(--pf-v6-c-table--cell--PaddingInlineEnd) + var(--pf-v6-c-table--cell--PaddingInlineStart));
94
44
  --pf-v6-c-table--m-truncate__text--MinWidth: 5ch;
95
45
  --pf-v6-c-table--cell--hidden-visible--Display: table-cell;
96
- --pf-v6-c-table__toggle--PaddingTop: var(--pf-t--global--spacer--sm);
97
- --pf-v6-c-table__toggle--PaddingBottom: var(--pf-t--global--spacer--sm);
98
- --pf-v6-c-table__toggle--PaddingLeft: var(--pf-t--global--spacer--sm);
99
- --pf-v6-c-table__toggle--PaddingRight: var(--pf-t--global--spacer--sm);
46
+ --pf-v6-c-table__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
47
+ --pf-v6-c-table__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
48
+ --pf-v6-c-table__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
49
+ --pf-v6-c-table__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
100
50
  --pf-v6-c-table__toggle--c-button__toggle-icon--Rotate: 270deg;
101
51
  --pf-v6-c-table__toggle--c-button__toggle-icon--Transition: .2s ease-in 0s;
102
52
  --pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate: 360deg;
103
- --pf-v6-c-table__button--PaddingTop: var(--pf-t--global--spacer--sm);
104
- --pf-v6-c-table__button--PaddingBottom: var(--pf-t--global--spacer--sm);
105
- --pf-v6-c-table__button--PaddingLeft: var(--pf-t--global--spacer--md);
106
- --pf-v6-c-table__button--PaddingRight: var(--pf-t--global--spacer--md);
53
+ --pf-v6-c-table__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
54
+ --pf-v6-c-table__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
55
+ --pf-v6-c-table__button--PaddingInlineStart: var(--pf-t--global--spacer--md);
56
+ --pf-v6-c-table__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
107
57
  --pf-v6-c-table__button--Color: var(--pf-t--global--text--color--regular);
108
58
  --pf-v6-c-table__button--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
109
59
  --pf-v6-c-table__button--OutlineOffset: calc(var(--pf-t--global--border--width--strong) * -1);
110
60
  --pf-v6-c-table__button--BorderRadius: var(--pf-t--global--border--radius--small);
111
61
  --pf-v6-c-table__button--hover--Color: var(--pf-t--global--text--color--regular);
112
62
  --pf-v6-c-table__button--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
113
- --pf-v6-c-table__check--PaddingLeft: var(--pf-t--global--spacer--sm);
114
- --pf-v6-c-table__check--PaddingRight: var(--pf-t--global--spacer--sm);
63
+ --pf-v6-c-table__check--PaddingInlineStart: var(--pf-t--global--spacer--sm);
64
+ --pf-v6-c-table__check--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
115
65
  --pf-v6-c-table__favorite--c-button--FontSize: var(--pf-t--global--font--size--body--default);
116
66
  --pf-v6-c-table--cell--m-favorite--Color: var(--pf-t--global--text--color--subtle);
117
67
  --pf-v6-c-table__favorite--m-favorited--c-button--Color: var(--pf-t--global--color--favorite--clicked);
118
68
  --pf-v6-c-table__tr--m-ghost-row--Opacity: .4;
119
69
  --pf-v6-c-table__tr--m-ghost-row--BackgroundColor: var(--pf-t--global--background--color--primary--default);
120
- --pf-v6-c-table__action--PaddingTop: var(--pf-t--global--spacer--sm);
121
- --pf-v6-c-table__action--PaddingBottom: var(--pf-t--global--spacer--sm);
122
- --pf-v6-c-table__action--PaddingLeft: var(--pf-t--global--spacer--sm);
123
- --pf-v6-c-table__action--PaddingRight: var(--pf-t--global--spacer--sm);
70
+ --pf-v6-c-table__action--PaddingBlockStart: var(--pf-t--global--spacer--sm);
71
+ --pf-v6-c-table__action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
72
+ --pf-v6-c-table__action--PaddingInlineStart: var(--pf-t--global--spacer--sm);
73
+ --pf-v6-c-table__action--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
124
74
  --pf-v6-c-table__expandable-row--Transition: var(--pf-t--global--transition);
125
- --pf-v6-c-table__expandable-row-content--PaddingTop: var(--pf-t--global--spacer--md);
126
- --pf-v6-c-table__expandable-row-content--PaddingBottom: var(--pf-t--global--spacer--md);
127
- --pf-v6-c-table__expandable-row-content--PaddingLeft: var(--pf-t--global--spacer--md);
128
- --pf-v6-c-table__expandable-row-content--PaddingRight: var(--pf-t--global--spacer--md);
75
+ --pf-v6-c-table__expandable-row-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
76
+ --pf-v6-c-table__expandable-row-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
77
+ --pf-v6-c-table__expandable-row-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
78
+ --pf-v6-c-table__expandable-row-content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
129
79
  --pf-v6-c-table__expandable-row-content--BorderRadius: var(--pf-t--global--border--radius--small);
80
+ --pf-v6-c-table__expandable-row-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
130
81
  --pf-v6-c-table__control-row--BackgroundColor: var(--pf-t--global--background--color--primary--default);
131
- --pf-v6-c-table__control-row--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
132
- --pf-v6-c-table__control-row__tbody--BorderBottomColor: var(--pf-t--global--border--color--default);
133
- --pf-v6-c-table__icon-inline--MarginRight: var(--pf-t--global--spacer--sm);
134
- --pf-v6-c-table__sort--MinWidth: calc(6ch + var(--pf-v6-c-table--cell--PaddingRight) + var(--pf-v6-c-table--cell--PaddingLeft) + var(--pf-v6-c-table__sort-indicator--MarginLeft));
82
+ --pf-v6-c-table__control-row--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
83
+ --pf-v6-c-table__control-row__tbody--BorderBlockEndColor: var(--pf-t--global--border--color--default);
84
+ --pf-v6-c-table__icon-inline--MarginInlineEnd: var(--pf-t--global--spacer--sm);
85
+ --pf-v6-c-table__sort--MinWidth: calc(6ch + var(--pf-v6-c-table--cell--PaddingInlineEnd) + var(--pf-v6-c-table--cell--PaddingInlineStart) + var(--pf-v6-c-table__sort-indicator--MarginInlineStart));
135
86
  --pf-v6-c-table__sort--m-selected__button--Color: var(--pf-t--global--color--brand--clicked);
136
87
  --pf-v6-c-table__sort--m-help--MinWidth: 15ch;
137
88
  --pf-v6-c-table__sort__button__text--Color: currentcolor;
138
89
  --pf-v6-c-table__sort__button--hover__text--Color: currentcolor;
139
90
  --pf-v6-c-table__sort-indicator--Color: var(--pf-t--global--icon--color--subtle);
140
- --pf-v6-c-table__sort-indicator--MarginLeft: var(--pf-t--global--spacer--md);
91
+ --pf-v6-c-table__sort-indicator--MarginInlineStart: var(--pf-t--global--spacer--md);
141
92
  --pf-v6-c-table__sort--m-selected__sort-indicator--Color: var(--pf-t--global--color--brand--clicked);
142
93
  --pf-v6-c-table__sort__button--hover__sort-indicator--Color: var(--pf-t--global--text--color--regular);
143
94
  --pf-v6-c-table__th--m-help--MinWidth: 11ch;
144
- --pf-v6-c-table__column-help--MarginLeft: var(--pf-t--global--spacer--sm);
95
+ --pf-v6-c-table__column-help--MarginInlineStart: var(--pf-t--global--spacer--sm);
145
96
  --pf-v6-c-table__compound-expansion-toggle__button--Color: var(--pf-t--global--icon--color--brand--default);
146
97
  --pf-v6-c-table__compound-expansion-toggle__button--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
147
98
  --pf-v6-c-table__compound-expansion-toggle__button--hover--Color: var(--pf-t--global--icon--color--brand--hover);
148
99
  --pf-v6-c-table__compound-expansion-toggle__button--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
149
100
  --pf-v6-c-table__compound-expansion-toggle__button--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
150
101
  --pf-v6-c-table__compound-expansion-toggle__button--after--BorderColor: var(--pf-t--global--border--color--clicked);
151
- --pf-v6-c-table__compound-expansion-toggle__button--after--BorderTopWidth: 0;
152
- --pf-v6-c-table__compound-expansion-toggle__button--hover--after--BorderTopWidth: var(--pf-t--global--border--width--strong);
153
- --pf-v6-c-table__compound-expansion-toggle--m-expanded__button--after--BorderTopWidth: var(--pf-t--global--border--width--strong);
102
+ --pf-v6-c-table__compound-expansion-toggle__button--after--BorderBlockStartWidth: 0;
103
+ --pf-v6-c-table__compound-expansion-toggle__button--hover--after--BorderBlockStartWidth: var(--pf-t--global--border--width--strong);
104
+ --pf-v6-c-table__compound-expansion-toggle--m-expanded__button--after--BorderBlockStartWidth: var(--pf-t--global--border--width--strong);
154
105
  --pf-v6-c-table--compound-expansion--m-expanded--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
155
- --pf-v6-c-table--m-compact__th--PaddingTop: calc(var(--pf-t--global--spacer--sm) + var(--pf-t--global--spacer--xs));
156
- --pf-v6-c-table--m-compact__th--PaddingBottom: var(--pf-t--global--spacer--sm);
157
- --pf-v6-c-table--m-compact--cell--PaddingTop: var(--pf-t--global--spacer--sm);
158
- --pf-v6-c-table--m-compact--cell--PaddingBottom: var(--pf-t--global--spacer--sm);
159
- --pf-v6-c-table--m-compact__action--PaddingTop: var(--pf-t--global--spacer--xs);
160
- --pf-v6-c-table--m-compact__action--PaddingBottom: var(--pf-t--global--spacer--xs);
161
- --pf-v6-c-table__expandable-row--m-expanded--BorderBottomColor: var(--pf-t--global--border--color--default);
106
+ --pf-v6-c-table--m-compact__th--PaddingBlockStart: calc(var(--pf-t--global--spacer--sm) + var(--pf-t--global--spacer--xs));
107
+ --pf-v6-c-table--m-compact__th--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
108
+ --pf-v6-c-table--m-compact--cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
109
+ --pf-v6-c-table--m-compact--cell--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
110
+ --pf-v6-c-table--m-compact__action--PaddingBlockStart: var(--pf-t--global--spacer--xs);
111
+ --pf-v6-c-table--m-compact__action--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
112
+ --pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor: var(--pf-t--global--border--color--default);
162
113
  --pf-v6-c-table__tr--m-clickable--BackgroundColor: transparent;
163
114
  --pf-v6-c-table__tr--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
164
115
  --pf-v6-c-table__tr--m-clickable--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
@@ -171,11 +122,11 @@
171
122
  --pf-v6-c-table__tbody--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
172
123
  --pf-v6-c-table__tbody--m-selected--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
173
124
  --pf-v6-c-table__thead--m-nested-column-header--button--OutlineOffset: -0.1875rem;
174
- --pf-v6-c-table__thead--m-nested-column-header__tr--PaddingTop: var(--pf-t--global--spacer--xs);
175
- --pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBottom: var(--pf-t--global--spacer--md);
125
+ --pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockStart: var(--pf-t--global--spacer--xs);
126
+ --pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockEnd: var(--pf-t--global--spacer--md);
176
127
  --pf-v6-c-table__subhead--Color: var(--pf-t--global--text--color--subtle);
177
- --pf-v6-c-table__nested-column-header__button--PaddingLeft: calc(var(--pf-v6-c-table__button--PaddingLeft) - var(--pf-t--global--spacer--sm));
178
- --pf-v6-c-table__nested-column-header__button--PaddingRight: calc(var(--pf-v6-c-table__button--PaddingRight) - var(--pf-t--global--spacer--xs));
128
+ --pf-v6-c-table__nested-column-header__button--PaddingInlineStart: calc(var(--pf-v6-c-table__button--PaddingInlineStart) - var(--pf-t--global--spacer--sm));
129
+ --pf-v6-c-table__nested-column-header__button--PaddingInlineEnd: calc(var(--pf-v6-c-table__button--PaddingInlineEnd) - var(--pf-t--global--spacer--xs));
179
130
  --pf-v6-c-table--m-striped__tr--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
180
131
  --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-t--global--z-index--xs);
181
132
  --pf-v6-c-table--m-sticky-header--ZIndex: calc(var(--pf-t--global--z-index--xs) + 1);
@@ -224,7 +175,7 @@
224
175
  }
225
176
  .pf-v6-c-table:not(.pf-m-sticky-header) > .pf-m-nested-column-header tr:where(.pf-v6-c-table__tr):not(:last-child) th:where(.pf-v6-c-table__th):not([rowspan]),
226
177
  .pf-v6-c-table:not(.pf-m-sticky-header) > .pf-m-nested-column-header tr:where(.pf-v6-c-table__tr):not(:last-child) td:where(.pf-v6-c-table__td):not([rowspan]) {
227
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBottom);
178
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockEnd);
228
179
  }
229
180
  .pf-v6-c-table.pf-m-striped:not(.pf-m-expandable) > tbody:where(.pf-v6-c-table__tbody) > tr:where(.pf-v6-c-table__tr):nth-child(odd), .pf-v6-c-table.pf-m-striped.pf-m-expandable > tbody:where(.pf-v6-c-table__tbody):nth-of-type(odd) > tr:where(.pf-v6-c-table__tr),
230
181
  .pf-v6-c-table > .pf-m-striped > tr:nth-child(odd),
@@ -239,14 +190,17 @@
239
190
  }
240
191
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td) {
241
192
  --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-table--cell--hidden-visible--Display);
193
+ --pf-v6-hidden-visible--hidden--Display: none;
194
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
195
+ display: var(--pf-v6-hidden-visible--Display);
242
196
  position: relative;
243
197
  width: var(--pf-v6-c-table--cell--Width);
244
198
  min-width: var(--pf-v6-c-table--cell--MinWidth);
245
199
  max-width: var(--pf-v6-c-table--cell--MaxWidth);
246
- padding-block-start: var(--pf-v6-c-table--cell--PaddingTop);
247
- padding-block-end: var(--pf-v6-c-table--cell--PaddingBottom);
248
- padding-inline-start: var(--pf-v6-c-table--cell--PaddingLeft);
249
- padding-inline-end: var(--pf-v6-c-table--cell--PaddingRight);
200
+ padding-block-start: var(--pf-v6-c-table--cell--PaddingBlockStart);
201
+ padding-block-end: var(--pf-v6-c-table--cell--PaddingBlockEnd);
202
+ padding-inline-start: var(--pf-v6-c-table--cell--PaddingInlineStart);
203
+ padding-inline-end: var(--pf-v6-c-table--cell--PaddingInlineEnd);
250
204
  overflow: var(--pf-v6-c-table--cell--Overflow);
251
205
  font-size: var(--pf-v6-c-table--cell--FontSize);
252
206
  font-weight: var(--pf-v6-c-table--cell--FontWeight);
@@ -256,11 +210,54 @@
256
210
  word-break: var(--pf-v6-c-table--cell--WordBreak);
257
211
  white-space: var(--pf-v6-c-table--cell--WhiteSpace);
258
212
  }
213
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden {
214
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
215
+ }
216
+ @media screen and (min-width: 576px) {
217
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-sm {
218
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
219
+ }
220
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-visible-on-sm {
221
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
222
+ }
223
+ }
224
+ @media screen and (min-width: 768px) {
225
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-md {
226
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
227
+ }
228
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-visible-on-md {
229
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
230
+ }
231
+ }
232
+ @media screen and (min-width: 992px) {
233
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-lg {
234
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
235
+ }
236
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-visible-on-lg {
237
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
238
+ }
239
+ }
240
+ @media screen and (min-width: 1200px) {
241
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-xl {
242
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
243
+ }
244
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-visible-on-xl {
245
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
246
+ }
247
+ }
248
+ @media screen and (min-width: 1450px) {
249
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-hidden-on-2xl {
250
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
251
+ }
252
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-visible-on-2xl {
253
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
254
+ }
255
+ }
259
256
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td):first-child {
260
- padding-inline-start: calc(var(--pf-v6-c-table--cell--first-last-child--PaddingInline) + var(--pf-v6-c-table--cell--PaddingLeft));
257
+ padding-inline-start: calc(var(--pf-v6-c-table--cell--first-last-child--PaddingInline) + var(--pf-v6-c-table--cell--PaddingInlineStart));
261
258
  }
262
259
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td):last-child {
263
- padding-inline-end: calc(var(--pf-v6-c-table--cell--first-last-child--PaddingInline) + var(--pf-v6-c-table--cell--PaddingRight));
260
+ padding-inline-end: calc(var(--pf-v6-c-table--cell--first-last-child--PaddingInline) + var(--pf-v6-c-table--cell--PaddingInlineEnd));
264
261
  }
265
262
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-center {
266
263
  text-align: center;
@@ -286,15 +283,15 @@
286
283
  content: "";
287
284
  }
288
285
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-border-right::before {
289
- border-inline-end: var(--pf-v6-c-table--cell--m-border-right--before--BorderRightWidth) solid var(--pf-v6-c-table--cell--m-border-right--before--BorderRightColor);
286
+ border-inline-end: var(--pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth) solid var(--pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor);
290
287
  }
291
288
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td).pf-m-border-left::before {
292
- border-inline-start: var(--pf-v6-c-table--cell--m-border-left--before--BorderLeftWidth) solid var(--pf-v6-c-table--cell--m-border-left--before--BorderLeftColor);
289
+ border-inline-start: var(--pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth) solid var(--pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor);
293
290
  }
294
291
  .pf-v6-c-table caption:where(.pf-v6-c-table__caption) {
295
- padding-block-start: var(--pf-v6-c-table__caption--PaddingTop);
296
- padding-block-end: var(--pf-v6-c-table__caption--PaddingBottom);
297
- padding-inline-start: var(--pf-v6-c-table__caption--PaddingLeft);
292
+ padding-block-start: var(--pf-v6-c-table__caption--PaddingBlockStart);
293
+ padding-block-end: var(--pf-v6-c-table__caption--PaddingBlockEnd);
294
+ padding-inline-start: var(--pf-v6-c-table__caption--PaddingInlineStart);
298
295
  font-size: var(--pf-v6-c-table__caption--FontSize);
299
296
  color: var(--pf-v6-c-table__caption--Color);
300
297
  text-align: start;
@@ -309,15 +306,15 @@
309
306
  }
310
307
  .pf-v6-c-table thead:where(.pf-v6-c-table__thead).pf-m-nested-column-header tr:where(.pf-v6-c-table__tr):not(:first-child) th:where(.pf-v6-c-table__th):not([rowspan]),
311
308
  .pf-v6-c-table thead:where(.pf-v6-c-table__thead).pf-m-nested-column-header tr:where(.pf-v6-c-table__tr):not(:first-child) td:where(.pf-v6-c-table__td):not([rowspan]) {
312
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingTop);
309
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockStart);
313
310
  }
314
311
  .pf-v6-c-table thead:where(.pf-v6-c-table__thead) .pf-v6-c-table__subhead {
315
312
  --pf-v6-c-table__sort__button__text--Color: var(--pf-v6-c-table__subhead--Color);
316
313
  color: var(--pf-v6-c-table__subhead--Color);
317
314
  }
318
315
  .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) {
319
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table__tbody--cell--PaddingTop);
320
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table__tbody--cell--PaddingBottom);
316
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table__tbody--cell--PaddingBlockStart);
317
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table__tbody--cell--PaddingBlockEnd);
321
318
  --pf-v6-c-table--cell--FontSize: var(--pf-v6-c-table__tbody--cell--FontSize);
322
319
  }
323
320
  .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) > tr:where(.pf-v6-c-table__tr) > :where(th, td) {
@@ -364,10 +361,10 @@
364
361
  --pf-v6-c-table--cell--WhiteSpace: normal;
365
362
  }
366
363
  .pf-v6-c-table.pf-m-no-border-rows > tbody:where(.pf-v6-c-table__tbody) {
367
- --pf-v6-c-table__tr--BorderBottomWidth: 0;
368
- --pf-v6-c-table__tbody--BorderBottomWidth: 0;
369
- --pf-v6-c-table--m-expandable__tbody--BorderBottomWidth: 0;
370
- --pf-v6-c-table__control-row--BorderBottomWidth: 0;
364
+ --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
365
+ --pf-v6-c-table__tbody--BorderBlockEndWidth: 0;
366
+ --pf-v6-c-table--m-expandable__tbody--BorderBlockEndWidth: 0;
367
+ --pf-v6-c-table__control-row--BorderBlockEndWidth: 0;
371
368
  }
372
369
  .pf-v6-c-table.pf-m-no-border-rows > tbody:where(.pf-v6-c-table__tbody) > tr:where(.pf-v6-c-table__tr) {
373
370
  border-block-end: 0;
@@ -392,7 +389,7 @@
392
389
  outline-offset: var(--pf-v6-c-table__tr--m-selected--OutlineOffset);
393
390
  }
394
391
  .pf-v6-c-table tr:where(.pf-v6-c-table__tr).pf-m-first-cell-offset-reset > :first-child {
395
- padding-inline-start: var(--pf-v6-c-table__tr--m-first-cell-offset-reset--cell--PaddingLeft);
392
+ padding-inline-start: var(--pf-v6-c-table__tr--m-first-cell-offset-reset--cell--PaddingInlineStart);
396
393
  }
397
394
  .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody).pf-m-clickable {
398
395
  cursor: pointer;
@@ -409,6 +406,9 @@
409
406
  background-color: var(--pf-v6-c-table__tbody--m-selected--BackgroundColor);
410
407
  outline-offset: var(--pf-v6-c-table__tbody--m-selected--OutlineOffset);
411
408
  }
409
+ .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody).pf-m-selected .pf-v6-c-table__tr.pf-m-expanded:not(.pf-v6-c-table__expandable-row) {
410
+ border: none;
411
+ }
412
412
  .pf-v6-c-table.pf-m-drag-over {
413
413
  overflow-anchor: none;
414
414
  }
@@ -445,12 +445,12 @@
445
445
 
446
446
  .pf-v6-c-table__button {
447
447
  width: auto;
448
- padding-block-start: var(--pf-v6-c-table__button--PaddingTop);
449
- padding-block-end: var(--pf-v6-c-table__button--PaddingBottom);
450
- padding-inline-start: var(--pf-v6-c-table__button--PaddingLeft);
451
- padding-inline-end: var(--pf-v6-c-table__button--PaddingRight);
452
- margin-block-end: calc(var(--pf-v6-c-table__button--PaddingBottom) * -1);
453
- margin-inline-start: calc(var(--pf-v6-c-table__button--PaddingLeft) * -1);
448
+ padding-block-start: var(--pf-v6-c-table__button--PaddingBlockStart);
449
+ padding-block-end: var(--pf-v6-c-table__button--PaddingBlockEnd);
450
+ padding-inline-start: var(--pf-v6-c-table__button--PaddingInlineStart);
451
+ padding-inline-end: var(--pf-v6-c-table__button--PaddingInlineEnd);
452
+ margin-block-end: calc(var(--pf-v6-c-table__button--PaddingBlockEnd) * -1);
453
+ margin-inline-start: calc(var(--pf-v6-c-table__button--PaddingInlineStart) * -1);
454
454
  font-size: inherit;
455
455
  font-weight: inherit;
456
456
  color: var(--pf-v6-c-table__button--Color);
@@ -523,10 +523,10 @@
523
523
  }
524
524
 
525
525
  .pf-v6-c-table__toggle {
526
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table__toggle--PaddingTop);
527
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table__toggle--PaddingBottom);
528
- --pf-v6-c-table--cell--PaddingLeft: var(--pf-v6-c-table__toggle--PaddingLeft);
529
- --pf-v6-c-table--cell--PaddingRight: var(--pf-v6-c-table__toggle--PaddingRight);
526
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table__toggle--PaddingBlockStart);
527
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table__toggle--PaddingBlockEnd);
528
+ --pf-v6-c-table--cell--PaddingInlineStart: var(--pf-v6-c-table__toggle--PaddingInlineStart);
529
+ --pf-v6-c-table--cell--PaddingInlineEnd: var(--pf-v6-c-table__toggle--PaddingInlineEnd);
530
530
  }
531
531
  .pf-v6-c-table__toggle .pf-v6-c-button.pf-m-expanded .pf-v6-c-table__toggle-icon {
532
532
  transform: rotate(var(--pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate));
@@ -544,8 +544,8 @@
544
544
  }
545
545
 
546
546
  .pf-v6-c-table__check {
547
- --pf-v6-c-table--cell--PaddingLeft: var(--pf-v6-c-table__check--PaddingLeft);
548
- --pf-v6-c-table--cell--PaddingRight: var(--pf-v6-c-table__check--PaddingRight);
547
+ --pf-v6-c-table--cell--PaddingInlineStart: var(--pf-v6-c-table__check--PaddingInlineStart);
548
+ --pf-v6-c-table--cell--PaddingInlineEnd: var(--pf-v6-c-table__check--PaddingInlineEnd);
549
549
  vertical-align: top;
550
550
  }
551
551
  .pf-v6-c-table__check .pf-v6-c-check {
@@ -588,10 +588,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
588
588
  .pf-v6-c-table__favorite,
589
589
  .pf-v6-c-table__inline-edit-action,
590
590
  .pf-v6-c-table__draggable {
591
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table__action--PaddingTop);
592
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table__action--PaddingBottom);
593
- --pf-v6-c-table--cell--PaddingLeft: var(--pf-v6-c-table__action--PaddingLeft);
594
- --pf-v6-c-table--cell--PaddingRight: var(--pf-v6-c-table__action--PaddingRight);
591
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table__action--PaddingBlockStart);
592
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table__action--PaddingBlockEnd);
593
+ --pf-v6-c-table--cell--PaddingInlineStart: var(--pf-v6-c-table__action--PaddingInlineStart);
594
+ --pf-v6-c-table--cell--PaddingInlineEnd: var(--pf-v6-c-table__action--PaddingInlineEnd);
595
595
  }
596
596
 
597
597
  .pf-v6-c-table__action:last-child,
@@ -624,15 +624,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
624
624
  inset: 0;
625
625
  content: "";
626
626
  border: 0;
627
- border-block-start: var(--pf-v6-c-table__compound-expansion-toggle__button--after--BorderTopWidth) solid var(--pf-v6-c-table__compound-expansion-toggle__button--after--BorderColor);
627
+ border-block-start: var(--pf-v6-c-table__compound-expansion-toggle__button--after--BorderBlockStartWidth) solid var(--pf-v6-c-table__compound-expansion-toggle__button--after--BorderColor);
628
628
  }
629
629
  .pf-v6-c-table__compound-expansion-toggle:hover, .pf-v6-c-table__compound-expansion-toggle:focus-within {
630
630
  --pf-v6-c-table__compound-expansion-toggle__button--BackgroundColor: var(--pf-v6-c-table__compound-expansion-toggle__button--hover--BackgroundColor);
631
- --pf-v6-c-table__compound-expansion-toggle__button--after--BorderTopWidth: var(--pf-v6-c-table__compound-expansion-toggle__button--hover--after--BorderTopWidth);
631
+ --pf-v6-c-table__compound-expansion-toggle__button--after--BorderBlockStartWidth: var(--pf-v6-c-table__compound-expansion-toggle__button--hover--after--BorderBlockStartWidth);
632
632
  }
633
633
  .pf-v6-c-table__compound-expansion-toggle.pf-m-expanded {
634
634
  --pf-v6-c-table__compound-expansion-toggle__button--BackgroundColor: var(--pf-v6-c-table__compound-expansion-toggle__button--expanded--BackgroundColor);
635
- --pf-v6-c-table__compound-expansion-toggle__button--after--BorderTopWidth: var(--pf-v6-c-table__compound-expansion-toggle--m-expanded__button--after--BorderTopWidth);
635
+ --pf-v6-c-table__compound-expansion-toggle__button--after--BorderBlockStartWidth: var(--pf-v6-c-table__compound-expansion-toggle--m-expanded__button--after--BorderBlockStartWidth);
636
636
  }
637
637
  .pf-v6-c-table__compound-expansion-toggle:focus-within {
638
638
  outline-offset: var(--pf-v6-c-table__button--OutlineOffset);
@@ -645,7 +645,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
645
645
  }
646
646
 
647
647
  .pf-v6-c-table__column-help-action {
648
- margin-inline-start: var(--pf-v6-c-table__column-help--MarginLeft);
648
+ margin-inline-start: var(--pf-v6-c-table__column-help--MarginInlineStart);
649
649
  }
650
650
 
651
651
  .pf-v6-c-table__sort {
@@ -673,7 +673,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
673
673
  .pf-v6-c-table__sort-indicator {
674
674
  grid-column: 2;
675
675
  align-self: end;
676
- margin-inline-start: var(--pf-v6-c-table__sort-indicator--MarginLeft);
676
+ margin-inline-start: var(--pf-v6-c-table__sort-indicator--MarginInlineStart);
677
677
  color: var(--pf-v6-c-table__sort-indicator--Color);
678
678
  pointer-events: none;
679
679
  }
@@ -688,7 +688,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
688
688
  }
689
689
  .pf-v6-c-table__expandable-row > td,
690
690
  .pf-v6-c-table__expandable-row > th {
691
- padding-top: 0;
691
+ padding-block-start: 0;
692
692
  }
693
693
  .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding,
694
694
  .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding {
@@ -702,14 +702,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
702
702
  padding: 0;
703
703
  }
704
704
  .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content {
705
- padding-block-start: var(--pf-v6-c-table__expandable-row-content--PaddingTop);
706
- padding-block-end: var(--pf-v6-c-table__expandable-row-content--PaddingBottom);
707
- padding-inline-start: var(--pf-v6-c-table__expandable-row-content--PaddingLeft);
708
- padding-inline-end: var(--pf-v6-c-table__expandable-row-content--PaddingRight);
705
+ padding-block-start: var(--pf-v6-c-table__expandable-row-content--PaddingBlockStart);
706
+ padding-block-end: var(--pf-v6-c-table__expandable-row-content--PaddingBlockEnd);
707
+ padding-inline-start: var(--pf-v6-c-table__expandable-row-content--PaddingInlineStart);
708
+ padding-inline-end: var(--pf-v6-c-table__expandable-row-content--PaddingInlineEnd);
709
+ background-color: var(--pf-v6-c-table__expandable-row-content--BackgroundColor);
709
710
  border-radius: var(--pf-v6-c-table__expandable-row-content--BorderRadius);
710
711
  }
711
712
  .pf-v6-c-table__expandable-row.pf-m-expanded {
712
- border-block-end-color: var(--pf-v6-c-table__expandable-row--m-expanded--BorderBottomColor);
713
+ border-block-end-color: var(--pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor);
713
714
  border-block-end-width: var(--pf-v6-c-table--border-width--base);
714
715
  }
715
716
  .pf-v6-c-table__expandable-row:not(.pf-m-expanded) {
@@ -720,24 +721,24 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
720
721
  }
721
722
 
722
723
  .pf-v6-c-table.pf-m-compact {
723
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table--m-compact--cell--PaddingTop);
724
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table--m-compact--cell--PaddingBottom);
724
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--m-compact--cell--PaddingBlockStart);
725
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact--cell--PaddingBlockEnd);
725
726
  }
726
727
  .pf-v6-c-table.pf-m-compact tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) {
727
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table--m-compact--cell--PaddingTop);
728
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table--m-compact--cell--PaddingBottom);
728
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--m-compact--cell--PaddingBlockStart);
729
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact--cell--PaddingBlockEnd);
729
730
  }
730
731
  .pf-v6-c-table.pf-m-compact thead:where(.pf-v6-c-table__thead) th:where(.pf-v6-c-table__th),
731
732
  .pf-v6-c-table.pf-m-compact thead:where(.pf-v6-c-table__thead) .pf-v6-c-table__toggle {
732
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table--m-compact__th--PaddingTop);
733
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table--m-compact__th--PaddingBottom);
733
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--m-compact__th--PaddingBlockStart);
734
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact__th--PaddingBlockEnd);
734
735
  }
735
736
  .pf-v6-c-table.pf-m-compact .pf-v6-c-table__action,
736
737
  .pf-v6-c-table.pf-m-compact .pf-v6-c-table__favorite,
737
738
  .pf-v6-c-table.pf-m-compact .pf-v6-c-table__toggle,
738
739
  .pf-v6-c-table.pf-m-compact .pf-v6-c-table__draggable {
739
- --pf-v6-c-table--cell--PaddingTop: var(--pf-v6-c-table--m-compact__action--PaddingTop);
740
- --pf-v6-c-table--cell--PaddingBottom: var(--pf-v6-c-table--m-compact__action--PaddingBottom);
740
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--m-compact__action--PaddingBlockStart);
741
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact__action--PaddingBlockEnd);
741
742
  }
742
743
  .pf-v6-c-table.pf-m-compact .pf-v6-c-table__icon {
743
744
  width: auto;
@@ -746,14 +747,14 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
746
747
  }
747
748
 
748
749
  .pf-v6-c-table__thead {
749
- --pf-v6-c-table__tr--BorderBottomWidth: 0;
750
- --pf-v6-c-table__toggle--PaddingBottom: var(--pf-v6-c-table__thead__toggle--PaddingBottom);
750
+ --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
751
+ --pf-v6-c-table__toggle--PaddingBlockEnd: var(--pf-v6-c-table__thead__toggle--PaddingBlockEnd);
751
752
  vertical-align: bottom;
752
753
  }
753
754
  .pf-v6-c-table__thead.pf-m-nested-column-header .pf-v6-c-table__button {
754
- --pf-v6-c-table__button--PaddingLeft: var(--pf-v6-c-table__nested-column-header__button--PaddingLeft);
755
- --pf-v6-c-table__button--PaddingRight: var(--pf-v6-c-table__nested-column-header__button--PaddingRight);
756
- margin-inline-end: calc(var(--pf-v6-c-table__button--PaddingLeft) * -1);
755
+ --pf-v6-c-table__button--PaddingInlineStart: var(--pf-v6-c-table__nested-column-header__button--PaddingInlineStart);
756
+ --pf-v6-c-table__button--PaddingInlineEnd: var(--pf-v6-c-table__nested-column-header__button--PaddingInlineEnd);
757
+ margin-inline-end: calc(var(--pf-v6-c-table__button--PaddingInlineStart) * -1);
757
758
  }
758
759
 
759
760
  .pf-v6-c-table__tbody {
@@ -767,18 +768,18 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
767
768
  border-block-end: 0;
768
769
  }
769
770
  .pf-v6-c-table.pf-m-expandable .pf-v6-c-table__tbody {
770
- border-block-end: var(--pf-v6-c-table__tr--BorderBottomWidth) solid var(--pf-v6-c-table__tr--BorderBottomColor);
771
+ border-block-end: var(--pf-v6-c-table__tr--BorderBlockEndWidth) solid var(--pf-v6-c-table__tr--BorderBlockEndColor);
771
772
  }
772
773
  .pf-v6-c-table.pf-m-expandable .pf-v6-c-table__tbody.pf-m-expanded {
773
- border-block-end: var(--pf-v6-c-table__tr--BorderBottomWidth) solid var(--pf-v6-c-table__tr--BorderBottomColor);
774
+ border-block-end: var(--pf-v6-c-table__tr--BorderBlockEndWidth) solid var(--pf-v6-c-table__tr--BorderBlockEndColor);
774
775
  }
775
776
  .pf-v6-c-table.pf-m-expandable .pf-v6-c-table__tbody.pf-m-expanded .pf-v6-c-table__control-row {
776
777
  background-color: var(--pf-v6-c-table__control-row--BackgroundColor);
777
- border-block-end: var(--pf-v6-c-table__control-row--BorderBottomWidth) solid var(--pf-v6-c-table__control-row__tbody--BorderBottomColor);
778
+ border-block-end: var(--pf-v6-c-table__control-row--BorderBlockEndWidth) solid var(--pf-v6-c-table__control-row__tbody--BorderBlockEndColor);
778
779
  }
779
780
 
780
781
  .pf-v6-c-table__tr {
781
- border-block-end: var(--pf-v6-c-table__tr--BorderBottomWidth) solid var(--pf-v6-c-table__tr--BorderBottomColor);
782
+ border-block-end: var(--pf-v6-c-table__tr--BorderBlockEndWidth) solid var(--pf-v6-c-table__tr--BorderBlockEndColor);
782
783
  }
783
784
  .pf-v6-c-table__thead .pf-v6-c-table__tr {
784
785
  border-block-end: 0;
@@ -792,7 +793,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
792
793
  align-items: center;
793
794
  }
794
795
  .pf-v6-c-table__icon-inline > :not(:last-child) {
795
- margin-inline-end: var(--pf-v6-c-table__icon-inline--MarginRight);
796
+ margin-inline-end: var(--pf-v6-c-table__icon-inline--MarginInlineEnd);
796
797
  }
797
798
 
798
799
  .pf-v6-c-table .pf-m-width-10 {