@patternfly/patternfly 6.0.0-alpha.7 → 6.0.0-alpha.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (260) hide show
  1. package/README.md +13 -3
  2. package/assets/icons/iconUnicodes.json +1 -0
  3. package/assets/pficon/pf-v5-pficon.woff2 +0 -0
  4. package/assets/pficon/pficon.scss +6 -129
  5. package/base/_common.scss +21 -0
  6. package/base/_globals.scss +1 -1
  7. package/base/_variables.scss +7 -0
  8. package/base/patternfly-common.css +16 -2
  9. package/base/patternfly-globals.css +1 -1
  10. package/base/patternfly-icons.css +5 -1
  11. package/base/patternfly-pf-icons.css +5 -1
  12. package/base/patternfly-variables.css +16 -0
  13. package/base/tokens/_tokens-font.scss +16 -14
  14. package/components/AboutModalBox/about-modal-box.css +23 -12
  15. package/components/AboutModalBox/about-modal-box.scss +25 -12
  16. package/components/Accordion/accordion.css +33 -20
  17. package/components/Accordion/accordion.scss +32 -20
  18. package/components/ActionList/action-list.css +2 -2
  19. package/components/ActionList/action-list.scss +2 -2
  20. package/components/Alert/alert-group.css +7 -4
  21. package/components/Alert/alert-group.scss +7 -4
  22. package/components/Alert/alert.css +19 -13
  23. package/components/Alert/alert.scss +18 -13
  24. package/components/AppLauncher/app-launcher.css +32 -23
  25. package/components/AppLauncher/app-launcher.scss +32 -23
  26. package/components/BackToTop/back-to-top.css +2 -2
  27. package/components/BackToTop/back-to-top.scss +2 -2
  28. package/components/Backdrop/backdrop.css +2 -2
  29. package/components/Backdrop/backdrop.scss +2 -2
  30. package/components/BackgroundImage/background-image.css +6 -3
  31. package/components/BackgroundImage/background-image.scss +8 -3
  32. package/components/Badge/badge.css +2 -2
  33. package/components/Badge/badge.scss +2 -2
  34. package/components/Banner/banner.css +5 -5
  35. package/components/Banner/banner.scss +5 -2
  36. package/components/Breadcrumb/breadcrumb.css +9 -3
  37. package/components/Breadcrumb/breadcrumb.scss +8 -3
  38. package/components/Button/button.css +33 -21
  39. package/components/Button/button.scss +35 -23
  40. package/components/Button/themes/dark/button.scss +1 -1
  41. package/components/CalendarMonth/calendar-month.css +25 -15
  42. package/components/CalendarMonth/calendar-month.scss +23 -15
  43. package/components/Card/card.css +25 -17
  44. package/components/Card/card.scss +24 -17
  45. package/components/Check/check.css +2 -2
  46. package/components/Check/check.scss +2 -2
  47. package/components/Chip/chip-group.css +6 -6
  48. package/components/Chip/chip-group.scss +6 -6
  49. package/components/Chip/chip.css +16 -9
  50. package/components/Chip/chip.scss +17 -9
  51. package/components/ClipboardCopy/clipboard-copy.css +19 -10
  52. package/components/ClipboardCopy/clipboard-copy.scss +16 -8
  53. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +2 -2
  54. package/components/CodeBlock/code-block.css +6 -3
  55. package/components/CodeBlock/code-block.scss +6 -3
  56. package/components/CodeEditor/code-editor.css +31 -22
  57. package/components/CodeEditor/code-editor.scss +30 -21
  58. package/components/CodeEditor/themes/dark/code-editor.scss +1 -1
  59. package/components/Content/content.css +33 -30
  60. package/components/Content/content.scss +33 -30
  61. package/components/ContextSelector/context-selector.css +41 -26
  62. package/components/ContextSelector/context-selector.scss +40 -25
  63. package/components/ContextSelector/themes/dark/context-selector.scss +1 -1
  64. package/components/DataList/data-list-grid.css +21 -21
  65. package/components/DataList/data-list-grid.scss +3 -3
  66. package/components/DataList/data-list.css +69 -56
  67. package/components/DataList/data-list.scss +47 -35
  68. package/components/DatePicker/date-picker.css +8 -8
  69. package/components/DatePicker/date-picker.scss +8 -8
  70. package/components/DescriptionList/description-list.css +8 -5
  71. package/components/DescriptionList/description-list.scss +8 -5
  72. package/components/DragDrop/drag-drop.css +8 -8
  73. package/components/DragDrop/drag-drop.scss +8 -8
  74. package/components/Drawer/drawer.css +120 -61
  75. package/components/Drawer/drawer.scss +92 -43
  76. package/components/Dropdown/dropdown.css +75 -66
  77. package/components/Dropdown/dropdown.scss +65 -56
  78. package/components/DualListSelector/dual-list-selector.css +29 -15
  79. package/components/DualListSelector/dual-list-selector.scss +30 -15
  80. package/components/EmptyState/empty-state.css +7 -4
  81. package/components/EmptyState/empty-state.scss +7 -4
  82. package/components/ExpandableSection/expandable-section.css +17 -10
  83. package/components/ExpandableSection/expandable-section.scss +15 -10
  84. package/components/FileUpload/file-upload.css +9 -15
  85. package/components/FileUpload/file-upload.scss +9 -15
  86. package/components/Form/form.css +53 -50
  87. package/components/Form/form.scss +46 -44
  88. package/components/FormControl/form-control.css +18 -9
  89. package/components/FormControl/form-control.scss +18 -9
  90. package/components/HelperText/helper-text.css +1 -1
  91. package/components/HelperText/helper-text.scss +1 -1
  92. package/components/Hint/hint.css +9 -6
  93. package/components/Hint/hint.scss +9 -6
  94. package/components/Icon/icon.css +1 -1
  95. package/components/Icon/icon.scss +1 -1
  96. package/components/InlineEdit/inline-edit.css +4 -4
  97. package/components/InlineEdit/inline-edit.scss +4 -4
  98. package/components/InputGroup/input-group.css +12 -6
  99. package/components/InputGroup/input-group.scss +11 -5
  100. package/components/InputGroup/themes/dark/input-group.scss +1 -1
  101. package/components/JumpLinks/jump-links.css +27 -24
  102. package/components/JumpLinks/jump-links.scss +26 -24
  103. package/components/Label/label-group.css +13 -10
  104. package/components/Label/label-group.scss +13 -10
  105. package/components/Label/label.css +9 -9
  106. package/components/Label/label.scss +9 -9
  107. package/components/List/list.css +9 -9
  108. package/components/List/list.scss +9 -9
  109. package/components/LogViewer/log-viewer.css +14 -14
  110. package/components/LogViewer/log-viewer.scss +14 -14
  111. package/components/Login/login.css +36 -27
  112. package/components/Login/login.scss +36 -27
  113. package/components/Masthead/masthead.css +19 -22
  114. package/components/Masthead/masthead.scss +19 -22
  115. package/components/Menu/menu.css +79 -65
  116. package/components/Menu/menu.scss +80 -68
  117. package/components/MenuToggle/menu-toggle.css +33 -27
  118. package/components/MenuToggle/menu-toggle.scss +33 -27
  119. package/components/ModalBox/modal-box.css +19 -19
  120. package/components/ModalBox/modal-box.scss +20 -20
  121. package/components/MultipleFileUpload/multiple-file-upload.css +11 -8
  122. package/components/MultipleFileUpload/multiple-file-upload.scss +11 -8
  123. package/components/Nav/nav.css +120 -93
  124. package/components/Nav/nav.scss +120 -93
  125. package/components/Nav/themes/dark/nav.scss +2 -2
  126. package/components/NotificationBadge/notification-badge.css +66 -85
  127. package/components/NotificationBadge/notification-badge.scss +72 -103
  128. package/components/NotificationDrawer/notification-drawer.css +32 -19
  129. package/components/NotificationDrawer/notification-drawer.scss +30 -19
  130. package/components/NumberInput/number-input.css +2 -2
  131. package/components/NumberInput/number-input.scss +2 -2
  132. package/components/OptionsMenu/options-menu.css +43 -31
  133. package/components/OptionsMenu/options-menu.scss +43 -31
  134. package/components/OverflowMenu/overflow-menu.css +2 -2
  135. package/components/OverflowMenu/overflow-menu.scss +2 -2
  136. package/components/Page/page.css +135 -77
  137. package/components/Page/page.scss +81 -52
  138. package/components/Page/themes/dark/page.scss +1 -1
  139. package/components/Pagination/pagination.css +27 -17
  140. package/components/Pagination/pagination.scss +25 -17
  141. package/components/Panel/panel.css +13 -7
  142. package/components/Panel/panel.scss +13 -7
  143. package/components/Popover/popover.css +72 -40
  144. package/components/Popover/popover.scss +95 -75
  145. package/components/Progress/progress.css +9 -7
  146. package/components/Progress/progress.scss +12 -7
  147. package/components/ProgressStepper/progress-stepper.css +26 -20
  148. package/components/ProgressStepper/progress-stepper.scss +25 -19
  149. package/components/Radio/radio.css +3 -3
  150. package/components/Radio/radio.scss +3 -3
  151. package/components/Select/select.css +56 -47
  152. package/components/Select/select.scss +56 -47
  153. package/components/Sidebar/sidebar.css +11 -5
  154. package/components/Sidebar/sidebar.scss +11 -5
  155. package/components/SimpleList/simple-list.css +10 -4
  156. package/components/SimpleList/simple-list.scss +10 -4
  157. package/components/Skeleton/skeleton.css +6 -5
  158. package/components/Skeleton/skeleton.scss +4 -5
  159. package/components/SkipToContent/skip-to-content.css +3 -3
  160. package/components/SkipToContent/skip-to-content.scss +3 -3
  161. package/components/Slider/slider.css +47 -26
  162. package/components/Slider/slider.scss +56 -28
  163. package/components/Switch/switch.css +9 -5
  164. package/components/Switch/switch.scss +10 -6
  165. package/components/TabContent/tab-content.css +4 -1
  166. package/components/TabContent/tab-content.scss +4 -1
  167. package/components/Table/table-grid.css +256 -195
  168. package/components/Table/table-grid.scss +53 -39
  169. package/components/Table/table-scrollable.css +4 -4
  170. package/components/Table/table-scrollable.scss +6 -4
  171. package/components/Table/table-tree-view.css +112 -105
  172. package/components/Table/table-tree-view.scss +38 -33
  173. package/components/Table/table.css +92 -70
  174. package/components/Table/table.scss +90 -70
  175. package/components/Tabs/tabs.css +76 -48
  176. package/components/Tabs/tabs.scss +74 -48
  177. package/components/TextInputGroup/text-input-group.css +15 -15
  178. package/components/TextInputGroup/text-input-group.scss +15 -15
  179. package/components/Tile/tile.css +10 -10
  180. package/components/Tile/tile.scss +10 -10
  181. package/components/ToggleGroup/toggle-group.css +14 -11
  182. package/components/ToggleGroup/toggle-group.scss +14 -11
  183. package/components/Toolbar/toolbar.css +44 -41
  184. package/components/Toolbar/toolbar.scss +26 -21
  185. package/components/Tooltip/tooltip.css +60 -28
  186. package/components/Tooltip/tooltip.scss +76 -56
  187. package/components/TreeView/tree-view.css +48 -27
  188. package/components/TreeView/tree-view.scss +50 -28
  189. package/components/Truncate/truncate.css +9 -0
  190. package/components/Truncate/truncate.scss +16 -3
  191. package/components/Wizard/wizard.css +57 -36
  192. package/components/Wizard/wizard.scss +57 -36
  193. package/docs/components/Button/examples/Button.css +2 -2
  194. package/docs/components/Button/examples/Button.md +15 -3
  195. package/docs/components/Card/examples/Card.md +15 -15
  196. package/docs/components/Check/examples/Check.md +71 -59
  197. package/docs/components/Chip/examples/Chip.md +1 -1
  198. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +106 -0
  199. package/docs/components/CodeEditor/examples/CodeEditor.md +3 -3
  200. package/docs/components/DragDrop/examples/DragDrop.css +2 -2
  201. package/docs/components/Dropdown/deprecated/Dropdown.css +1 -1
  202. package/docs/components/DualListSelector/examples/DualListSelector.md +64 -16
  203. package/docs/components/Label/examples/Label.md +1 -1
  204. package/docs/components/LogViewer/examples/LogViewer.css +2 -2
  205. package/docs/components/LogViewer/examples/LogViewer.md +120 -30
  206. package/docs/components/Menu/examples/Menu.css +8 -0
  207. package/docs/components/Menu/examples/Menu.md +90 -73
  208. package/docs/components/MenuToggle/examples/MenuToggle.md +60 -39
  209. package/docs/components/ModalBox/examples/ModalBox.css +3 -8
  210. package/docs/components/Nav/examples/Navigation.css +4 -21
  211. package/docs/components/Nav/examples/Navigation.md +99 -0
  212. package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
  213. package/docs/components/OptionsMenu/deprecated/options-menu.md +12 -3
  214. package/docs/components/Popover/examples/Popover.css +4 -9
  215. package/docs/components/Radio/examples/Radio.md +63 -55
  216. package/docs/components/Select/deprecated/Select.md +184 -177
  217. package/docs/components/Table/examples/Table.css +2 -2
  218. package/docs/components/Table/examples/Table.md +2 -2
  219. package/docs/components/TextInputGroup/examples/TextInputGroup.css +1 -1
  220. package/docs/components/Tile/examples/Tile.css +1 -1
  221. package/docs/components/Toolbar/examples/Toolbar.md +525 -431
  222. package/docs/components/Tooltip/examples/Tooltip.css +4 -0
  223. package/docs/components/Tooltip/examples/Tooltip.md +3 -1
  224. package/docs/components/Truncate/examples/Truncate.md +2 -2
  225. package/docs/demos/Card/examples/Card.css +3 -3
  226. package/docs/demos/Card/examples/Card.md +26 -10
  227. package/docs/demos/CardView/examples/CardView.md +24 -20
  228. package/docs/demos/Dashboard/examples/Dashboard.md +3 -3
  229. package/docs/demos/DataList/examples/DataList.md +8 -2
  230. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +160 -124
  231. package/docs/demos/Skeleton/examples/Skeleton.md +7 -35
  232. package/docs/demos/Table/examples/Table.md +336 -252
  233. package/docs/demos/Tabs/examples/Tabs.md +28 -21
  234. package/docs/demos/Toolbar/examples/Toolbar.css +5 -0
  235. package/docs/demos/Toolbar/examples/Toolbar.md +44 -44
  236. package/docs/layouts/Flex/examples/Flex.md +5 -5
  237. package/docs/utilities/BoxShadow/examples/box-shadow.css +5 -5
  238. package/icons/pficons.mjs +1 -0
  239. package/layouts/Flex/flex.css +115 -43
  240. package/layouts/Flex/flex.scss +20 -8
  241. package/package.json +9 -5
  242. package/patternfly-addons.css +732 -972
  243. package/patternfly-base-no-globals-theme-dark-unversioned.css +37 -3
  244. package/patternfly-base-no-globals.css +37 -3
  245. package/patternfly-base-theme-dark-unversioned.css +38 -4
  246. package/patternfly-base.css +38 -4
  247. package/patternfly-no-globals.css +2748 -1960
  248. package/patternfly-theme-dark-unversioned.css +2749 -1961
  249. package/patternfly.css +2749 -1961
  250. package/patternfly.min.css +1 -1
  251. package/patternfly.min.css.map +1 -1
  252. package/sass-utilities/functions.scss +6 -0
  253. package/sass-utilities/mixins.scss +62 -2
  254. package/sass-utilities/scss-variables.scss +8 -8
  255. package/sass-utilities/themes/dark/mixins.scss +3 -1
  256. package/utilities/Accessibility/accessibility.css +12 -12
  257. package/utilities/Spacing/spacing.css +720 -960
  258. package/utilities/Spacing/spacing.scss +4 -8
  259. package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
  260. package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
