@patternfly/patternfly 5.0.0-alpha.37 → 5.0.0-alpha.38

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 (12) hide show
  1. package/components/DataList/data-list.css +34 -29
  2. package/components/DataList/data-list.scss +32 -24
  3. package/components/Table/table.css +60 -63
  4. package/components/Table/table.scss +56 -60
  5. package/docs/components/DataList/examples/DataList.md +52 -54
  6. package/docs/components/Table/examples/Table.md +136 -2125
  7. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +10 -20
  8. package/package.json +3 -3
  9. package/patternfly-no-globals.css +94 -92
  10. package/patternfly.css +94 -92
  11. package/patternfly.min.css +1 -1
  12. package/patternfly.min.css.map +1 -1
package/patternfly.css CHANGED
@@ -9830,25 +9830,25 @@ label.pf-c-check, .pf-c-check__label,
9830
9830
  --pf-c-data-list--BorderTopWidth: var(--pf-global--spacer--sm);
9831
9831
  --pf-c-data-list--sm--BorderTopWidth: var(--pf-global--BorderWidth--sm);
9832
9832
  --pf-c-data-list--sm--BorderTopColor: var(--pf-global--BorderColor--100);
9833
+ --pf-c-data-list--MarginLeft: var(--pf-global--spacer--md);
9833
9834
  --pf-c-data-list__item--BackgroundColor: var(--pf-global--BackgroundColor--100);
9834
9835
  --pf-c-data-list__item--m-selected--ZIndex: var(--pf-global--ZIndex--xs);
9835
9836
  --pf-c-data-list__item--m-expanded--before--BackgroundColor: var(--pf-global--active-color--100);
9836
9837
  --pf-c-data-list__item--m-selected--before--BackgroundColor: var(--pf-global--active-color--100);
9837
9838
  --pf-c-data-list__item--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-top), var(--pf-global--BoxShadow--sm-bottom);
9838
- --pf-c-data-list__item--m-selectable--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
9839
- --pf-c-data-list__item--m-selectable--hover--ZIndex: calc(var(--pf-c-data-list__item--m-selected--ZIndex) + 1);
9840
- --pf-c-data-list__item--m-selectable--hover--BoxShadow: var(--pf-global--BoxShadow--sm-top), var(--pf-global--BoxShadow--sm-bottom);
9841
- --pf-c-data-list__item--m-selectable--focus--BoxShadow: var(--pf-global--BoxShadow--sm-top), var(--pf-global--BoxShadow--sm-bottom);
9842
- --pf-c-data-list__item--m-selectable--active--BoxShadow: var(--pf-global--BoxShadow--sm-top), var(--pf-global--BoxShadow--sm-bottom);
9843
- --pf-c-data-list__item--m-expanded--m-selectable--before--BackgroundColor: var(--pf-global--active-color--300);
9839
+ --pf-c-data-list__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
9840
+ --pf-c-data-list__item--m-clickable--hover--ZIndex: calc(var(--pf-c-data-list__item--m-selected--ZIndex) + 1);
9841
+ --pf-c-data-list__item--m-clickable--hover--BoxShadow: var(--pf-global--BoxShadow--sm-top), var(--pf-global--BoxShadow--sm-bottom);
9842
+ --pf-c-data-list__item--m-clickable--focus--BoxShadow: var(--pf-global--BoxShadow--sm-top), var(--pf-global--BoxShadow--sm-bottom);
9843
+ --pf-c-data-list__item--m-clickable--active--BoxShadow: var(--pf-global--BoxShadow--sm-top), var(--pf-global--BoxShadow--sm-bottom);
9844
9844
  --pf-c-data-list__item--BorderBottomColor: var(--pf-global--BorderColor--300);
9845
9845
  --pf-c-data-list__item--BorderBottomWidth: 0.5rem;
