@patternfly/react-styles 5.1.0 → 5.1.1-prerelease.2
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.
- package/CHANGELOG.md +8 -2
- package/css/components/AboutModalBox/about-modal-box.css +20 -13
- package/css/components/Accordion/accordion.css +33 -20
- package/css/components/Accordion/accordion.d.ts +3 -1
- package/css/components/Accordion/accordion.js +3 -1
- package/css/components/Accordion/accordion.mjs +3 -1
- package/css/components/ActionList/action-list.css +2 -2
- package/css/components/Alert/alert-group.css +7 -4
- package/css/components/Alert/alert.css +19 -13
- package/css/components/Alert/alert.d.ts +3 -1
- package/css/components/Alert/alert.js +3 -1
- package/css/components/Alert/alert.mjs +3 -1
- package/css/components/AppLauncher/app-launcher.css +32 -23
- package/css/components/BackToTop/back-to-top.css +2 -2
- package/css/components/Backdrop/backdrop.css +2 -2
- package/css/components/BackgroundImage/background-image.css +2 -2
- package/css/components/Badge/badge.css +2 -2
- package/css/components/Banner/banner.css +5 -2
- package/css/components/Breadcrumb/breadcrumb.css +9 -3
- package/css/components/Breadcrumb/breadcrumb.d.ts +3 -1
- package/css/components/Breadcrumb/breadcrumb.js +3 -1
- package/css/components/Breadcrumb/breadcrumb.mjs +3 -1
- package/css/components/Button/button.css +23 -17
- package/css/components/CalendarMonth/calendar-month.css +25 -15
- package/css/components/CalendarMonth/calendar-month.d.ts +3 -1
- package/css/components/CalendarMonth/calendar-month.js +3 -1
- package/css/components/CalendarMonth/calendar-month.mjs +3 -1
- package/css/components/Card/card.css +21 -16
- package/css/components/Check/check.css +2 -2
- package/css/components/Chip/chip-group.css +6 -6
- package/css/components/Chip/chip.css +16 -9
- package/css/components/Chip/chip.d.ts +1 -0
- package/css/components/Chip/chip.js +1 -0
- package/css/components/Chip/chip.mjs +1 -0
- package/css/components/ClipboardCopy/clipboard-copy.css +19 -10
- package/css/components/ClipboardCopy/clipboard-copy.d.ts +3 -1
- package/css/components/ClipboardCopy/clipboard-copy.js +3 -1
- package/css/components/ClipboardCopy/clipboard-copy.mjs +3 -1
- package/css/components/CodeBlock/code-block.css +6 -3
- package/css/components/CodeEditor/code-editor.css +31 -22
- package/css/components/Content/content.css +33 -30
- package/css/components/ContextSelector/context-selector.css +41 -26
- package/css/components/DataList/data-list-grid.css +21 -49
- package/css/components/DataList/data-list.css +66 -84
- package/css/components/DatePicker/date-picker.css +8 -8
- package/css/components/DescriptionList/description-list.css +8 -5
- package/css/components/DragDrop/drag-drop.css +8 -8
- package/css/components/Drawer/drawer.css +75 -60
- package/css/components/Dropdown/dropdown.css +75 -66
- package/css/components/DualListSelector/dual-list-selector.css +29 -15
- package/css/components/DualListSelector/dual-list-selector.d.ts +4 -1
- package/css/components/DualListSelector/dual-list-selector.js +4 -1
- package/css/components/DualListSelector/dual-list-selector.mjs +4 -1
- package/css/components/EmptyState/empty-state.css +7 -4
- package/css/components/ExpandableSection/expandable-section.css +17 -10
- package/css/components/ExpandableSection/expandable-section.d.ts +3 -1
- package/css/components/ExpandableSection/expandable-section.js +3 -1
- package/css/components/ExpandableSection/expandable-section.mjs +3 -1
- package/css/components/FileUpload/file-upload.css +9 -15
- package/css/components/Form/form.css +50 -50
- package/css/components/FormControl/form-control.css +21 -11
- package/css/components/HelperText/helper-text.css +1 -1
- package/css/components/Hint/hint.css +9 -6
- package/css/components/Icon/icon.css +1 -1
- package/css/components/InlineEdit/inline-edit.css +4 -4
- package/css/components/InputGroup/input-group.css +12 -6
- package/css/components/JumpLinks/jump-links.css +24 -24
- package/css/components/Label/label-group.css +13 -10
- package/css/components/Label/label.css +9 -9
- package/css/components/List/list.css +9 -9
- package/css/components/LogViewer/log-viewer.css +14 -14
- package/css/components/Login/login.css +36 -27
- package/css/components/Masthead/masthead.css +19 -22
- package/css/components/Menu/menu.css +80 -66
- package/css/components/Menu/menu.d.ts +3 -1
- package/css/components/Menu/menu.js +3 -1
- package/css/components/Menu/menu.mjs +3 -1
- package/css/components/MenuToggle/menu-toggle.css +41 -29
- package/css/components/ModalBox/modal-box.css +19 -19
- package/css/components/MultipleFileUpload/multiple-file-upload.css +11 -8
- package/css/components/Nav/nav.css +120 -93
- package/css/components/Nav/nav.d.ts +3 -1
- package/css/components/Nav/nav.js +3 -1
- package/css/components/Nav/nav.mjs +3 -1
- package/css/components/NotificationBadge/notification-badge.css +13 -7
- package/css/components/NotificationDrawer/notification-drawer.css +32 -19
- package/css/components/NotificationDrawer/notification-drawer.d.ts +3 -1
- package/css/components/NotificationDrawer/notification-drawer.js +3 -1
- package/css/components/NotificationDrawer/notification-drawer.mjs +3 -1
- package/css/components/NumberInput/number-input.css +3 -3
- package/css/components/OptionsMenu/options-menu.css +43 -31
- package/css/components/OverflowMenu/overflow-menu.css +2 -2
- package/css/components/Page/page.css +123 -65
- package/css/components/Page/page.d.ts +3 -1
- package/css/components/Page/page.js +3 -1
- package/css/components/Page/page.mjs +3 -1
- package/css/components/Pagination/pagination.css +28 -18
- package/css/components/Pagination/pagination.d.ts +3 -1
- package/css/components/Pagination/pagination.js +3 -1
- package/css/components/Pagination/pagination.mjs +3 -1
- package/css/components/Panel/panel.css +13 -7
- package/css/components/Popover/popover.css +24 -21
- package/css/components/Progress/progress.css +7 -7
- package/css/components/ProgressStepper/progress-stepper.css +26 -20
- package/css/components/Radio/radio.css +4 -5
- package/css/components/Select/select.css +56 -47
- package/css/components/Sidebar/sidebar.css +11 -5
- package/css/components/SimpleList/simple-list.css +10 -4
- package/css/components/Skeleton/skeleton.css +2 -5
- package/css/components/SkipToContent/skip-to-content.css +3 -3
- package/css/components/Slider/slider.css +46 -26
- package/css/components/Slider/slider.d.ts +3 -1
- package/css/components/Slider/slider.js +3 -1
- package/css/components/Slider/slider.mjs +3 -1
- package/css/components/Switch/switch.css +9 -5
- package/css/components/Switch/switch.d.ts +3 -1
- package/css/components/Switch/switch.js +3 -1
- package/css/components/Switch/switch.mjs +3 -1
- package/css/components/TabContent/tab-content.css +4 -1
- package/css/components/Table/table-grid.css +256 -219
- package/css/components/Table/table-scrollable.css +2 -2
- package/css/components/Table/table-tree-view.css +107 -104
- package/css/components/Table/table.css +87 -69
- package/css/components/Tabs/tabs.css +66 -48
- package/css/components/TextInputGroup/text-input-group.css +15 -15
- package/css/components/Tile/tile.css +10 -10
- package/css/components/ToggleGroup/toggle-group.css +14 -11
- package/css/components/Toolbar/toolbar.css +44 -41
- package/css/components/Tooltip/tooltip.css +19 -16
- package/css/components/TreeView/tree-view.css +42 -27
- package/css/components/Wizard/wizard.css +57 -36
- package/css/components/Wizard/wizard.d.ts +3 -1
- package/css/components/Wizard/wizard.js +3 -1
- package/css/components/Wizard/wizard.mjs +3 -1
- package/css/docs/components/Button/examples/Button.css +2 -2
- package/css/docs/components/DragDrop/examples/DragDrop.css +2 -2
- package/css/docs/components/Dropdown/deprecated/Dropdown.css +1 -1
- package/css/docs/components/LogViewer/examples/LogViewer.css +2 -2
- package/css/docs/components/ModalBox/examples/ModalBox.css +2 -2
- package/css/docs/components/Nav/examples/Navigation.css +3 -26
- package/css/docs/components/Nav/examples/Navigation.d.ts +1 -1
- package/css/docs/components/Nav/examples/Navigation.js +1 -1
- package/css/docs/components/Nav/examples/Navigation.mjs +1 -1
- package/css/docs/components/Popover/examples/Popover.css +2 -2
- package/css/docs/components/Select/deprecated/Select.css +3 -3
- package/css/docs/components/Table/examples/Table.css +2 -2
- package/css/docs/components/TextInputGroup/examples/TextInputGroup.css +1 -1
- package/css/docs/components/Tile/examples/Tile.css +1 -1
- package/css/docs/demos/Card/examples/Card.css +3 -3
- package/css/docs/utilities/BoxShadow/examples/box-shadow.css +5 -5
- package/css/layouts/Flex/flex.css +115 -43
- package/css/utilities/Accessibility/accessibility.css +12 -12
- package/css/utilities/Spacing/spacing.css +720 -960
- package/package.json +4 -8
@@ -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-
|
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-
|
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-
|
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-
|
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-
|
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-
|
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-
|
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)
|
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)
|
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-
|
158
|
-
margin-
|
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-
|
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:
|
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:
|
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
|
-
|
208
|
-
|
209
|
-
|
215
|
+
inset-block-start: 0;
|
216
|
+
inset-block-end: 0;
|
217
|
+
inset-inline-start: 0;
|
210
218
|
content: "";
|
211
219
|
border: 0;
|
212
|
-
border-
|
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-
|
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-
|
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-
|
258
|
-
padding-
|
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
|
-
|
272
|
-
|
273
|
-
|
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
|
-
|
289
|
-
|
290
|
-
|
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-
|
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-
|
324
|
-
margin-
|
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-
|
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-
|
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-
|
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-
|
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-
|
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-
|
343
|
-
text-align:
|
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-
|
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-
|
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-
|
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-
|
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-
|
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-
|
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-
|
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-
|
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)
|
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)
|
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-
|
461
|
-
margin-
|
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-
|
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:
|
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:
|
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
|
-
|
511
|
-
|
512
|
-
|
530
|
+
inset-block-start: 0;
|
531
|
+
inset-block-end: 0;
|
532
|
+
inset-inline-start: 0;
|
513
533
|
content: "";
|
514
534
|
border: 0;
|
515
|
-
border-
|
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-
|
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-
|
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-
|
561
|
-
padding-
|
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
|
-
|
575
|
-
|
576
|
-
|
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
|
-
|
592
|
-
|
593
|
-
|
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-
|
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-
|
627
|
-
margin-
|
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-
|
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-
|
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-
|
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-
|
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-
|
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-
|
646
|
-
text-align:
|
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-
|
678
|
+
margin-inline-start: 0;
|
654
679
|
}
|
655
680
|
}
|
656
681
|
@media screen and (max-width: 768px) {
|
@@ -658,16 +683,12 @@
|
|
658
683
|
grid-column: 2;
|
659
684
|
grid-row: 2;
|
660
685
|
}
|
661
|
-
}
|
662
|
-
@media screen and (max-width: 768px) {
|
663
686
|
.pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__toggle-icon {
|
664
687
|
transition: var(--pf-v5-c-table__toggle__icon--Transition);
|
665
688
|
}
|
666
689
|
.pf-v5-c-button.pf-m-expanded > .pf-m-grid-md.pf-v5-c-table .pf-v5-c-table__toggle-icon {
|
667
690
|
transform: rotate(var(--pf-v5-c-table__toggle--m-expanded__icon--Rotate));
|
668
691
|
}
|
669
|
-
}
|
670
|
-
@media screen and (max-width: 768px) {
|
671
692
|
.pf-m-grid-md.pf-v5-c-table :where(.pf-v5-c-table, .pf-v5-c-table__thead, .pf-v5-c-table__tbody, .pf-v5-c-table__tr, .pf-v5-c-table__th, .pf-v5-c-table__td, .pf-v5-c-table__text).pf-m-nowrap {
|
672
693
|
--pf-v5-c-table--cell--Overflow: auto;
|
673
694
|
}
|
@@ -678,8 +699,6 @@
|
|
678
699
|
.pf-m-grid-md.pf-v5-c-table :where(.pf-v5-c-table, .pf-v5-c-table__thead, .pf-v5-c-table__tbody, .pf-v5-c-table__tr, .pf-v5-c-table__th, .pf-v5-c-table__td, .pf-v5-c-table__text).pf-m-truncate {
|
679
700
|
--pf-v5-c-table--cell--MaxWidth: 100%;
|
680
701
|
}
|
681
|
-
}
|
682
|
-
@media screen and (max-width: 768px) {
|
683
702
|
.pf-m-grid-md.pf-v5-c-table [class*=pf-m-width] {
|
684
703
|
--pf-v5-c-table--cell--Width: auto;
|
685
704
|
}
|
@@ -722,26 +741,26 @@
|
|
722
741
|
display: block;
|
723
742
|
}
|
724
743
|
.pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):first-of-type {
|
725
|
-
border-
|
744
|
+
border-block-start: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
726
745
|
}
|
727
746
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table.pf-m-compact > tbody:where(.pf-v5-c-table__tbody) {
|
728
|
-
border-
|
747
|
+
border-block-start: 0;
|
729
748
|
}
|
730
749
|
.pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
|
731
|
-
border-
|
750
|
+
border-block-end: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
732
751
|
}
|
733
752
|
.pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr):last-child,
|
734
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) {
|
735
|
-
border-
|
754
|
+
border-block-end-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
|
736
755
|
}
|
737
756
|
.pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
|
738
|
-
border-
|
757
|
+
border-block-end: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
|
739
758
|
}
|
740
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) {
|
741
|
-
border-
|
760
|
+
border-block-end: 0;
|
742
761
|
}
|
743
762
|
.pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded:not(:last-of-type) {
|
744
|
-
border-
|
763
|
+
border-block-end: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
745
764
|
}
|
746
765
|
.pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected {
|
747
766
|
--pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
|
@@ -753,10 +772,16 @@
|
|
753
772
|
height: auto;
|
754
773
|
grid-auto-columns: max-content;
|
755
774
|
grid-column-gap: var(--pf-v5-c-table__tr--responsive--GridColumnGap);
|
756
|
-
padding: var(--pf-v5-c-table__tr--responsive--PaddingTop)
|
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);
|
757
779
|
}
|
758
780
|
.pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > * {
|
759
|
-
padding: var(--pf-v5-c-table--cell--responsive--PaddingTop)
|
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);
|
760
785
|
}
|
761
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 {
|
762
787
|
--pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--cell--first-child--responsive--PaddingTop);
|
@@ -766,17 +791,18 @@
|
|
766
791
|
--pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr--responsive--PaddingBottom);
|
767
792
|
--pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop);
|
768
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);
|
769
795
|
--pf-v5-c-table__check--input--MarginTop: 0;
|
770
796
|
}
|
771
797
|
.pf-m-grid-lg.pf-v5-c-table.pf-m-compact .pf-v5-c-table__action {
|
772
|
-
margin-
|
773
|
-
margin-
|
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);
|
774
800
|
}
|
775
801
|
.pf-m-grid-lg.pf-v5-c-table.pf-m-compact .pf-v5-c-table__toggle .pf-v5-c-button {
|
776
|
-
margin-
|
802
|
+
margin-block-end: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
|
777
803
|
}
|
778
804
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__icon > * {
|
779
|
-
text-align:
|
805
|
+
text-align: start;
|
780
806
|
}
|
781
807
|
.pf-m-grid-lg.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label] {
|
782
808
|
--pf-v5-c-table--cell--hidden-visible--Display: var(--pf-v5-c-table--m-grid--cell--hidden-visible--Display);
|
@@ -790,7 +816,7 @@
|
|
790
816
|
}
|
791
817
|
.pf-m-grid-lg.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label]::before {
|
792
818
|
font-weight: bold;
|
793
|
-
text-align:
|
819
|
+
text-align: start;
|
794
820
|
content: attr(data-label);
|
795
821
|
}
|
796
822
|
.pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr) > *:first-child {
|
@@ -819,12 +845,12 @@
|
|
819
845
|
}
|
820
846
|
.pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody)::after {
|
821
847
|
position: absolute;
|
822
|
-
|
823
|
-
|
824
|
-
|
848
|
+
inset-block-start: 0;
|
849
|
+
inset-block-end: 0;
|
850
|
+
inset-inline-start: 0;
|
825
851
|
content: "";
|
826
852
|
border: 0;
|
827
|
-
border-
|
853
|
+
border-inline-start: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
|
828
854
|
}
|
829
855
|
.pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
|
830
856
|
--pf-v5-c-table__tbody--after--BorderLeftWidth: var(--pf-v5-c-table__tbody--after--border-width--base);
|
@@ -848,7 +874,7 @@
|
|
848
874
|
display: block;
|
849
875
|
max-height: var(--pf-v5-c-table__expandable-row--MaxHeight);
|
850
876
|
overflow-y: auto;
|
851
|
-
border-
|
877
|
+
border-block-end: none;
|
852
878
|
box-shadow: none;
|
853
879
|
}
|
854
880
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__expandable-row > * {
|
@@ -856,7 +882,7 @@
|
|
856
882
|
display: block;
|
857
883
|
}
|
858
884
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__expandable-row.pf-m-expanded {
|
859
|
-
border-
|
885
|
+
border-block-start-color: var(--pf-v5-c-table--BorderColor);
|
860
886
|
}
|
861
887
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__expandable-row > :first-child:not(.pf-v5-c-table__check)::after {
|
862
888
|
content: none;
|
@@ -869,8 +895,8 @@
|
|
869
895
|
display: none;
|
870
896
|
}
|
871
897
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__expandable-row .pf-v5-c-table__expandable-row-content {
|
872
|
-
padding-
|
873
|
-
padding-
|
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);
|
874
900
|
}
|
875
901
|
.pf-m-grid-lg.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable {
|
876
902
|
--pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
|
@@ -883,9 +909,9 @@
|
|
883
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 {
|
884
910
|
content: "";
|
885
911
|
position: absolute;
|
886
|
-
|
887
|
-
|
888
|
-
|
912
|
+
inset-block-start: 0;
|
913
|
+
inset-block-end: 0;
|
914
|
+
inset-inline-start: 0;
|
889
915
|
width: var(--pf-v5-c-table__tbody--after__tr--BorderLeftWidth);
|
890
916
|
background-color: var(--pf-v5-c-table__tbody--after__tr--BorderLeftColor);
|
891
917
|
}
|
@@ -900,9 +926,9 @@
|
|
900
926
|
.pf-m-grid-lg.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected::after {
|
901
927
|
content: "";
|
902
928
|
position: absolute;
|
903
|
-
|
904
|
-
|
905
|
-
|
929
|
+
inset-block-start: 0;
|
930
|
+
inset-block-end: 0;
|
931
|
+
inset-inline-start: 0;
|
906
932
|
width: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftWidth);
|
907
933
|
background-color: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftColor);
|
908
934
|
}
|
@@ -917,7 +943,7 @@
|
|
917
943
|
grid-row-start: 20;
|
918
944
|
grid-column: -1;
|
919
945
|
justify-self: end;
|
920
|
-
padding-
|
946
|
+
padding-inline-end: 0;
|
921
947
|
}
|
922
948
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__toggle::after {
|
923
949
|
content: none;
|
@@ -935,34 +961,39 @@
|
|
935
961
|
grid-column-start: 2;
|
936
962
|
}
|
937
963
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check {
|
938
|
-
margin-
|
939
|
-
margin-
|
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;
|
940
967
|
}
|
941
968
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite {
|
942
|
-
margin-
|
969
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
|
943
970
|
}
|
944
971
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
|
945
|
-
margin-
|
972
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
|
946
973
|
}
|
947
974
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__action {
|
948
|
-
margin-
|
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;
|
949
980
|
}
|
950
981
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__favorite {
|
951
|
-
margin-
|
982
|
+
margin-block-start: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
|
952
983
|
}
|
953
984
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
|
954
|
-
margin-
|
985
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
|
955
986
|
}
|
956
987
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__action {
|
957
|
-
margin-
|
958
|
-
text-align:
|
988
|
+
margin-block-start: var(--pf-v5-c-table--m-grid__action--MarginTop);
|
989
|
+
text-align: end;
|
959
990
|
}
|
960
991
|
}
|
961
992
|
@media screen and (max-width: 992px) and (max-width: 576px) {
|
962
993
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__action {
|
963
994
|
grid-row-start: 1;
|
964
995
|
grid-column-start: 2;
|
965
|
-
margin-
|
996
|
+
margin-inline-start: 0;
|
966
997
|
}
|
967
998
|
}
|
968
999
|
@media screen and (max-width: 992px) {
|
@@ -970,16 +1001,12 @@
|
|
970
1001
|
grid-column: 2;
|
971
1002
|
grid-row: 2;
|
972
1003
|
}
|
973
|
-
}
|
974
|
-
@media screen and (max-width: 992px) {
|
975
1004
|
.pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__toggle-icon {
|
976
1005
|
transition: var(--pf-v5-c-table__toggle__icon--Transition);
|
977
1006
|
}
|
978
1007
|
.pf-v5-c-button.pf-m-expanded > .pf-m-grid-lg.pf-v5-c-table .pf-v5-c-table__toggle-icon {
|
979
1008
|
transform: rotate(var(--pf-v5-c-table__toggle--m-expanded__icon--Rotate));
|
980
1009
|
}
|
981
|
-
}
|
982
|
-
@media screen and (max-width: 992px) {
|
983
1010
|
.pf-m-grid-lg.pf-v5-c-table :where(.pf-v5-c-table, .pf-v5-c-table__thead, .pf-v5-c-table__tbody, .pf-v5-c-table__tr, .pf-v5-c-table__th, .pf-v5-c-table__td, .pf-v5-c-table__text).pf-m-nowrap {
|
984
1011
|
--pf-v5-c-table--cell--Overflow: auto;
|
985
1012
|
}
|
@@ -990,8 +1017,6 @@
|
|
990
1017
|
.pf-m-grid-lg.pf-v5-c-table :where(.pf-v5-c-table, .pf-v5-c-table__thead, .pf-v5-c-table__tbody, .pf-v5-c-table__tr, .pf-v5-c-table__th, .pf-v5-c-table__td, .pf-v5-c-table__text).pf-m-truncate {
|
991
1018
|
--pf-v5-c-table--cell--MaxWidth: 100%;
|
992
1019
|
}
|
993
|
-
}
|
994
|
-
@media screen and (max-width: 992px) {
|
995
1020
|
.pf-m-grid-lg.pf-v5-c-table [class*=pf-m-width] {
|
996
1021
|
--pf-v5-c-table--cell--Width: auto;
|
997
1022
|
}
|
@@ -1034,26 +1059,26 @@
|
|
1034
1059
|
display: block;
|
1035
1060
|
}
|
1036
1061
|
.pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):first-of-type {
|
1037
|
-
border-
|
1062
|
+
border-block-start: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
1038
1063
|
}
|
1039
1064
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table.pf-m-compact > tbody:where(.pf-v5-c-table__tbody) {
|
1040
|
-
border-
|
1065
|
+
border-block-start: 0;
|
1041
1066
|
}
|
1042
1067
|
.pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
|
1043
|
-
border-
|
1068
|
+
border-block-end: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
1044
1069
|
}
|
1045
1070
|
.pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):last-child,
|
1046
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) {
|
1047
|
-
border-
|
1072
|
+
border-block-end-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
|
1048
1073
|
}
|
1049
1074
|
.pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
|
1050
|
-
border-
|
1075
|
+
border-block-end: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
|
1051
1076
|
}
|
1052
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) {
|
1053
|
-
border-
|
1078
|
+
border-block-end: 0;
|
1054
1079
|
}
|
1055
1080
|
.pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded:not(:last-of-type) {
|
1056
|
-
border-
|
1081
|
+
border-block-end: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
1057
1082
|
}
|
1058
1083
|
.pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected {
|
1059
1084
|
--pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
|
@@ -1065,10 +1090,16 @@
|
|
1065
1090
|
height: auto;
|
1066
1091
|
grid-auto-columns: max-content;
|
1067
1092
|
grid-column-gap: var(--pf-v5-c-table__tr--responsive--GridColumnGap);
|
1068
|
-
padding: var(--pf-v5-c-table__tr--responsive--PaddingTop)
|
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);
|
1069
1097
|
}
|
1070
1098
|
.pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > * {
|
1071
|
-
padding: var(--pf-v5-c-table--cell--responsive--PaddingTop)
|
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);
|
1072
1103
|
}
|
1073
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 {
|
1074
1105
|
--pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--cell--first-child--responsive--PaddingTop);
|
@@ -1078,17 +1109,18 @@
|
|
1078
1109
|
--pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr--responsive--PaddingBottom);
|
1079
1110
|
--pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop);
|
1080
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);
|
1081
1113
|
--pf-v5-c-table__check--input--MarginTop: 0;
|
1082
1114
|
}
|
1083
1115
|
.pf-m-grid-xl.pf-v5-c-table.pf-m-compact .pf-v5-c-table__action {
|
1084
|
-
margin-
|
1085
|
-
margin-
|
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);
|
1086
1118
|
}
|
1087
1119
|
.pf-m-grid-xl.pf-v5-c-table.pf-m-compact .pf-v5-c-table__toggle .pf-v5-c-button {
|
1088
|
-
margin-
|
1120
|
+
margin-block-end: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
|
1089
1121
|
}
|
1090
1122
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__icon > * {
|
1091
|
-
text-align:
|
1123
|
+
text-align: start;
|
1092
1124
|
}
|
1093
1125
|
.pf-m-grid-xl.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label] {
|
1094
1126
|
--pf-v5-c-table--cell--hidden-visible--Display: var(--pf-v5-c-table--m-grid--cell--hidden-visible--Display);
|
@@ -1102,7 +1134,7 @@
|
|
1102
1134
|
}
|
1103
1135
|
.pf-m-grid-xl.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label]::before {
|
1104
1136
|
font-weight: bold;
|
1105
|
-
text-align:
|
1137
|
+
text-align: start;
|
1106
1138
|
content: attr(data-label);
|
1107
1139
|
}
|
1108
1140
|
.pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr) > *:first-child {
|
@@ -1131,12 +1163,12 @@
|
|
1131
1163
|
}
|
1132
1164
|
.pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody)::after {
|
1133
1165
|
position: absolute;
|
1134
|
-
|
1135
|
-
|
1136
|
-
|
1166
|
+
inset-block-start: 0;
|
1167
|
+
inset-block-end: 0;
|
1168
|
+
inset-inline-start: 0;
|
1137
1169
|
content: "";
|
1138
1170
|
border: 0;
|
1139
|
-
border-
|
1171
|
+
border-inline-start: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
|
1140
1172
|
}
|
1141
1173
|
.pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
|
1142
1174
|
--pf-v5-c-table__tbody--after--BorderLeftWidth: var(--pf-v5-c-table__tbody--after--border-width--base);
|
@@ -1160,7 +1192,7 @@
|
|
1160
1192
|
display: block;
|
1161
1193
|
max-height: var(--pf-v5-c-table__expandable-row--MaxHeight);
|
1162
1194
|
overflow-y: auto;
|
1163
|
-
border-
|
1195
|
+
border-block-end: none;
|
1164
1196
|
box-shadow: none;
|
1165
1197
|
}
|
1166
1198
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__expandable-row > * {
|
@@ -1168,7 +1200,7 @@
|
|
1168
1200
|
display: block;
|
1169
1201
|
}
|
1170
1202
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__expandable-row.pf-m-expanded {
|
1171
|
-
border-
|
1203
|
+
border-block-start-color: var(--pf-v5-c-table--BorderColor);
|
1172
1204
|
}
|
1173
1205
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__expandable-row > :first-child:not(.pf-v5-c-table__check)::after {
|
1174
1206
|
content: none;
|
@@ -1181,8 +1213,8 @@
|
|
1181
1213
|
display: none;
|
1182
1214
|
}
|
1183
1215
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__expandable-row .pf-v5-c-table__expandable-row-content {
|
1184
|
-
padding-
|
1185
|
-
padding-
|
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);
|
1186
1218
|
}
|
1187
1219
|
.pf-m-grid-xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable {
|
1188
1220
|
--pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
|
@@ -1195,9 +1227,9 @@
|
|
1195
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 {
|
1196
1228
|
content: "";
|
1197
1229
|
position: absolute;
|
1198
|
-
|
1199
|
-
|
1200
|
-
|
1230
|
+
inset-block-start: 0;
|
1231
|
+
inset-block-end: 0;
|
1232
|
+
inset-inline-start: 0;
|
1201
1233
|
width: var(--pf-v5-c-table__tbody--after__tr--BorderLeftWidth);
|
1202
1234
|
background-color: var(--pf-v5-c-table__tbody--after__tr--BorderLeftColor);
|
1203
1235
|
}
|
@@ -1212,9 +1244,9 @@
|
|
1212
1244
|
.pf-m-grid-xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected::after {
|
1213
1245
|
content: "";
|
1214
1246
|
position: absolute;
|
1215
|
-
|
1216
|
-
|
1217
|
-
|
1247
|
+
inset-block-start: 0;
|
1248
|
+
inset-block-end: 0;
|
1249
|
+
inset-inline-start: 0;
|
1218
1250
|
width: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftWidth);
|
1219
1251
|
background-color: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftColor);
|
1220
1252
|
}
|
@@ -1229,7 +1261,7 @@
|
|
1229
1261
|
grid-row-start: 20;
|
1230
1262
|
grid-column: -1;
|
1231
1263
|
justify-self: end;
|
1232
|
-
padding-
|
1264
|
+
padding-inline-end: 0;
|
1233
1265
|
}
|
1234
1266
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__toggle::after {
|
1235
1267
|
content: none;
|
@@ -1247,34 +1279,39 @@
|
|
1247
1279
|
grid-column-start: 2;
|
1248
1280
|
}
|
1249
1281
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check {
|
1250
|
-
margin-
|
1251
|
-
margin-
|
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;
|
1252
1285
|
}
|
1253
1286
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite {
|
1254
|
-
margin-
|
1287
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
|
1255
1288
|
}
|
1256
1289
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
|
1257
|
-
margin-
|
1290
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
|
1258
1291
|
}
|
1259
1292
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__action {
|
1260
|
-
margin-
|
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;
|
1261
1298
|
}
|
1262
1299
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__favorite {
|
1263
|
-
margin-
|
1300
|
+
margin-block-start: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
|
1264
1301
|
}
|
1265
1302
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
|
1266
|
-
margin-
|
1303
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
|
1267
1304
|
}
|
1268
1305
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__action {
|
1269
|
-
margin-
|
1270
|
-
text-align:
|
1306
|
+
margin-block-start: var(--pf-v5-c-table--m-grid__action--MarginTop);
|
1307
|
+
text-align: end;
|
1271
1308
|
}
|
1272
1309
|
}
|
1273
1310
|
@media screen and (max-width: 1200px) and (max-width: 576px) {
|
1274
1311
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__action {
|
1275
1312
|
grid-row-start: 1;
|
1276
1313
|
grid-column-start: 2;
|
1277
|
-
margin-
|
1314
|
+
margin-inline-start: 0;
|
1278
1315
|
}
|
1279
1316
|
}
|
1280
1317
|
@media screen and (max-width: 1200px) {
|
@@ -1282,16 +1319,12 @@
|
|
1282
1319
|
grid-column: 2;
|
1283
1320
|
grid-row: 2;
|
1284
1321
|
}
|
1285
|
-
}
|
1286
|
-
@media screen and (max-width: 1200px) {
|
1287
1322
|
.pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__toggle-icon {
|
1288
1323
|
transition: var(--pf-v5-c-table__toggle__icon--Transition);
|
1289
1324
|
}
|
1290
1325
|
.pf-v5-c-button.pf-m-expanded > .pf-m-grid-xl.pf-v5-c-table .pf-v5-c-table__toggle-icon {
|
1291
1326
|
transform: rotate(var(--pf-v5-c-table__toggle--m-expanded__icon--Rotate));
|
1292
1327
|
}
|
1293
|
-
}
|
1294
|
-
@media screen and (max-width: 1200px) {
|
1295
1328
|
.pf-m-grid-xl.pf-v5-c-table :where(.pf-v5-c-table, .pf-v5-c-table__thead, .pf-v5-c-table__tbody, .pf-v5-c-table__tr, .pf-v5-c-table__th, .pf-v5-c-table__td, .pf-v5-c-table__text).pf-m-nowrap {
|
1296
1329
|
--pf-v5-c-table--cell--Overflow: auto;
|
1297
1330
|
}
|
@@ -1302,8 +1335,6 @@
|
|
1302
1335
|
.pf-m-grid-xl.pf-v5-c-table :where(.pf-v5-c-table, .pf-v5-c-table__thead, .pf-v5-c-table__tbody, .pf-v5-c-table__tr, .pf-v5-c-table__th, .pf-v5-c-table__td, .pf-v5-c-table__text).pf-m-truncate {
|
1303
1336
|
--pf-v5-c-table--cell--MaxWidth: 100%;
|
1304
1337
|
}
|
1305
|
-
}
|
1306
|
-
@media screen and (max-width: 1200px) {
|
1307
1338
|
.pf-m-grid-xl.pf-v5-c-table [class*=pf-m-width] {
|
1308
1339
|
--pf-v5-c-table--cell--Width: auto;
|
1309
1340
|
}
|
@@ -1346,26 +1377,26 @@
|
|
1346
1377
|
display: block;
|
1347
1378
|
}
|
1348
1379
|
.pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody):first-of-type {
|
1349
|
-
border-
|
1380
|
+
border-block-start: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
1350
1381
|
}
|
1351
1382
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table.pf-m-compact > tbody:where(.pf-v5-c-table__tbody) {
|
1352
|
-
border-
|
1383
|
+
border-block-start: 0;
|
1353
1384
|
}
|
1354
1385
|
.pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) {
|
1355
|
-
border-
|
1386
|
+
border-block-end: var(--pf-v5-c-table__tr--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
1356
1387
|
}
|
1357
1388
|
.pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):last-child,
|
1358
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) {
|
1359
|
-
border-
|
1390
|
+
border-block-end-width: var(--pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth);
|
1360
1391
|
}
|
1361
1392
|
.pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
|
1362
|
-
border-
|
1393
|
+
border-block-end: var(--pf-v5-c-table--border-width--base) solid var(--pf-v5-c-table--BorderColor);
|
1363
1394
|
}
|
1364
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) {
|
1365
|
-
border-
|
1396
|
+
border-block-end: 0;
|
1366
1397
|
}
|
1367
1398
|
.pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded:not(:last-of-type) {
|
1368
|
-
border-
|
1399
|
+
border-block-end: var(--pf-v5-c-table__tbody--responsive--border-width--base) solid var(--pf-v5-c-table--responsive--BorderColor);
|
1369
1400
|
}
|
1370
1401
|
.pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected {
|
1371
1402
|
--pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
|
@@ -1377,10 +1408,16 @@
|
|
1377
1408
|
height: auto;
|
1378
1409
|
grid-auto-columns: max-content;
|
1379
1410
|
grid-column-gap: var(--pf-v5-c-table__tr--responsive--GridColumnGap);
|
1380
|
-
padding: var(--pf-v5-c-table__tr--responsive--PaddingTop)
|
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);
|
1381
1415
|
}
|
1382
1416
|
.pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr):not(.pf-v5-c-table__expandable-row) > * {
|
1383
|
-
padding: var(--pf-v5-c-table--cell--responsive--PaddingTop)
|
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);
|
1384
1421
|
}
|
1385
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 {
|
1386
1423
|
--pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--cell--first-child--responsive--PaddingTop);
|
@@ -1390,17 +1427,18 @@
|
|
1390
1427
|
--pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-c-table--m-compact__tr--responsive--PaddingBottom);
|
1391
1428
|
--pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop);
|
1392
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);
|
1393
1431
|
--pf-v5-c-table__check--input--MarginTop: 0;
|
1394
1432
|
}
|
1395
1433
|
.pf-m-grid-2xl.pf-v5-c-table.pf-m-compact .pf-v5-c-table__action {
|
1396
|
-
margin-
|
1397
|
-
margin-
|
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);
|
1398
1436
|
}
|
1399
1437
|
.pf-m-grid-2xl.pf-v5-c-table.pf-m-compact .pf-v5-c-table__toggle .pf-v5-c-button {
|
1400
|
-
margin-
|
1438
|
+
margin-block-end: var(--pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom);
|
1401
1439
|
}
|
1402
1440
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__icon > * {
|
1403
|
-
text-align:
|
1441
|
+
text-align: start;
|
1404
1442
|
}
|
1405
1443
|
.pf-m-grid-2xl.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label] {
|
1406
1444
|
--pf-v5-c-table--cell--hidden-visible--Display: var(--pf-v5-c-table--m-grid--cell--hidden-visible--Display);
|
@@ -1414,7 +1452,7 @@
|
|
1414
1452
|
}
|
1415
1453
|
.pf-m-grid-2xl.pf-v5-c-table :where(.pf-v5-c-table__th, .pf-v5-c-table__td)[data-label]::before {
|
1416
1454
|
font-weight: bold;
|
1417
|
-
text-align:
|
1455
|
+
text-align: start;
|
1418
1456
|
content: attr(data-label);
|
1419
1457
|
}
|
1420
1458
|
.pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr) > *:first-child {
|
@@ -1443,12 +1481,12 @@
|
|
1443
1481
|
}
|
1444
1482
|
.pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody)::after {
|
1445
1483
|
position: absolute;
|
1446
|
-
|
1447
|
-
|
1448
|
-
|
1484
|
+
inset-block-start: 0;
|
1485
|
+
inset-block-end: 0;
|
1486
|
+
inset-inline-start: 0;
|
1449
1487
|
content: "";
|
1450
1488
|
border: 0;
|
1451
|
-
border-
|
1489
|
+
border-inline-start: var(--pf-v5-c-table__tbody--after--BorderLeftWidth) solid var(--pf-v5-c-table__tbody--after--BorderColor);
|
1452
1490
|
}
|
1453
1491
|
.pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-expanded {
|
1454
1492
|
--pf-v5-c-table__tbody--after--BorderLeftWidth: var(--pf-v5-c-table__tbody--after--border-width--base);
|
@@ -1472,7 +1510,7 @@
|
|
1472
1510
|
display: block;
|
1473
1511
|
max-height: var(--pf-v5-c-table__expandable-row--MaxHeight);
|
1474
1512
|
overflow-y: auto;
|
1475
|
-
border-
|
1513
|
+
border-block-end: none;
|
1476
1514
|
box-shadow: none;
|
1477
1515
|
}
|
1478
1516
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__expandable-row > * {
|
@@ -1480,7 +1518,7 @@
|
|
1480
1518
|
display: block;
|
1481
1519
|
}
|
1482
1520
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__expandable-row.pf-m-expanded {
|
1483
|
-
border-
|
1521
|
+
border-block-start-color: var(--pf-v5-c-table--BorderColor);
|
1484
1522
|
}
|
1485
1523
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__expandable-row > :first-child:not(.pf-v5-c-table__check)::after {
|
1486
1524
|
content: none;
|
@@ -1493,8 +1531,8 @@
|
|
1493
1531
|
display: none;
|
1494
1532
|
}
|
1495
1533
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__expandable-row .pf-v5-c-table__expandable-row-content {
|
1496
|
-
padding-
|
1497
|
-
padding-
|
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);
|
1498
1536
|
}
|
1499
1537
|
.pf-m-grid-2xl.pf-v5-c-table tbody:where(.pf-v5-c-table__tbody).pf-m-hoverable {
|
1500
1538
|
--pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
|
@@ -1507,9 +1545,9 @@
|
|
1507
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 {
|
1508
1546
|
content: "";
|
1509
1547
|
position: absolute;
|
1510
|
-
|
1511
|
-
|
1512
|
-
|
1548
|
+
inset-block-start: 0;
|
1549
|
+
inset-block-end: 0;
|
1550
|
+
inset-inline-start: 0;
|
1513
1551
|
width: var(--pf-v5-c-table__tbody--after__tr--BorderLeftWidth);
|
1514
1552
|
background-color: var(--pf-v5-c-table__tbody--after__tr--BorderLeftColor);
|
1515
1553
|
}
|
@@ -1524,9 +1562,9 @@
|
|
1524
1562
|
.pf-m-grid-2xl.pf-v5-c-table tr:where(.pf-v5-c-table__tr).pf-m-selected::after {
|
1525
1563
|
content: "";
|
1526
1564
|
position: absolute;
|
1527
|
-
|
1528
|
-
|
1529
|
-
|
1565
|
+
inset-block-start: 0;
|
1566
|
+
inset-block-end: 0;
|
1567
|
+
inset-inline-start: 0;
|
1530
1568
|
width: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftWidth);
|
1531
1569
|
background-color: var(--pf-v5-c-table__tr--m-selected--after--BorderLeftColor);
|
1532
1570
|
}
|
@@ -1541,7 +1579,7 @@
|
|
1541
1579
|
grid-row-start: 20;
|
1542
1580
|
grid-column: -1;
|
1543
1581
|
justify-self: end;
|
1544
|
-
padding-
|
1582
|
+
padding-inline-end: 0;
|
1545
1583
|
}
|
1546
1584
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__toggle::after {
|
1547
1585
|
content: none;
|
@@ -1559,34 +1597,39 @@
|
|
1559
1597
|
grid-column-start: 2;
|
1560
1598
|
}
|
1561
1599
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check {
|
1562
|
-
margin-
|
1563
|
-
margin-
|
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;
|
1564
1603
|
}
|
1565
1604
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite {
|
1566
|
-
margin-
|
1605
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft);
|
1567
1606
|
}
|
1568
1607
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
|
1569
|
-
margin-
|
1608
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__check--favorite--action--MarginLeft);
|
1570
1609
|
}
|
1571
1610
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__check ~ .pf-v5-c-table__action {
|
1572
|
-
margin-
|
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;
|
1573
1616
|
}
|
1574
1617
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__favorite {
|
1575
|
-
margin-
|
1618
|
+
margin-block-start: var(--pf-v5-c-table--m-grid__favorite--MarginTop);
|
1576
1619
|
}
|
1577
1620
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__favorite ~ .pf-v5-c-table__action {
|
1578
|
-
margin-
|
1621
|
+
margin-inline-start: var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft);
|
1579
1622
|
}
|
1580
1623
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__action {
|
1581
|
-
margin-
|
1582
|
-
text-align:
|
1624
|
+
margin-block-start: var(--pf-v5-c-table--m-grid__action--MarginTop);
|
1625
|
+
text-align: end;
|
1583
1626
|
}
|
1584
1627
|
}
|
1585
1628
|
@media screen and (max-width: 1450px) and (max-width: 576px) {
|
1586
1629
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__action {
|
1587
1630
|
grid-row-start: 1;
|
1588
1631
|
grid-column-start: 2;
|
1589
|
-
margin-
|
1632
|
+
margin-inline-start: 0;
|
1590
1633
|
}
|
1591
1634
|
}
|
1592
1635
|
@media screen and (max-width: 1450px) {
|
@@ -1594,16 +1637,12 @@
|
|
1594
1637
|
grid-column: 2;
|
1595
1638
|
grid-row: 2;
|
1596
1639
|
}
|
1597
|
-
}
|
1598
|
-
@media screen and (max-width: 1450px) {
|
1599
1640
|
.pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__toggle-icon {
|
1600
1641
|
transition: var(--pf-v5-c-table__toggle__icon--Transition);
|
1601
1642
|
}
|
1602
1643
|
.pf-v5-c-button.pf-m-expanded > .pf-m-grid-2xl.pf-v5-c-table .pf-v5-c-table__toggle-icon {
|
1603
1644
|
transform: rotate(var(--pf-v5-c-table__toggle--m-expanded__icon--Rotate));
|
1604
1645
|
}
|
1605
|
-
}
|
1606
|
-
@media screen and (max-width: 1450px) {
|
1607
1646
|
.pf-m-grid-2xl.pf-v5-c-table :where(.pf-v5-c-table, .pf-v5-c-table__thead, .pf-v5-c-table__tbody, .pf-v5-c-table__tr, .pf-v5-c-table__th, .pf-v5-c-table__td, .pf-v5-c-table__text).pf-m-nowrap {
|
1608
1647
|
--pf-v5-c-table--cell--Overflow: auto;
|
1609
1648
|
}
|
@@ -1614,8 +1653,6 @@
|
|
1614
1653
|
.pf-m-grid-2xl.pf-v5-c-table :where(.pf-v5-c-table, .pf-v5-c-table__thead, .pf-v5-c-table__tbody, .pf-v5-c-table__tr, .pf-v5-c-table__th, .pf-v5-c-table__td, .pf-v5-c-table__text).pf-m-truncate {
|
1615
1654
|
--pf-v5-c-table--cell--MaxWidth: 100%;
|
1616
1655
|
}
|
1617
|
-
}
|
1618
|
-
@media screen and (max-width: 1450px) {
|
1619
1656
|
.pf-m-grid-2xl.pf-v5-c-table [class*=pf-m-width] {
|
1620
1657
|
--pf-v5-c-table--cell--Width: auto;
|
1621
1658
|
}
|