package/components/Table/table-grid.css CHANGED
@@ -39,6 +39,7 @@
39
39
  --pf-v5-c-table--m-compact__tr--responsive--PaddingBottom: var(--pf-v5-global--spacer--sm);
40
40
  --pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop: var(--pf-v5-global--spacer--xs);
41
41
  --pf-v5-c-table--m-compact__tr__td--responsive--PaddingBottom: var(--pf-v5-global--spacer--xs);
42
+ --pf-v5-c-table--m-compact__check--responsive--MarginTop: 0.4375rem;
42
43
  --pf-v5-c-table--m-compact__action--responsive--MarginTop: calc(var(--pf-v5-global--spacer--xs) * -1);
43
44
  --pf-v5-c-table--m-compact__action--responsive--MarginBottom: calc(var(--pf-v5-global--spacer--xs) * -1);
44
45
  --pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom: calc(0.375rem * -1);
@@ -107,26 +108,26 @@
107
108
  display: block;
108
109
  }
109
110
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):first-of-type {
110
- border-top: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
111
+ border-block-start: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
111
112
  }
112
113
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table.pf-m-compact > tbody:where(.pf-v5-c-table__tbody) {
113
- border-top: 0;
114
+ border-block-start: 0;
114
115
  }
115
116
  .pf-m-grid.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
