@patternfly/patternfly 6.6.0-prerelease.33 → 6.6.0-prerelease.34

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 (13) hide show
  1. package/components/Table/table-grid.css +6 -6
  2. package/components/Table/table-grid.scss +2 -2
  3. package/components/_index.css +6 -6
  4. package/docs/components/Table/examples/Table.md +416 -416
  5. package/docs/demos/Card/examples/Card.md +16 -16
  6. package/docs/demos/DataList/examples/DataList.md +31 -31
  7. package/docs/demos/DescriptionList/examples/DescriptionList.md +8 -8
  8. package/docs/demos/Table/examples/Table.md +189 -173
  9. package/package.json +1 -1
  10. package/patternfly-no-globals.css +6 -6
  11. package/patternfly.css +6 -6
  12. package/patternfly.min.css +1 -1
  13. package/patternfly.min.css.map +1 -1
package/components/Table/table-grid.css CHANGED
@@ -49,7 +49,7 @@
49
49
  --pf-v6-c-table__expandable-row-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
50
50
  --pf-v6-c-table__check--responsive--MarginInlineStart: var(--pf-v6-c-table__tbody--responsive--border-width--base);
51
51
  --pf-v6-c-table__check--responsive--MarginBlockStart: calc(var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart) + 0.25rem);
52
- --pf-v6-c-table--m-grid__favorite--MarginBlockStart: 0.5rem;
52
+ --pf-v6-c-table--m-grid__favorite--MarginBlockStart: 0;
53
53
  --pf-v6-c-table--m-grid__check--favorite--MarginInlineStart: var(--pf-t--global--spacer--xl);
54
54
  --pf-v6-c-table__action--responsive--MarginInlineStart: var(--pf-t--global--spacer--xl);
55
55
  --pf-v6-c-table__action--responsive--MarginBlockStart: calc(var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart) + var(--pf-t--global--spacer--control--vertical--plain) * -1);
@@ -134,7 +134,7 @@
134
134
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
135
135
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
136
136
  }
137
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
137
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
138
138
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
139
139
  }
140
140
  .pf-m-grid.pf-v6-c-table.pf-m-compact {
@@ -445,7 +445,7 @@
445
445
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
446
446
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
447
447
  }
448
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
448
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
449
449
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
450
450
  }
451
451
  .pf-m-grid-md.pf-v6-c-table.pf-m-compact {
@@ -757,7 +757,7 @@
757
757
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
758
758
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
759
759
  }
760
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
760
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
761
761
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
762
762
  }
763
763
  .pf-m-grid-lg.pf-v6-c-table.pf-m-compact {
@@ -1069,7 +1069,7 @@
1069
1069
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
1070
1070
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
1071
1071
  }
1072
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
1072
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
1073
1073
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
1074
1074
  }
1075
1075
  .pf-m-grid-xl.pf-v6-c-table.pf-m-compact {
@@ -1381,7 +1381,7 @@
1381
1381
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
1382
1382
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
1383
1383
  }
1384
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
1384
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
1385
1385
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
1386
1386
  }
1387
1387
  .pf-m-grid-2xl.pf-v6-c-table.pf-m-compact {
package/components/Table/table-grid.scss CHANGED
@@ -117,7 +117,7 @@
117
117
  --#{$table}__check--responsive--MarginBlockStart: calc(var(--#{$table}--cell--first-child--responsive--PaddingBlockStart) + #{pf-size-prem(4px)}); // cell padding plus an offset for the check/radio to align with text
118
118
 
119
119
  // * Table grid favorite
120
- --#{$table}--m-grid__favorite--MarginBlockStart: #{pf-size-prem(8px)};
120
+ --#{$table}--m-grid__favorite--MarginBlockStart: 0;
121
121
  --#{$table}--m-grid__check--favorite--MarginInlineStart: var(--pf-t--global--spacer--xl);
122
122
 
123
123
  // * Table grid action
@@ -244,7 +244,7 @@
244
244
 
245
245
  // remove padding from first child to align with kebab
246
246
  &:first-child,
247
- &:is(.#{$table}__toggle, .#{$table}__check) + :where(th, td) {
247
+ &:is(.#{$table}__toggle, .#{$table}__check, .#{$table}__favorite) + :where(th, td) {
248
248
  --#{$table}--cell--responsive--PaddingBlockStart: var(--#{$table}--cell--first-child--responsive--PaddingBlockStart);
249
249
  }
250
250
  }
package/components/_index.css CHANGED
@@ -17947,7 +17947,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
17947
17947
  --pf-v6-c-table__expandable-row-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17948
17948
  --pf-v6-c-table__check--responsive--MarginInlineStart: var(--pf-v6-c-table__tbody--responsive--border-width--base);
17949
17949
  --pf-v6-c-table__check--responsive--MarginBlockStart: calc(var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart) + 0.25rem);
17950
- --pf-v6-c-table--m-grid__favorite--MarginBlockStart: 0.5rem;
17950
+ --pf-v6-c-table--m-grid__favorite--MarginBlockStart: 0;
17951
17951
  --pf-v6-c-table--m-grid__check--favorite--MarginInlineStart: var(--pf-t--global--spacer--xl);
17952
17952
  --pf-v6-c-table__action--responsive--MarginInlineStart: var(--pf-t--global--spacer--xl);
17953
17953
  --pf-v6-c-table__action--responsive--MarginBlockStart: calc(var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart) + var(--pf-t--global--spacer--control--vertical--plain) * -1);
@@ -18032,7 +18032,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
18032
18032
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
18033
18033
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
18034
18034
  }
18035
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
18035
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
18036
18036
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
18037
18037
  }
18038
18038
  .pf-m-grid.pf-v6-c-table.pf-m-compact {
@@ -18343,7 +18343,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
18343
18343
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
18344
18344
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
18345
18345
  }
18346
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
18346
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
18347
18347
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
18348
18348
  }
18349
18349
  .pf-m-grid-md.pf-v6-c-table.pf-m-compact {
@@ -18655,7 +18655,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
18655
18655
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
18656
18656
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
18657
18657
  }
18658
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
18658
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
18659
18659
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
18660
18660
  }
18661
18661
  .pf-m-grid-lg.pf-v6-c-table.pf-m-compact {
@@ -18967,7 +18967,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
18967
18967
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
18968
18968
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
18969
18969
  }
18970
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
18970
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
18971
18971
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
18972
18972
  }
18973
18973
  .pf-m-grid-xl.pf-v6-c-table.pf-m-compact {
@@ -19279,7 +19279,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
19279
19279
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
19280
19280
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
19281
19281
  }
19282
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check) + :where(th, td) {
19282
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child, .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):is(.pf-v6-c-table__toggle, .pf-v6-c-table__check, .pf-v6-c-table__favorite) + :where(th, td) {
19283
19283
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
19284
19284
  }
19285
19285
  .pf-m-grid-2xl.pf-v6-c-table.pf-m-compact {