9846
- --pf-c-data-list__item--m-selectable--hover--item--BorderTopColor: var(--pf-c-data-list__item--BorderBottomColor);
9847
- --pf-c-data-list__item--m-selectable--hover--item--BorderTopWidth: var(--pf-c-data-list__item--BorderBottomWidth);
9846
+ --pf-c-data-list__item--m-clickable--hover--item--BorderTopColor: var(--pf-c-data-list__item--BorderBottomColor);
9847
+ --pf-c-data-list__item--m-clickable--hover--item--BorderTopWidth: var(--pf-c-data-list__item--BorderBottomWidth);
9848
9848
  --pf-c-data-list__item--sm--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
9849
9849
  --pf-c-data-list__item--sm--BorderBottomColor: var(--pf-global--BorderColor--100);
9850
9850
  --pf-c-data-list__item--before--BackgroundColor: transparent;
9851
- --pf-c-data-list__item--before--Width: var(--pf-global--BorderWidth--lg);
9851
+ --pf-c-data-list__item--before--Width: calc(2 * var(--pf-global--BorderWidth--lg));
9852
9852
  --pf-c-data-list__item--before--Transition: var(--pf-global--Transition);
9853
9853
  --pf-c-data-list__item--before--Top: 0;
9854
9854
  --pf-c-data-list__item--before--sm--Top: calc(var(--pf-c-data-list__item--BorderBottomWidth) * -1);
@@ -9908,8 +9908,6 @@ label.pf-c-check, .pf-c-check__label,
9908
9908
  --pf-c-data-list__item-action__action--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
9909
9909
  --pf-c-data-list__action--MarginTop: var(--pf-c-data-list__item-action__action--MarginTop);
9910
9910
  --pf-c-data-list__item-action__action--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
9911
- --pf-c-data-list__expandable-content--BorderTopWidth: var(--pf-global--BorderWidth--sm);
9912
- --pf-c-data-list__expandable-content--BorderTopColor: var(--pf-global--BorderColor--100);
9913
9911
  --pf-c-data-list__expandable-content--MarginRight: calc(var(--pf-c-data-list__expandable-content-body--PaddingRight) * -1);
9914
9912
  --pf-c-data-list__expandable-content--MarginLeft: calc(var(--pf-c-data-list__expandable-content-body--PaddingLeft) * -1);
9915
9913
  --pf-c-data-list__expandable-content--MaxHeight: 37.5rem;
@@ -10041,28 +10039,28 @@ label.pf-c-check, .pf-c-check__label,
10041
10039
  background-color: var(--pf-c-data-list__item--before--BackgroundColor);
10042
10040
  transition: var(--pf-c-data-list__item--before--Transition);
10043
10041
  }