116
- border-bottom: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
117
+ border-block-end: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
117
118
  }
118
119
  .pf-m-grid.pf-v5-c-table tr:where(.pf-v5-c-table__tr):last-child,
119
120
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):last-of-type:not(:only-of-type) > tr:where(.pf-v5-c-table__tr) {
120
- border-bottom-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
121
+ border-block-end-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
121
122
  }
122
123
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
123
- border-bottom: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
124
+ border-block-end: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
124
125
  }
125
126
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
126
- border-bottom: 0;
127
+ border-block-end: 0;
127
128
  }
128
129
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded:not(:last-of-type) {
129
- border-bottom: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
130
+ border-block-end: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
130
131
  }
131
132
  .pf-m-grid.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected {
132
133
  --pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
@@ -138,10 +139,16 @@
138
139
  height: auto;
139
140
  grid-auto-columns: max-content;
140
141
  grid-column-gap: var(--pf-v5-c-table__tr--responsive--GridColumnGap);
141
- padding: var(--pf-v5-c-table__tr--responsive--PaddingTop) var(--pf-v5-c-table__tr--responsive--PaddingRight) var(--pf-v5-c-table__tr--responsive--PaddingBottom) var(--pf-v5-c-table__tr--responsive--PaddingLeft);
142
+ padding-block-start: var(--pf-v5-c-table__tr--responsive--PaddingTop);
143
+ padding-inline-end: var(--pf-v5-c-table__tr--responsive--PaddingRight);
144
+ padding-block-end: var(--pf-v5-c-table__tr--responsive--PaddingBottom);
145
+ padding-inline-start: var(--pf-v5-c-table__tr--responsive--PaddingLeft);
142
146
  }
143
147
  .pf-m-grid.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > * {
144
- padding: var(--pf-v5-c-table--cell--responsive--PaddingTop) var(--pf-v5-c-table--cell--responsive--PaddingRight) var(--pf-v5-c-table--cell--responsive--PaddingBottom) var(--pf-v5-c-table--cell--responsive--PaddingLeft);
148
+ padding-block-start: var(--pf-v5-c-table--cell--responsive--PaddingTop);
149
+ padding-inline-end: var(--pf-v5-c-table--cell--responsive--PaddingRight);
150
+ padding-block-end: var(--pf-v5-c-table--cell--responsive--PaddingBottom);
151
+ padding-inline-start: var(--pf-v5-c-table--cell--responsive--PaddingLeft);
145
152
  }
146
153
  .pf-m-grid.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > *:first-child {
147
154
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--cell--first-child--responsive--PaddingTop);
@@ -151,17 +158,18 @@
151
158
  --pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr--responsive--PaddingBottom);
152
159
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop);
153
160
  --pf-v5-c-table--cell--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingBottom);
161
+ --pf-v5-c-table__check--responsive--MarginTop: var(--pf-v5-c-table--m-compact__check--responsive--MarginTop);
154
162
  --pf-v5-c-table__check--input--MarginTop: 0;
155
163
  }
156
164
  .pf-m-grid.pf-v5-c-table.pf-m-compact .pf-v5-c-table__action {
157
- margin-top: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
158
- margin-bottom: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
165
+ margin-block-start: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
166
+ margin-block-end: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
159
167
  }
160
168
  .pf-m-grid.pf-v5-c-table.pf-m-compact .pf-v5-c-table__toggle .pf-v5-c-button {
161
- margin-bottom: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
169
+ margin-block-end: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
162
170
  }
163
171
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__icon > * {
164
- text-align: left;
172
+ text-align: start;
165
173
  }
166
174
  .pf-m-grid.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label] {
167
175
  --pf-v5-c-table--cell--hidden-visible--Display: var(--pf-v5-c-table--m-grid--cell--hidden-visible--Display);
@@ -175,7 +183,7 @@
175
183
  }
176
184
  .pf-m-grid.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label]::before {
177
185
  font-weight: bold;
178
- text-align: left;
186
+ text-align: start;
179
187
  content: attr(data-label);
180
188
  }
181
189
  .pf-m-grid.pf-v5-c-table tr:where(.pf-v5-c-table__tr) > *:first-child {
@@ -204,12 +212,12 @@
204
212
  }
205
213
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody)::after {
206
214
  position: absolute;
207
- top: 0;
208
- bottom: 0;
209
- left: 0;
215
+ inset-block-start: 0;
216
+ inset-block-end: 0;
217
+ inset-inline-start: 0;
210
218
  content: "";
211
219
  border: 0;
212
- border-left: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
220
+ border-inline-start: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
213
221
  }
214
222
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
215
223
  --pf-v5-c-table__tbody--after--BorderLeftWidth: var(--pf-v5-c-table__tbody--after--border-width--base);
@@ -233,7 +241,7 @@
233
241
  display: block;
234
242
  max-height: var(--pf-v5-c-table__expandable-row--MaxHeight);
235
243
  overflow-y: auto;
236
- border-bottom: none;
244
+ border-block-end: none;
237
245
  box-shadow: none;
238
246
  }
239
247
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__expandable-row > * {
@@ -241,7 +249,7 @@
241
249
  display: block;
242
250
  }
243
251
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__expandable-row.pf-m-expanded {
244
- border-top-color: var(--pf-v5-c-table--BorderColor);
252
+ border-block-start-color: var(--pf-v5-c-table--BorderColor);
245
253
  }
246
254
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__expandable-row > :first-child:not(.pf-v5-c-table__check)::after {
247
255
  content: none;
@@ -254,8 +262,8 @@
254
262
  display: none;
255
263
  }
256
264
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__expandable-row .pf-v5-c-table__expandable-row-content {
257
- padding-right: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
258
- padding-left: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
265
+ padding-inline-end: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
266
+ padding-inline-start: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
259
267
  }
260
268
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable {
261
269
  --pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
@@ -268,9 +276,9 @@
268
276
  .pf-m-grid.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable > tr:where(.pf-v5-c-table__tr)::after {
269
277
  content: "";
270
278
  position: absolute;
271
- top: 0;
272
- bottom: 0;
273
- left: 0;
279
+ inset-block-start: 0;
280
+ inset-block-end: 0;
281
+ inset-inline-start: 0;
274
282
  width: var(--pf-v5-c-table__tbody--after__tr--BorderLeftWidth);
275
283
  background-color: var(--pf-v5-c-table__tbody--after__tr--BorderLeftColor);
276
284
  }
@@ -285,9 +293,9 @@
285
293
  .pf-m-grid.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected::after {
286
294
  content: "";
287
295
  position: absolute;
288
- top: 0;
289
- bottom: 0;
290
- left: 0;
296
+ inset-block-start: 0;
297
+ inset-block-end: 0;
298
+ inset-inline-start: 0;
291
299
  width: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftWidth);
292
300
  background-color: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftColor);
293
301
  }
@@ -302,7 +310,7 @@
302
310
  grid-row-start: 20;
303
311
  grid-column: -1;
304
312
  justify-self: end;
305
- padding-right: 0;
313
+ padding-inline-end: 0;
306
314
  }
307
315
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__toggle::after {
308
316
  content: none;
@@ -320,33 +328,38 @@
320
328
  grid-column-start: 2;
321
329
  }
322
330
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__check {
323
- margin-top: var(--pf-v5-c-table__check--responsive--MarginTop);
324
- margin-left: var(--pf-v5-c-table__check--responsive--MarginLeft);
331
+ margin-block-start: var(--pf-v5-c-table__check--responsive--MarginTop);
332
+ margin-inline-start: var(--pf-v5-c-table__check--responsive--MarginLeft);
333
+ line-height: 1;
325
334
  }
326
335
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite {
327
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
336
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
328
337
  }
329
338
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
330
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
339
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
331
340
  }
332
341
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__action {
333
- margin-left: var(--pf-v5-c-table__action--responsive--MarginLeft);
342
+ margin-inline-start: var(--pf-v5-c-table__action--responsive--MarginLeft);
343
+ }
344
+ .pf-m-grid.pf-v5-c-table .pf-v5-c-table__check label {
345
+ display: inline-block;
346
+ margin: 0;
334
347
  }
335
348
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__favorite {
336
- margin-top: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
349
+ margin-block-start: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
337
350
  }
338
351
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
339
- margin-left: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
352
+ margin-inline-start: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
340
353
  }
341
354
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__action {
342
- margin-top: var(--pf-v5-c-table--m-grid__action--MarginTop);
343
- text-align: right;
355
+ margin-block-start: var(--pf-v5-c-table--m-grid__action--MarginTop);
356
+ text-align: end;
344
357
  }
345
358
  @media screen and (max-width: 576px) {
346
359
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__action {
347
360
  grid-row-start: 1;
348
361
  grid-column-start: 2;
349
- margin-left: 0;
362
+ margin-inline-start: 0;
350
363
  }
351
364
  }
352
365
  .pf-m-grid.pf-v5-c-table .pf-v5-c-table__inline-edit-action {
@@ -410,26 +423,26 @@
410
423
  display: block;
411
424
  }
412
425
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):first-of-type {
413
- border-top: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
426
+ border-block-start: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
414
427
  }
415
428
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table.pf-m-compact > tbody:where(.pf-v5-c-table__tbody) {
416
- border-top: 0;
429
+ border-block-start: 0;
417
430
  }
418
431
  .pf-m-grid-md.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
419
- border-bottom: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
432
+ border-block-end: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
420
433
  }
421
434
  .pf-m-grid-md.pf-v5-c-table tr:where(.pf-v5-c-table__tr):last-child,
422
435
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):last-of-type:not(:only-of-type) > tr:where(.pf-v5-c-table__tr) {
423
- border-bottom-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
436
+ border-block-end-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
424
437
  }
425
438
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
426
- border-bottom: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
439
+ border-block-end: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
427
440
  }
428
441
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
429
- border-bottom: 0;
442
+ border-block-end: 0;
430
443
  }
431
444
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded:not(:last-of-type) {
432
- border-bottom: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
445
+ border-block-end: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
433
446
  }
434
447
  .pf-m-grid-md.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected {
435
448
  --pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
@@ -441,10 +454,16 @@
441
454
  height: auto;
442
455
  grid-auto-columns: max-content;
443
456
  grid-column-gap: var(--pf-v5-c-table__tr--responsive--GridColumnGap);
444
- padding: var(--pf-v5-c-table__tr--responsive--PaddingTop) var(--pf-v5-c-table__tr--responsive--PaddingRight) var(--pf-v5-c-table__tr--responsive--PaddingBottom) var(--pf-v5-c-table__tr--responsive--PaddingLeft);
457
+ padding-block-start: var(--pf-v5-c-table__tr--responsive--PaddingTop);
458
+ padding-inline-end: var(--pf-v5-c-table__tr--responsive--PaddingRight);
459
+ padding-block-end: var(--pf-v5-c-table__tr--responsive--PaddingBottom);
460
+ padding-inline-start: var(--pf-v5-c-table__tr--responsive--PaddingLeft);
445
461
  }
446
462
  .pf-m-grid-md.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > * {
447
- padding: var(--pf-v5-c-table--cell--responsive--PaddingTop) var(--pf-v5-c-table--cell--responsive--PaddingRight) var(--pf-v5-c-table--cell--responsive--PaddingBottom) var(--pf-v5-c-table--cell--responsive--PaddingLeft);
463
+ padding-block-start: var(--pf-v5-c-table--cell--responsive--PaddingTop);
464
+ padding-inline-end: var(--pf-v5-c-table--cell--responsive--PaddingRight);
465
+ padding-block-end: var(--pf-v5-c-table--cell--responsive--PaddingBottom);
466
+ padding-inline-start: var(--pf-v5-c-table--cell--responsive--PaddingLeft);
448
467
  }
449
468
  .pf-m-grid-md.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > *:first-child {
450
469
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--cell--first-child--responsive--PaddingTop);
@@ -454,17 +473,18 @@
454
473
  --pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr--responsive--PaddingBottom);
455
474
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop);
456
475
  --pf-v5-c-table--cell--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingBottom);
476
+ --pf-v5-c-table__check--responsive--MarginTop: var(--pf-v5-c-table--m-compact__check--responsive--MarginTop);
457
477
  --pf-v5-c-table__check--input--MarginTop: 0;
458
478
  }
459
479
  .pf-m-grid-md.pf-v5-c-table.pf-m-compact .pf-v5-c-table__action {
460
- margin-top: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
461
- margin-bottom: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
480
+ margin-block-start: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
481
+ margin-block-end: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
462
482
  }
463
483
  .pf-m-grid-md.pf-v5-c-table.pf-m-compact .pf-v5-c-table__toggle .pf-v5-c-button {
464
- margin-bottom: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
484
+ margin-block-end: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
465
485
  }
466
486
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__icon > * {
467
- text-align: left;
487
+ text-align: start;
468
488
  }
469
489
  .pf-m-grid-md.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label] {
470
490
  --pf-v5-c-table--cell--hidden-visible--Display: var(--pf-v5-c-table--m-grid--cell--hidden-visible--Display);
@@ -478,7 +498,7 @@
478
498
  }
479
499
  .pf-m-grid-md.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label]::before {
480
500
  font-weight: bold;
481
- text-align: left;
501
+ text-align: start;
482
502
  content: attr(data-label);
483
503
  }
484
504
  .pf-m-grid-md.pf-v5-c-table tr:where(.pf-v5-c-table__tr) > *:first-child {
@@ -507,12 +527,12 @@
507
527
  }
508
528
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody)::after {
509
529
  position: absolute;
510
- top: 0;
511
- bottom: 0;
512
- left: 0;
530
+ inset-block-start: 0;
531
+ inset-block-end: 0;
532
+ inset-inline-start: 0;
513
533
  content: "";
514
534
  border: 0;
515
- border-left: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
535
+ border-inline-start: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
516
536
  }
517
537
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
518
538
  --pf-v5-c-table__tbody--after--BorderLeftWidth: var(--pf-v5-c-table__tbody--after--border-width--base);
@@ -536,7 +556,7 @@
536
556
  display: block;
537
557
  max-height: var(--pf-v5-c-table__expandable-row--MaxHeight);
538
558
  overflow-y: auto;
539
- border-bottom: none;
559
+ border-block-end: none;
540
560
  box-shadow: none;
541
561
  }
542
562
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__expandable-row > * {
@@ -544,7 +564,7 @@
544
564
  display: block;
545
565
  }
546
566
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__expandable-row.pf-m-expanded {
547
- border-top-color: var(--pf-v5-c-table--BorderColor);
567
+ border-block-start-color: var(--pf-v5-c-table--BorderColor);
548
568
  }
549
569
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__expandable-row > :first-child:not(.pf-v5-c-table__check)::after {
550
570
  content: none;
@@ -557,8 +577,8 @@
557
577
  display: none;
558
578
  }