10044
- .pf-c-data-list__item.pf-m-selectable {
10042
+ .pf-c-data-list__item.pf-m-clickable {
10045
10043
  cursor: pointer;
10046
- outline-offset: var(--pf-c-data-list__item--m-selectable--OutlineOffset);
10044
+ outline-offset: var(--pf-c-data-list__item--m-clickable--OutlineOffset);
10047
10045
  }
10048
- .pf-c-data-list__item.pf-m-selectable:hover, .pf-c-data-list__item.pf-m-selectable:focus {
10046
+ .pf-c-data-list__item.pf-m-clickable:hover, .pf-c-data-list__item.pf-m-clickable:focus {
10049
10047
  position: relative;
10050
- z-index: var(--pf-c-data-list__item--m-selectable--hover--ZIndex);
10048
+ z-index: var(--pf-c-data-list__item--m-clickable--hover--ZIndex);
10051
10049
  }
10052
- .pf-c-data-list__item.pf-m-selectable:hover:not(.pf-m-selected):not(:last-child), .pf-c-data-list__item.pf-m-selectable:focus:not(.pf-m-selected):not(:last-child) {
10050
+ .pf-c-data-list__item.pf-m-clickable:hover:not(.pf-m-selected):not(:last-child), .pf-c-data-list__item.pf-m-clickable:focus:not(.pf-m-selected):not(:last-child) {
10053
10051
  --pf-c-data-list__item--BorderBottomWidth: 0;
10054
10052
  }
10055
- .pf-c-data-list__item.pf-m-selectable:hover:not(.pf-m-selected):not(:last-child) + .pf-c-data-list__item, .pf-c-data-list__item.pf-m-selectable:focus:not(.pf-m-selected):not(:last-child) + .pf-c-data-list__item {
10056
- border-top: var(--pf-c-data-list__item--m-selectable--hover--item--BorderTopWidth) solid var(--pf-c-data-list__item--m-selectable--hover--item--BorderTopColor);
10053
+ .pf-c-data-list__item.pf-m-clickable:hover:not(.pf-m-selected):not(:last-child) + .pf-c-data-list__item, .pf-c-data-list__item.pf-m-clickable:focus:not(.pf-m-selected):not(:last-child) + .pf-c-data-list__item {
10054
+ border-top: var(--pf-c-data-list__item--m-clickable--hover--item--BorderTopWidth) solid var(--pf-c-data-list__item--m-clickable--hover--item--BorderTopColor);
10057
10055
  }
10058
- .pf-c-data-list__item.pf-m-selectable:hover {
10059
- box-shadow: var(--pf-c-data-list__item--m-selectable--hover--BoxShadow);
10056
+ .pf-c-data-list__item.pf-m-clickable:hover {
10057
+ box-shadow: var(--pf-c-data-list__item--m-clickable--hover--BoxShadow);
10060
10058
  }
10061
- .pf-c-data-list__item.pf-m-selectable:focus {
10062
- box-shadow: var(--pf-c-data-list__item--m-selectable--focus--BoxShadow);
10059
+ .pf-c-data-list__item.pf-m-clickable:focus {
10060
+ box-shadow: var(--pf-c-data-list__item--m-clickable--focus--BoxShadow);
10063
10061
  }
10064
- .pf-c-data-list__item.pf-m-selectable:active {
10065
- box-shadow: var(--pf-c-data-list__item--m-selectable--active--BoxShadow);
10062
+ .pf-c-data-list__item.pf-m-clickable:active {
10063
+ box-shadow: var(--pf-c-data-list__item--m-clickable--active--BoxShadow);
10066
10064
  }
10067
10065
  .pf-c-data-list__item.pf-m-selected {
10068
10066
  --pf-c-data-list__item--before--BackgroundColor: var(--pf-c-data-list__item--m-selected--before--BackgroundColor);
@@ -10082,10 +10080,6 @@ label.pf-c-check, .pf-c-check__label,
10082
10080
  }
10083
10081
  .pf-c-data-list__item.pf-m-expanded {
10084
10082
  --pf-c-data-list__toggle-icon--Rotate: var(--pf-c-data-list__item--m-expanded__toggle-icon--Rotate);
10085
- --pf-c-data-list__item--before--BackgroundColor: var(--pf-c-data-list__item--m-expanded--before--BackgroundColor);
10086
- }
10087
- .pf-c-data-list__item.pf-m-expanded.pf-m-selectable:not(.pf-m-selected) {
10088
- --pf-c-data-list__item--before--BackgroundColor: var(--pf-c-data-list__item--m-expanded--m-selectable--before--BackgroundColor);
10089
10083
  }
10090
10084
 
10091
10085
  .pf-c-data-list__item-row {
@@ -10217,11 +10211,22 @@ label.pf-c-check, .pf-c-check__label,
10217
10211
  .pf-c-data-list__expandable-content {
10218
10212
  max-height: var(--pf-c-data-list__expandable-content--MaxHeight);
10219
10213
  overflow-y: auto;
10220
- border-top: var(--pf-c-data-list__expandable-content--BorderTopWidth) solid var(--pf-c-data-list__expandable-content--BorderTopColor);
10221
10214
  }
10222
10215
  .pf-c-data-list__expandable-content .pf-c-data-list__expandable-content-body {
10223
10216
  padding: var(--pf-c-data-list__expandable-content-body--PaddingTop) var(--pf-c-data-list__expandable-content-body--PaddingRight) var(--pf-c-data-list__expandable-content-body--PaddingBottom) var(--pf-c-data-list__expandable-content-body--PaddingLeft);
10224
10217
  }
10218
+ .pf-c-data-list__expandable-content .pf-c-data-list__expandable-content-body > .pf-c-data-list {
10219
+ margin-left: var(--pf-c-data-list--MarginLeft);
10220
+ }
10221
+ .pf-c-data-list__expandable-content .pf-c-data-list__expandable-content-body .pf-c-data-list__item:last-child {
10222
+ border-bottom: 0;
10223
+ }
10224
+ .pf-c-data-list__expandable-content .pf-c-data-list__expandable-content-body .pf-c-data-list__item-row {
10225
+ --pf-c-data-list__item-row--PaddingLeft: 0;
10226
+ }
10227
+ .pf-c-data-list__expandable-content .pf-c-data-list__expandable-content-body .pf-c-data-list__expandable-content-body {
10228
+ --pf-c-data-list__expandable-content-body--PaddingLeft: 0;
10229
+ }
10225
10230
  .pf-c-data-list__expandable-content .pf-c-data-list__expandable-content-body.pf-m-no-padding {
10226
10231
  padding: 0;
10227
10232
  }
@@ -27097,43 +27102,43 @@ svg.pf-c-spinner.pf-m-xl {
27097
27102
  --pf-c-table--nested--first-last-child--PaddingRight: var(--pf-c-table--m-compact--cell--first-last-child--PaddingLeft);
27098
27103
  --pf-c-table--nested--first-last-child--PaddingLeft: var(--pf-c-table--m-compact--cell--first-last-child--PaddingRight);
27099
27104
  --pf-c-table__expandable-row--m-expanded--BorderBottomColor: var(--pf-global--BorderColor--100);
27100
- --pf-c-table--tr--m-hoverable--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
27101
- --pf-c-table--tr--m-hoverable--BackgroundColor: transparent;
27102
- --pf-c-table--tr--m-hoverable--BoxShadow: none;
27103
- --pf-c-table--tr--m-hoverable--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
27104
- --pf-c-table--tr--m-hoverable--hover--BoxShadow: var(--pf-c-table--tr--m-hoverable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27105
- --pf-c-table--tr--m-hoverable--hover--BackgroundColor: var(--pf-global--BackgroundColor--100);
27106
- --pf-c-table--tr--m-hoverable--focus--BoxShadow: var(--pf-c-table--tr--m-hoverable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27107
- --pf-c-table--tr--m-hoverable--focus--BackgroundColor: var(--pf-global--BackgroundColor--100);
27108
- --pf-c-table--tr--m-hoverable--active--BoxShadow: var(--pf-c-table--tr--m-hoverable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27109
- --pf-c-table--tr--m-hoverable--active--BackgroundColor: var(--pf-global--BackgroundColor--100);
27110
- --pf-c-table--tr--m-hoverable--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
27105
+ --pf-c-table--tr--m-clickable--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
27106
+ --pf-c-table--tr--m-clickable--BackgroundColor: transparent;
27107
+ --pf-c-table--tr--m-clickable--BoxShadow: none;
27108
+ --pf-c-table--tr--m-clickable--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
27109
+ --pf-c-table--tr--m-clickable--hover--BoxShadow: var(--pf-c-table--tr--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27110
+ --pf-c-table--tr--m-clickable--hover--BackgroundColor: var(--pf-global--BackgroundColor--100);
27111
+ --pf-c-table--tr--m-clickable--focus--BoxShadow: var(--pf-c-table--tr--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27112
+ --pf-c-table--tr--m-clickable--focus--BackgroundColor: var(--pf-global--BackgroundColor--100);
27113
+ --pf-c-table--tr--m-clickable--active--BoxShadow: var(--pf-c-table--tr--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27114
+ --pf-c-table--tr--m-clickable--active--BackgroundColor: var(--pf-global--BackgroundColor--100);
27115
+ --pf-c-table--tr--m-clickable--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
27111
27116
  --pf-c-table--tr--m-selected--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
27112
27117
  --pf-c-table--tr--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--100);
27113
27118
  --pf-c-table--tr--m-selected--BoxShadow: var(--pf-c-table--tr--m-selected--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27114
27119
  --pf-c-table--tr--m-selected--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
27115
- --pf-c-table--tr--m-selected--after--BorderLeftWidth: var(--pf-c-table__expandable-row--after--border-width--base);
27120
+ --pf-c-table--tr--m-selected--after--BorderLeftWidth: calc(2 * var(--pf-c-table__expandable-row--after--border-width--base));
27116
27121
  --pf-c-table--tr--m-selected--after--BorderLeftColor: var(--pf-global--active-color--100);
27117
27122
  --pf-c-table--tr--m-selected--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
27118
27123
  --pf-c-table--tr--m-selected--hover--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
27119
27124
  --pf-c-table--tr--m-selected--tr--m-selected--hover--BoxShadow: var(--pf-c-table--tr--m-selected--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27120
- --pf-c-table--tbody--m-hoverable--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
27121
- --pf-c-table--tbody--m-hoverable--BoxShadow: none;
27122
- --pf-c-table--tbody--m-hoverable--BackgroundColor: transparent;
27123
- --pf-c-table--tbody--m-hoverable--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
27124
- --pf-c-table--tbody--m-hoverable--hover--BoxShadow: var(--pf-c-table--tbody--m-hoverable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27125
- --pf-c-table--tbody--m-hoverable--hover--BackgroundColor: var(--pf-global--BackgroundColor--100);
27126
- --pf-c-table--tbody--m-hoverable--focus--BoxShadow: var(--pf-c-table--tbody--m-hoverable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27127
- --pf-c-table--tbody--m-hoverable--focus--BackgroundColor: var(--pf-global--BackgroundColor--100);
27128
- --pf-c-table--tbody--m-hoverable--active--BoxShadow: var(--pf-c-table--tbody--m-hoverable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27129
- --pf-c-table--tbody--m-hoverable--active--BackgroundColor: var(--pf-global--BackgroundColor--100);
27130
- --pf-c-table--tbody--m-hoverable--m-expanded--BorderColor: var(--pf-global--active-color--400);
27131
- --pf-c-table--tbody--m-hoverable--m-selected--hover--tr--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
27125
+ --pf-c-table--tbody--m-clickable--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
27126
+ --pf-c-table--tbody--m-clickable--BoxShadow: none;
27127
+ --pf-c-table--tbody--m-clickable--BackgroundColor: transparent;
27128
+ --pf-c-table--tbody--m-clickable--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
27129
+ --pf-c-table--tbody--m-clickable--hover--BoxShadow: var(--pf-c-table--tbody--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27130
+ --pf-c-table--tbody--m-clickable--hover--BackgroundColor: var(--pf-global--BackgroundColor--100);
27131
+ --pf-c-table--tbody--m-clickable--focus--BoxShadow: var(--pf-c-table--tbody--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27132
+ --pf-c-table--tbody--m-clickable--focus--BackgroundColor: var(--pf-global--BackgroundColor--100);
27133
+ --pf-c-table--tbody--m-clickable--active--BoxShadow: var(--pf-c-table--tbody--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27134
+ --pf-c-table--tbody--m-clickable--active--BackgroundColor: var(--pf-global--BackgroundColor--100);
27135
+ --pf-c-table--tbody--m-clickable--m-expanded--BorderColor: var(--pf-global--active-color--400);
27136
+ --pf-c-table--tbody--m-clickable--m-selected--hover--tr--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
27132
27137
  --pf-c-table--tbody--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--100);
27133
27138
  --pf-c-table--tbody--m-selected--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
27134
27139
  --pf-c-table--tbody--m-selected--BoxShadow: var(--pf-c-table--tbody--m-selected--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
27135
27140
  --pf-c-table--tbody--m-selected--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
27136
- --pf-c-table--tbody--m-selected--after--BorderLeftWidth: var(--pf-c-table__expandable-row--after--border-width--base);
27141
+ --pf-c-table--tbody--m-selected--after--BorderLeftWidth: calc(2 * var(--pf-c-table__expandable-row--after--border-width--base));
27137
27142
  --pf-c-table--tbody--m-selected--after--BorderLeftColor: var(--pf-global--active-color--100);
27138
27143
  --pf-c-table--tbody--m-selected--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
27139
27144
  --pf-c-table--tbody--m-selected--hover--tbody--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
@@ -27330,6 +27335,9 @@ svg.pf-c-spinner.pf-m-xl {
27330
27335
  margin-top: var(--pf-c-table__check--input--MarginTop);
27331
27336
  vertical-align: top;
27332
27337
  }
27338
+ .pf-c-table tbody.pf-m-expanded > :first-child:not(.pf-c-table__control-row) {
27339
+ border-bottom-width: 0;
27340
+ }
27333
27341
  .pf-c-table .pf-c-table__compound-expansion-toggle, .pf-c-table .pf-c-table__compound-expansion-toggle:first-child, .pf-c-table .pf-c-table__compound-expansion-toggle:last-child {
27334
27342
  padding: 0;
27335
27343
  }
@@ -27389,26 +27397,26 @@ svg.pf-c-spinner.pf-m-xl {
27389
27397
  .pf-c-table.pf-m-no-border-rows > tbody .pf-c-table__control-row > .pf-c-table__compound-expansion-toggle:first-child > ::before {
27390
27398
  border-left-width: 0;
27391
27399
  }
27392
- .pf-c-table tr.pf-m-hoverable {
27400
+ .pf-c-table tr.pf-m-clickable {
27393
27401
  cursor: pointer;
27394
- background-color: var(--pf-c-table--tr--m-hoverable--BackgroundColor);
27395
- outline-offset: var(--pf-c-table--tr--m-hoverable--OutlineOffset);
27396
- box-shadow: var(--pf-c-table--tr--m-hoverable--BoxShadow);
27402
+ background-color: var(--pf-c-table--tr--m-clickable--BackgroundColor);
27403
+ outline-offset: var(--pf-c-table--tr--m-clickable--OutlineOffset);
27404
+ box-shadow: var(--pf-c-table--tr--m-clickable--BoxShadow);
27397
27405
  }
27398
- .pf-c-table tr.pf-m-hoverable:hover:not(.pf-m-selected) + tr.pf-m-selected, .pf-c-table tr.pf-m-hoverable:focus:not(.pf-m-selected) + tr.pf-m-selected, .pf-c-table tr.pf-m-hoverable:active:not(.pf-m-selected) + tr.pf-m-selected {
27399
- box-shadow: var(--pf-c-table--tr--m-hoverable--m-selected--BoxShadow);
27406
+ .pf-c-table tr.pf-m-clickable:hover:not(.pf-m-selected) + tr.pf-m-selected, .pf-c-table tr.pf-m-clickable:focus:not(.pf-m-selected) + tr.pf-m-selected, .pf-c-table tr.pf-m-clickable:active:not(.pf-m-selected) + tr.pf-m-selected {
27407
+ box-shadow: var(--pf-c-table--tr--m-clickable--m-selected--BoxShadow);
27400
27408
  }
27401
- .pf-c-table tr.pf-m-hoverable:hover {
27402
- --pf-c-table--tr--m-hoverable--BoxShadow: var(--pf-c-table--tr--m-hoverable--hover--BoxShadow);
27403
- --pf-c-table--tr--m-hoverable--BackgroundColor: var(--pf-c-table--tr--m-hoverable--hover--BackgroundColor);
27409
+ .pf-c-table tr.pf-m-clickable:hover {
27410
+ --pf-c-table--tr--m-clickable--BoxShadow: var(--pf-c-table--tr--m-clickable--hover--BoxShadow);
27411
+ --pf-c-table--tr--m-clickable--BackgroundColor: var(--pf-c-table--tr--m-clickable--hover--BackgroundColor);
27404
27412
  }
27405
- .pf-c-table tr.pf-m-hoverable:focus {
27406
- --pf-c-table--tr--m-hoverable--BoxShadow: var(--pf-c-table--tr--m-hoverable--focus--BoxShadow);
27407
- --pf-c-table--tr--m-hoverable--BackgroundColor: var(--pf-c-table--tr--m-hoverable--focus--BackgroundColor);
27413
+ .pf-c-table tr.pf-m-clickable:focus {
27414
+ --pf-c-table--tr--m-clickable--BoxShadow: var(--pf-c-table--tr--m-clickable--focus--BoxShadow);
27415
+ --pf-c-table--tr--m-clickable--BackgroundColor: var(--pf-c-table--tr--m-clickable--focus--BackgroundColor);
27408
27416
  }
27409
- .pf-c-table tr.pf-m-hoverable:active {
27410
- --pf-c-table--tr--m-hoverable--BoxShadow: var(--pf-c-table--tr--m-hoverable--active--BoxShadow);
27411
- --pf-c-table--tr--m-hoverable--BackgroundColor: var(--pf-c-table--tr--m-hoverable--active--BackgroundColor);
27417
+ .pf-c-table tr.pf-m-clickable:active {
27418
+ --pf-c-table--tr--m-clickable--BoxShadow: var(--pf-c-table--tr--m-clickable--active--BoxShadow);
27419
+ --pf-c-table--tr--m-clickable--BackgroundColor: var(--pf-c-table--tr--m-clickable--active--BackgroundColor);
27412
27420
  }
27413
27421
  .pf-c-table tr.pf-m-selected {
27414
27422
  --pf-c-table__expandable-row--after--BorderLeftWidth: var(--pf-c-table--tr--m-selected--after--BorderLeftWidth);
@@ -27430,29 +27438,29 @@ svg.pf-c-spinner.pf-m-xl {
27430
27438
  .pf-c-table tr.pf-m-first-cell-offset-reset {
27431
27439
  --pf-c-table--cell--first-last-child--PaddingLeft: var(--pf-c-table--tr--m-first-cell-offset-reset--cell--PaddingLeft);
27432
27440
  }
27433
- .pf-c-table tbody.pf-m-hoverable {
27441
+ .pf-c-table tbody.pf-m-clickable {
27434
27442
  cursor: pointer;
27435
- background-color: var(--pf-c-table--tbody--m-hoverable--BackgroundColor);
27436
- outline-offset: var(--pf-c-table--tbody--m-hoverable--OutlineOffset);
27437
- box-shadow: var(--pf-c-table--tbody--m-hoverable--BoxShadow);
27443
+ background-color: var(--pf-c-table--tbody--m-clickable--BackgroundColor);
27444
+ outline-offset: var(--pf-c-table--tbody--m-clickable--OutlineOffset);
27445
+ box-shadow: var(--pf-c-table--tbody--m-clickable--BoxShadow);
27438
27446
  }
27439
- .pf-c-table tbody.pf-m-hoverable.pf-m-expanded:not(.pf-m-selected) {
27440
- --pf-c-table__expandable-row--after--BorderColor: var(--pf-c-table--tbody--m-hoverable--m-expanded--BorderColor);
27447
+ .pf-c-table tbody.pf-m-clickable.pf-m-expanded:not(.pf-m-selected) {
27448
+ --pf-c-table__expandable-row--after--BorderColor: var(--pf-c-table--tbody--m-clickable--m-expanded--BorderColor);
27441
27449
  }
27442
- .pf-c-table tbody.pf-m-hoverable:hover:not(.pf-m-selected) + tbody.pf-m-selected, .pf-c-table tbody.pf-m-hoverable:focus:not(.pf-m-selected) + tbody.pf-m-selected, .pf-c-table tbody.pf-m-hoverable:active:not(.pf-m-selected) + tbody.pf-m-selected {
27443
- box-shadow: var(--pf-c-table--tbody--m-hoverable--m-selected--hover--tr--BoxShadow);
27450
+ .pf-c-table tbody.pf-m-clickable:hover:not(.pf-m-selected) + tbody.pf-m-selected, .pf-c-table tbody.pf-m-clickable:focus:not(.pf-m-selected) + tbody.pf-m-selected, .pf-c-table tbody.pf-m-clickable:active:not(.pf-m-selected) + tbody.pf-m-selected {
27451
+ box-shadow: var(--pf-c-table--tbody--m-clickable--m-selected--hover--tr--BoxShadow);
27444
27452
  }
27445
- .pf-c-table tbody.pf-m-hoverable:hover {
27446
- --pf-c-table--tbody--m-hoverable--BoxShadow: var(--pf-c-table--tbody--m-hoverable--hover--BoxShadow);
27447
- --pf-c-table--tbody--m-hoverable--BackgroundColor: var(--pf-c-table--tbody--m-hoverable--hover--BackgroundColor);
27453
+ .pf-c-table tbody.pf-m-clickable:hover {
27454
+ --pf-c-table--tbody--m-clickable--BoxShadow: var(--pf-c-table--tbody--m-clickable--hover--BoxShadow);
27455
+ --pf-c-table--tbody--m-clickable--BackgroundColor: var(--pf-c-table--tbody--m-clickable--hover--BackgroundColor);
27448
27456
  }
27449
- .pf-c-table tbody.pf-m-hoverable:focus {
27450
- --pf-c-table--tbody--m-hoverable--BoxShadow: var(--pf-c-table--tbody--m-hoverable--focus--BoxShadow);
27451
- --pf-c-table--tbody--m-hoverable--BackgroundColor: var(--pf-c-table--tbody--m-hoverable--focus--BackgroundColor);
27457
+ .pf-c-table tbody.pf-m-clickable:focus {
27458
+ --pf-c-table--tbody--m-clickable--BoxShadow: var(--pf-c-table--tbody--m-clickable--focus--BoxShadow);
27459
+ --pf-c-table--tbody--m-clickable--BackgroundColor: var(--pf-c-table--tbody--m-clickable--focus--BackgroundColor);
27452
27460
  }
27453
- .pf-c-table tbody.pf-m-hoverable:active {
27454
- --pf-c-table--tbody--m-hoverable--BoxShadow: var(--pf-c-table--tbody--m-hoverable--active--BoxShadow);
27455
- --pf-c-table--tbody--m-hoverable--BackgroundColor: var(--pf-c-table--tbody--m-hoverable--active--BackgroundColor);
27461
+ .pf-c-table tbody.pf-m-clickable:active {
27462
+ --pf-c-table--tbody--m-clickable--BoxShadow: var(--pf-c-table--tbody--m-clickable--active--BoxShadow);
27463
+ --pf-c-table--tbody--m-clickable--BackgroundColor: var(--pf-c-table--tbody--m-clickable--active--BackgroundColor);
27456
27464
  }
27457
27465
  .pf-c-table tbody.pf-m-selected {
27458
27466
  --pf-c-table__expandable-row--after--BorderLeftWidth: var(--pf-c-table--tbody--m-selected--after--BorderLeftWidth);
@@ -27820,12 +27828,6 @@ svg.pf-c-spinner.pf-m-xl {
27820
27828
  display: none;
27821
27829
  }
27822
27830
 
27823
- .pf-c-table__compound-expansion-toggle.pf-m-expanded:first-child,
27824
- .pf-c-table__expandable-row.pf-m-expanded > :first-child,
27825
- .pf-c-table tbody.pf-m-expanded > tr > :not(.pf-c-table__compound-expansion-toggle) {
27826
- --pf-c-table__expandable-row--after--BorderLeftWidth: var(--pf-c-table__expandable-row--after--border-width--base);
27827
- }
27828
-
27829
27831
  .pf-c-table .pf-c-table tr > *:first-child {
27830
27832
  --pf-c-table--cell--PaddingLeft: var(--pf-c-table--nested--first-last-child--PaddingLeft);
27831
27833
  }