559
579
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__expandable-row .pf-v5-c-table__expandable-row-content {
560
- padding-right: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
561
- padding-left: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
580
+ padding-inline-end: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
581
+ padding-inline-start: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
562
582
  }
563
583
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable {
564
584
  --pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
@@ -571,9 +591,9 @@
571
591
  .pf-m-grid-md.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable > tr:where(.pf-v5-c-table__tr)::after {
572
592
  content: "";
573
593
  position: absolute;
574
- top: 0;
575
- bottom: 0;
576
- left: 0;
594
+ inset-block-start: 0;
595
+ inset-block-end: 0;
596
+ inset-inline-start: 0;
577
597
  width: var(--pf-v5-c-table__tbody--after__tr--BorderLeftWidth);
578
598
  background-color: var(--pf-v5-c-table__tbody--after__tr--BorderLeftColor);
579
599
  }
@@ -588,9 +608,9 @@
588
608
  .pf-m-grid-md.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected::after {
589
609
  content: "";
590
610
  position: absolute;
591
- top: 0;
592
- bottom: 0;
593
- left: 0;
611
+ inset-block-start: 0;
612
+ inset-block-end: 0;
613
+ inset-inline-start: 0;
594
614
  width: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftWidth);
595
615
  background-color: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftColor);
596
616
  }
@@ -605,7 +625,7 @@
605
625
  grid-row-start: 20;
606
626
  grid-column: -1;
607
627
  justify-self: end;
608
- padding-right: 0;
628
+ padding-inline-end: 0;
609
629
  }
610
630
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__toggle::after {
611
631
  content: none;
@@ -623,34 +643,39 @@
623
643
  grid-column-start: 2;
624
644
  }
625
645
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__check {
626
- margin-top: var(--pf-v5-c-table__check--responsive--MarginTop);
627
- margin-left: var(--pf-v5-c-table__check--responsive--MarginLeft);
646
+ margin-block-start: var(--pf-v5-c-table__check--responsive--MarginTop);
647
+ margin-inline-start: var(--pf-v5-c-table__check--responsive--MarginLeft);
648
+ line-height: 1;
628
649
  }
629
650
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite {
630
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
651
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
631
652
  }
632
653
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
633
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
654
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
634
655
  }
635
656
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__action {
636
- margin-left: var(--pf-v5-c-table__action--responsive--MarginLeft);
657
+ margin-inline-start: var(--pf-v5-c-table__action--responsive--MarginLeft);
658
+ }
659
+ .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__check label {
660
+ display: inline-block;
661
+ margin: 0;
637
662
  }
638
663
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__favorite {
639
- margin-top: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
664
+ margin-block-start: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
640
665
  }
641
666
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
642
- margin-left: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
667
+ margin-inline-start: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
643
668
  }
644
669
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__action {
645
- margin-top: var(--pf-v5-c-table--m-grid__action--MarginTop);
646
- text-align: right;
670
+ margin-block-start: var(--pf-v5-c-table--m-grid__action--MarginTop);
671
+ text-align: end;
647
672
  }
648
673
  }
649
674
  @media screen and (max-width: 768px) and (max-width: 576px) {
650
675
  .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__action {
651
676
  grid-row-start: 1;
652
677
  grid-column-start: 2;
653
- margin-left: 0;
678
+ margin-inline-start: 0;
654
679
  }
655
680
  }
656
681
  @media screen and (max-width: 768px) {
@@ -716,26 +741,26 @@
716
741
  display: block;
717
742
  }
718
743
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):first-of-type {
719
- border-top: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
744
+ border-block-start: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
720
745
  }
721
746
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table.pf-m-compact > tbody:where(.pf-v5-c-table__tbody) {
722
- border-top: 0;
747
+ border-block-start: 0;
723
748
  }
724
749
  .pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
725
- border-bottom: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
750
+ border-block-end: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
726
751
  }
727
752
  .pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr):last-child,
728
753
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):last-of-type:not(:only-of-type) > tr:where(.pf-v5-c-table__tr) {
729
- border-bottom-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
754
+ border-block-end-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
730
755
  }
731
756
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
732
- border-bottom: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
757
+ border-block-end: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
733
758
  }
734
759
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
735
- border-bottom: 0;
760
+ border-block-end: 0;
736
761
  }
737
762
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded:not(:last-of-type) {
738
- border-bottom: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
763
+ border-block-end: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
739
764
  }
740
765
  .pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected {
741
766
  --pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
@@ -747,10 +772,16 @@
747
772
  height: auto;
748
773
  grid-auto-columns: max-content;
749
774
  grid-column-gap: var(--pf-v5-c-table__tr--responsive--GridColumnGap);
750
- padding: var(--pf-v5-c-table__tr--responsive--PaddingTop) var(--pf-v5-c-table__tr--responsive--PaddingRight) var(--pf-v5-c-table__tr--responsive--PaddingBottom) var(--pf-v5-c-table__tr--responsive--PaddingLeft);
775
+ padding-block-start: var(--pf-v5-c-table__tr--responsive--PaddingTop);
776
+ padding-inline-end: var(--pf-v5-c-table__tr--responsive--PaddingRight);
777
+ padding-block-end: var(--pf-v5-c-table__tr--responsive--PaddingBottom);
778
+ padding-inline-start: var(--pf-v5-c-table__tr--responsive--PaddingLeft);
751
779
  }
752
780
  .pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > * {
753
- padding: var(--pf-v5-c-table--cell--responsive--PaddingTop) var(--pf-v5-c-table--cell--responsive--PaddingRight) var(--pf-v5-c-table--cell--responsive--PaddingBottom) var(--pf-v5-c-table--cell--responsive--PaddingLeft);
781
+ padding-block-start: var(--pf-v5-c-table--cell--responsive--PaddingTop);
782
+ padding-inline-end: var(--pf-v5-c-table--cell--responsive--PaddingRight);
783
+ padding-block-end: var(--pf-v5-c-table--cell--responsive--PaddingBottom);
784
+ padding-inline-start: var(--pf-v5-c-table--cell--responsive--PaddingLeft);
754
785
  }
755
786
  .pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > *:first-child {
756
787
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--cell--first-child--responsive--PaddingTop);
@@ -760,17 +791,18 @@
760
791
  --pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr--responsive--PaddingBottom);
761
792
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop);
762
793
  --pf-v5-c-table--cell--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingBottom);
794
+ --pf-v5-c-table__check--responsive--MarginTop: var(--pf-v5-c-table--m-compact__check--responsive--MarginTop);
763
795
  --pf-v5-c-table__check--input--MarginTop: 0;
764
796
  }
765
797
  .pf-m-grid-lg.pf-v5-c-table.pf-m-compact .pf-v5-c-table__action {
766
- margin-top: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
767
- margin-bottom: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
798
+ margin-block-start: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
799
+ margin-block-end: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
768
800
  }
769
801
  .pf-m-grid-lg.pf-v5-c-table.pf-m-compact .pf-v5-c-table__toggle .pf-v5-c-button {
770
- margin-bottom: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
802
+ margin-block-end: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
771
803
  }
772
804
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__icon > * {
773
- text-align: left;
805
+ text-align: start;
774
806
  }
775
807
  .pf-m-grid-lg.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label] {
776
808
  --pf-v5-c-table--cell--hidden-visible--Display: var(--pf-v5-c-table--m-grid--cell--hidden-visible--Display);
@@ -784,7 +816,7 @@
784
816
  }
785
817
  .pf-m-grid-lg.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label]::before {
786
818
  font-weight: bold;
787
- text-align: left;
819
+ text-align: start;
788
820
  content: attr(data-label);
789
821
  }
790
822
  .pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr) > *:first-child {
@@ -813,12 +845,12 @@
813
845
  }
814
846
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody)::after {
815
847
  position: absolute;
816
- top: 0;
817
- bottom: 0;
818
- left: 0;
848
+ inset-block-start: 0;
849
+ inset-block-end: 0;
850
+ inset-inline-start: 0;
819
851
  content: "";
820
852
  border: 0;
821
- border-left: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
853
+ border-inline-start: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
822
854
  }
823
855
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
824
856
  --pf-v5-c-table__tbody--after--BorderLeftWidth: var(--pf-v5-c-table__tbody--after--border-width--base);
@@ -842,7 +874,7 @@
842
874
  display: block;
843
875
  max-height: var(--pf-v5-c-table__expandable-row--MaxHeight);
844
876
  overflow-y: auto;
845
- border-bottom: none;
877
+ border-block-end: none;
846
878
  box-shadow: none;
847
879
  }
848
880
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__expandable-row > * {
@@ -850,7 +882,7 @@
850
882
  display: block;
851
883
  }
852
884
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__expandable-row.pf-m-expanded {
853
- border-top-color: var(--pf-v5-c-table--BorderColor);
885
+ border-block-start-color: var(--pf-v5-c-table--BorderColor);
854
886
  }
855
887
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__expandable-row > :first-child:not(.pf-v5-c-table__check)::after {
856
888
  content: none;
@@ -863,8 +895,8 @@
863
895
  display: none;
864
896
  }
865
897
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__expandable-row .pf-v5-c-table__expandable-row-content {
866
- padding-right: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
867
- padding-left: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
898
+ padding-inline-end: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
899
+ padding-inline-start: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
868
900
  }
869
901
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable {
870
902
  --pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
@@ -877,9 +909,9 @@
877
909
  .pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable > tr:where(.pf-v5-c-table__tr)::after {
878
910
  content: "";
879
911
  position: absolute;
880
- top: 0;
881
- bottom: 0;
882
- left: 0;
912
+ inset-block-start: 0;
913
+ inset-block-end: 0;
914
+ inset-inline-start: 0;
883
915
  width: var(--pf-v5-c-table__tbody--after__tr--BorderLeftWidth);
884
916
  background-color: var(--pf-v5-c-table__tbody--after__tr--BorderLeftColor);
885
917
  }
@@ -894,9 +926,9 @@
894
926
  .pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected::after {
895
927
  content: "";
896
928
  position: absolute;
897
- top: 0;
898
- bottom: 0;
899
- left: 0;
929
+ inset-block-start: 0;
930
+ inset-block-end: 0;
931
+ inset-inline-start: 0;
900
932
  width: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftWidth);
901
933
  background-color: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftColor);
902
934
  }
@@ -911,7 +943,7 @@
911
943
  grid-row-start: 20;
912
944
  grid-column: -1;
913
945
  justify-self: end;
914
- padding-right: 0;
946
+ padding-inline-end: 0;
915
947
  }
916
948
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__toggle::after {
917
949
  content: none;
@@ -929,34 +961,39 @@
929
961
  grid-column-start: 2;
930
962
  }
931
963
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check {
932
- margin-top: var(--pf-v5-c-table__check--responsive--MarginTop);
933
- margin-left: var(--pf-v5-c-table__check--responsive--MarginLeft);
964
+ margin-block-start: var(--pf-v5-c-table__check--responsive--MarginTop);
965
+ margin-inline-start: var(--pf-v5-c-table__check--responsive--MarginLeft);
966
+ line-height: 1;
934
967
  }
935
968
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite {
936
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
969
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
937
970
  }
938
971
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
939
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
972
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
940
973
  }
941
974
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__action {
942
- margin-left: var(--pf-v5-c-table__action--responsive--MarginLeft);
975
+ margin-inline-start: var(--pf-v5-c-table__action--responsive--MarginLeft);
976
+ }
977
+ .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check label {
978
+ display: inline-block;
979
+ margin: 0;
943
980
  }
944
981
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__favorite {
945
- margin-top: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
982
+ margin-block-start: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
946
983
  }
947
984
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
948
- margin-left: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
985
+ margin-inline-start: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
949
986
  }
950
987
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__action {
951
- margin-top: var(--pf-v5-c-table--m-grid__action--MarginTop);
952
- text-align: right;
988
+ margin-block-start: var(--pf-v5-c-table--m-grid__action--MarginTop);
989
+ text-align: end;
953
990
  }
954
991
  }
955
992
  @media screen and (max-width: 992px) and (max-width: 576px) {
956
993
  .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__action {
957
994
  grid-row-start: 1;
958
995
  grid-column-start: 2;
959
- margin-left: 0;
996
+ margin-inline-start: 0;
960
997
  }
961
998
  }
962
999
  @media screen and (max-width: 992px) {
@@ -1022,26 +1059,26 @@
1022
1059
  display: block;
1023
1060
  }
1024
1061
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):first-of-type {
1025
- border-top: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1062
+ border-block-start: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1026
1063
  }
1027
1064
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table.pf-m-compact > tbody:where(.pf-v5-c-table__tbody) {
1028
- border-top: 0;
1065
+ border-block-start: 0;
1029
1066
  }
1030
1067
  .pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
1031
- border-bottom: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1068
+ border-block-end: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1032
1069
  }
1033
1070
  .pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):last-child,
1034
1071
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):last-of-type:not(:only-of-type) > tr:where(.pf-v5-c-table__tr) {
1035
- border-bottom-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
1072
+ border-block-end-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
1036
1073
  }
1037
1074
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
1038
- border-bottom: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
1075
+ border-block-end: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
1039
1076
  }
1040
1077
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
1041
- border-bottom: 0;
1078
+ border-block-end: 0;
1042
1079
  }
1043
1080
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded:not(:last-of-type) {
1044
- border-bottom: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1081
+ border-block-end: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1045
1082
  }
1046
1083
  .pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected {
1047
1084
  --pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
@@ -1053,10 +1090,16 @@
1053
1090
  height: auto;
1054
1091
  grid-auto-columns: max-content;
1055
1092
  grid-column-gap: var(--pf-v5-c-table__tr--responsive--GridColumnGap);
1056
- padding: var(--pf-v5-c-table__tr--responsive--PaddingTop) var(--pf-v5-c-table__tr--responsive--PaddingRight) var(--pf-v5-c-table__tr--responsive--PaddingBottom) var(--pf-v5-c-table__tr--responsive--PaddingLeft);
1093
+ padding-block-start: var(--pf-v5-c-table__tr--responsive--PaddingTop);
1094
+ padding-inline-end: var(--pf-v5-c-table__tr--responsive--PaddingRight);
1095
+ padding-block-end: var(--pf-v5-c-table__tr--responsive--PaddingBottom);
1096
+ padding-inline-start: var(--pf-v5-c-table__tr--responsive--PaddingLeft);
1057
1097
  }
1058
1098
  .pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > * {
1059
- padding: var(--pf-v5-c-table--cell--responsive--PaddingTop) var(--pf-v5-c-table--cell--responsive--PaddingRight) var(--pf-v5-c-table--cell--responsive--PaddingBottom) var(--pf-v5-c-table--cell--responsive--PaddingLeft);
1099
+ padding-block-start: var(--pf-v5-c-table--cell--responsive--PaddingTop);
1100
+ padding-inline-end: var(--pf-v5-c-table--cell--responsive--PaddingRight);
1101
+ padding-block-end: var(--pf-v5-c-table--cell--responsive--PaddingBottom);
1102
+ padding-inline-start: var(--pf-v5-c-table--cell--responsive--PaddingLeft);
1060
1103
  }
1061
1104
  .pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > *:first-child {
1062
1105
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--cell--first-child--responsive--PaddingTop);
@@ -1066,17 +1109,18 @@
1066
1109
  --pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr--responsive--PaddingBottom);
1067
1110
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop);
1068
1111
  --pf-v5-c-table--cell--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingBottom);
1112
+ --pf-v5-c-table__check--responsive--MarginTop: var(--pf-v5-c-table--m-compact__check--responsive--MarginTop);
1069
1113
  --pf-v5-c-table__check--input--MarginTop: 0;
1070
1114
  }
1071
1115
  .pf-m-grid-xl.pf-v5-c-table.pf-m-compact .pf-v5-c-table__action {
1072
- margin-top: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
1073
- margin-bottom: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
1116
+ margin-block-start: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
1117
+ margin-block-end: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
1074
1118
  }
1075
1119
  .pf-m-grid-xl.pf-v5-c-table.pf-m-compact .pf-v5-c-table__toggle .pf-v5-c-button {
1076
- margin-bottom: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
1120
+ margin-block-end: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
1077
1121
  }
1078
1122
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__icon > * {
1079
- text-align: left;
1123
+ text-align: start;
1080
1124
  }
1081
1125
  .pf-m-grid-xl.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label] {
1082
1126
  --pf-v5-c-table--cell--hidden-visible--Display: var(--pf-v5-c-table--m-grid--cell--hidden-visible--Display);
@@ -1090,7 +1134,7 @@
1090
1134
  }
1091
1135
  .pf-m-grid-xl.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label]::before {
1092
1136
  font-weight: bold;
1093
- text-align: left;
1137
+ text-align: start;
1094
1138
  content: attr(data-label);
1095
1139
  }
1096
1140
  .pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr) > *:first-child {
@@ -1119,12 +1163,12 @@
1119
1163
  }
1120
1164
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody)::after {
1121
1165
  position: absolute;
1122
- top: 0;
1123
- bottom: 0;
1124
- left: 0;
1166
+ inset-block-start: 0;
1167
+ inset-block-end: 0;
1168
+ inset-inline-start: 0;
1125
1169
  content: "";
1126
1170
  border: 0;
1127
- border-left: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
1171
+ border-inline-start: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
1128
1172
  }
1129
1173
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
1130
1174
  --pf-v5-c-table__tbody--after--BorderLeftWidth: var(--pf-v5-c-table__tbody--after--border-width--base);
@@ -1148,7 +1192,7 @@
1148
1192
  display: block;
1149
1193
  max-height: var(--pf-v5-c-table__expandable-row--MaxHeight);
1150
1194
  overflow-y: auto;
1151
- border-bottom: none;
1195
+ border-block-end: none;
1152
1196
  box-shadow: none;
1153
1197
  }
1154
1198
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__expandable-row > * {
@@ -1156,7 +1200,7 @@
1156
1200
  display: block;
1157
1201
  }
1158
1202
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__expandable-row.pf-m-expanded {
1159
- border-top-color: var(--pf-v5-c-table--BorderColor);
1203
+ border-block-start-color: var(--pf-v5-c-table--BorderColor);
1160
1204
  }
1161
1205
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__expandable-row > :first-child:not(.pf-v5-c-table__check)::after {
1162
1206
  content: none;
@@ -1169,8 +1213,8 @@
1169
1213
  display: none;
1170
1214
  }
1171
1215
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__expandable-row .pf-v5-c-table__expandable-row-content {
1172
- padding-right: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
1173
- padding-left: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
1216
+ padding-inline-end: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
1217
+ padding-inline-start: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
1174
1218
  }
1175
1219
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable {
1176
1220
  --pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
@@ -1183,9 +1227,9 @@
1183
1227
  .pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable > tr:where(.pf-v5-c-table__tr)::after {
1184
1228
  content: "";
1185
1229
  position: absolute;
1186
- top: 0;
1187
- bottom: 0;
1188
- left: 0;
1230
+ inset-block-start: 0;
1231
+ inset-block-end: 0;
1232
+ inset-inline-start: 0;
1189
1233
  width: var(--pf-v5-c-table__tbody--after__tr--BorderLeftWidth);
1190
1234
  background-color: var(--pf-v5-c-table__tbody--after__tr--BorderLeftColor);
1191
1235
  }
@@ -1200,9 +1244,9 @@
1200
1244
  .pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected::after {
1201
1245
  content: "";
1202
1246
  position: absolute;
1203
- top: 0;
1204
- bottom: 0;
1205
- left: 0;
1247
+ inset-block-start: 0;
1248
+ inset-block-end: 0;
1249
+ inset-inline-start: 0;
1206
1250
  width: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftWidth);
1207
1251
  background-color: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftColor);
1208
1252
  }
@@ -1217,7 +1261,7 @@
1217
1261
  grid-row-start: 20;
1218
1262
  grid-column: -1;
1219
1263
  justify-self: end;
1220
- padding-right: 0;
1264
+ padding-inline-end: 0;
1221
1265
  }
1222
1266
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__toggle::after {
1223
1267
  content: none;
@@ -1235,34 +1279,39 @@
1235
1279
  grid-column-start: 2;
1236
1280
  }
1237
1281
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check {
1238
- margin-top: var(--pf-v5-c-table__check--responsive--MarginTop);
1239
- margin-left: var(--pf-v5-c-table__check--responsive--MarginLeft);
1282
+ margin-block-start: var(--pf-v5-c-table__check--responsive--MarginTop);
1283
+ margin-inline-start: var(--pf-v5-c-table__check--responsive--MarginLeft);
1284
+ line-height: 1;
1240
1285
  }
1241
1286
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite {
1242
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
1287
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
1243
1288
  }
1244
1289
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
1245
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
1290
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
1246
1291
  }
1247
1292
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__action {
1248
- margin-left: var(--pf-v5-c-table__action--responsive--MarginLeft);
1293
+ margin-inline-start: var(--pf-v5-c-table__action--responsive--MarginLeft);
1294
+ }
1295
+ .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check label {
1296
+ display: inline-block;
1297
+ margin: 0;
1249
1298
  }
1250
1299
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__favorite {
1251
- margin-top: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
1300
+ margin-block-start: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
1252
1301
  }
1253
1302
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
1254
- margin-left: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
1303
+ margin-inline-start: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
1255
1304
  }
1256
1305
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__action {
1257
- margin-top: var(--pf-v5-c-table--m-grid__action--MarginTop);
1258
- text-align: right;
1306
+ margin-block-start: var(--pf-v5-c-table--m-grid__action--MarginTop);
1307
+ text-align: end;
1259
1308
  }
1260
1309
  }
1261
1310
  @media screen and (max-width: 1200px) and (max-width: 576px) {
1262
1311
  .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__action {
1263
1312
  grid-row-start: 1;
1264
1313
  grid-column-start: 2;
1265
- margin-left: 0;
1314
+ margin-inline-start: 0;
1266
1315
  }
1267
1316
  }
1268
1317
  @media screen and (max-width: 1200px) {
@@ -1328,26 +1377,26 @@
1328
1377
  display: block;
1329
1378
  }
1330
1379
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):first-of-type {
1331
- border-top: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1380
+ border-block-start: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1332
1381
  }
1333
1382
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table.pf-m-compact > tbody:where(.pf-v5-c-table__tbody) {
1334
- border-top: 0;
1383
+ border-block-start: 0;
1335
1384
  }
1336
1385
  .pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
1337
- border-bottom: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1386
+ border-block-end: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1338
1387
  }
1339
1388
  .pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):last-child,
1340
1389
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):last-of-type:not(:only-of-type) > tr:where(.pf-v5-c-table__tr) {
1341
- border-bottom-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
1390
+ border-block-end-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
1342
1391
  }
1343
1392
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
1344
- border-bottom: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
1393
+ border-block-end: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
1345
1394
  }
1346
1395
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
1347
- border-bottom: 0;
1396
+ border-block-end: 0;
1348
1397
  }
1349
1398
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded:not(:last-of-type) {
1350
- border-bottom: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1399
+ border-block-end: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
1351
1400
  }
1352
1401
  .pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected {
1353
1402
  --pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
@@ -1359,10 +1408,16 @@
1359
1408
  height: auto;
1360
1409
  grid-auto-columns: max-content;
1361
1410
  grid-column-gap: var(--pf-v5-c-table__tr--responsive--GridColumnGap);
1362
- padding: var(--pf-v5-c-table__tr--responsive--PaddingTop) var(--pf-v5-c-table__tr--responsive--PaddingRight) var(--pf-v5-c-table__tr--responsive--PaddingBottom) var(--pf-v5-c-table__tr--responsive--PaddingLeft);
1411
+ padding-block-start: var(--pf-v5-c-table__tr--responsive--PaddingTop);
1412
+ padding-inline-end: var(--pf-v5-c-table__tr--responsive--PaddingRight);
1413
+ padding-block-end: var(--pf-v5-c-table__tr--responsive--PaddingBottom);
1414
+ padding-inline-start: var(--pf-v5-c-table__tr--responsive--PaddingLeft);
1363
1415
  }
1364
1416
  .pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > * {
1365
- padding: var(--pf-v5-c-table--cell--responsive--PaddingTop) var(--pf-v5-c-table--cell--responsive--PaddingRight) var(--pf-v5-c-table--cell--responsive--PaddingBottom) var(--pf-v5-c-table--cell--responsive--PaddingLeft);
1417
+ padding-block-start: var(--pf-v5-c-table--cell--responsive--PaddingTop);
1418
+ padding-inline-end: var(--pf-v5-c-table--cell--responsive--PaddingRight);
1419
+ padding-block-end: var(--pf-v5-c-table--cell--responsive--PaddingBottom);
1420
+ padding-inline-start: var(--pf-v5-c-table--cell--responsive--PaddingLeft);
1366
1421
  }
1367
1422
  .pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > *:first-child {
1368
1423
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--cell--first-child--responsive--PaddingTop);
@@ -1372,17 +1427,18 @@
1372
1427
  --pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr--responsive--PaddingBottom);
1373
1428
  --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop);
1374
1429
  --pf-v5-c-table--cell--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingBottom);
1430
+ --pf-v5-c-table__check--responsive--MarginTop: var(--pf-v5-c-table--m-compact__check--responsive--MarginTop);
1375
1431
  --pf-v5-c-table__check--input--MarginTop: 0;
1376
1432
  }
1377
1433
  .pf-m-grid-2xl.pf-v5-c-table.pf-m-compact .pf-v5-c-table__action {
1378
- margin-top: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
1379
- margin-bottom: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
1434
+ margin-block-start: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
1435
+ margin-block-end: var(--pf-v5-c-table--m-compact__action--responsive--MarginTop);
1380
1436
  }
1381
1437
  .pf-m-grid-2xl.pf-v5-c-table.pf-m-compact .pf-v5-c-table__toggle .pf-v5-c-button {
1382
- margin-bottom: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
1438
+ margin-block-end: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
1383
1439
  }
1384
1440
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__icon > * {
1385
- text-align: left;
1441
+ text-align: start;
1386
1442
  }
1387
1443
  .pf-m-grid-2xl.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label] {
1388
1444
  --pf-v5-c-table--cell--hidden-visible--Display: var(--pf-v5-c-table--m-grid--cell--hidden-visible--Display);
@@ -1396,7 +1452,7 @@
1396
1452
  }
1397
1453
  .pf-m-grid-2xl.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label]::before {
1398
1454
  font-weight: bold;
1399
- text-align: left;
1455
+ text-align: start;
1400
1456
  content: attr(data-label);
1401
1457
  }
1402
1458
  .pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr) > *:first-child {
@@ -1425,12 +1481,12 @@
1425
1481
  }
1426
1482
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody)::after {
1427
1483
  position: absolute;
1428
- top: 0;
1429
- bottom: 0;
1430
- left: 0;
1484
+ inset-block-start: 0;
1485
+ inset-block-end: 0;
1486
+ inset-inline-start: 0;
1431
1487
  content: "";
1432
1488
  border: 0;
1433
- border-left: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
1489
+ border-inline-start: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
1434
1490
  }
1435
1491
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
1436
1492
  --pf-v5-c-table__tbody--after--BorderLeftWidth: var(--pf-v5-c-table__tbody--after--border-width--base);
@@ -1454,7 +1510,7 @@
1454
1510
  display: block;
1455
1511
  max-height: var(--pf-v5-c-table__expandable-row--MaxHeight);
1456
1512
  overflow-y: auto;
1457
- border-bottom: none;
1513
+ border-block-end: none;
1458
1514
  box-shadow: none;
1459
1515
  }
1460
1516
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__expandable-row > * {
@@ -1462,7 +1518,7 @@
1462
1518
  display: block;
1463
1519
  }
1464
1520
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__expandable-row.pf-m-expanded {
1465
- border-top-color: var(--pf-v5-c-table--BorderColor);
1521
+ border-block-start-color: var(--pf-v5-c-table--BorderColor);
1466
1522
  }
1467
1523
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__expandable-row > :first-child:not(.pf-v5-c-table__check)::after {
1468
1524
  content: none;
@@ -1475,8 +1531,8 @@
1475
1531
  display: none;
1476
1532
  }
1477
1533
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__expandable-row .pf-v5-c-table__expandable-row-content {
1478
- padding-right: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
1479
- padding-left: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
1534
+ padding-inline-end: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingRight);
1535
+ padding-inline-start: var(--pf-v5-c-table__expandable-row-content--responsive--PaddingLeft);
1480
1536
  }
1481
1537
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable {
1482
1538
  --pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
@@ -1489,9 +1545,9 @@
1489
1545
  .pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable > tr:where(.pf-v5-c-table__tr)::after {
1490
1546
  content: "";
1491
1547
  position: absolute;
1492
- top: 0;
1493
- bottom: 0;
1494
- left: 0;
1548
+ inset-block-start: 0;
1549
+ inset-block-end: 0;
1550
+ inset-inline-start: 0;
1495
1551
  width: var(--pf-v5-c-table__tbody--after__tr--BorderLeftWidth);
1496
1552
  background-color: var(--pf-v5-c-table__tbody--after__tr--BorderLeftColor);
1497
1553
  }
@@ -1506,9 +1562,9 @@
1506
1562
  .pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected::after {
1507
1563
  content: "";
1508
1564
  position: absolute;
1509
- top: 0;
1510
- bottom: 0;
1511
- left: 0;
1565
+ inset-block-start: 0;
1566
+ inset-block-end: 0;
1567
+ inset-inline-start: 0;
1512
1568
  width: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftWidth);
1513
1569
  background-color: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftColor);
1514
1570
  }
@@ -1523,7 +1579,7 @@
1523
1579
  grid-row-start: 20;
1524
1580
  grid-column: -1;
1525
1581
  justify-self: end;
1526
- padding-right: 0;
1582
+ padding-inline-end: 0;
1527
1583
  }
1528
1584
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__toggle::after {
1529
1585
  content: none;
@@ -1541,34 +1597,39 @@
1541
1597
  grid-column-start: 2;
1542
1598
  }
1543
1599
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check {
1544
- margin-top: var(--pf-v5-c-table__check--responsive--MarginTop);
1545
- margin-left: var(--pf-v5-c-table__check--responsive--MarginLeft);
1600
+ margin-block-start: var(--pf-v5-c-table__check--responsive--MarginTop);
1601
+ margin-inline-start: var(--pf-v5-c-table__check--responsive--MarginLeft);
1602
+ line-height: 1;
1546
1603
  }
1547
1604
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite {
1548
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
1605
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
1549
1606
  }
1550
1607
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
1551
- margin-left: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
1608
+ margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
1552
1609
  }
1553
1610
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__action {
1554
- margin-left: var(--pf-v5-c-table__action--responsive--MarginLeft);
1611
+ margin-inline-start: var(--pf-v5-c-table__action--responsive--MarginLeft);
1612
+ }
1613
+ .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check label {
1614
+ display: inline-block;
1615
+ margin: 0;
1555
1616
  }
1556
1617
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__favorite {
1557
- margin-top: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
1618
+ margin-block-start: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
1558
1619
  }
1559
1620
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
1560
- margin-left: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
1621
+ margin-inline-start: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
1561
1622
  }
1562
1623
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__action {
1563
- margin-top: var(--pf-v5-c-table--m-grid__action--MarginTop);
1564
- text-align: right;
1624
+ margin-block-start: var(--pf-v5-c-table--m-grid__action--MarginTop);
1625
+ text-align: end;
1565
1626
  }
1566
1627
  }
1567
1628
  @media screen and (max-width: 1450px) and (max-width: 576px) {
1568
1629
  .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__action {
1569
1630
  grid-row-start: 1;
1570
1631
  grid-column-start: 2;
1571
- margin-left: 0;
1632
+ margin-inline-start: 0;
1572
1633
  }
1573
1634
  }
1574
1635
  @media screen and (max-width: 1450px) {