@patternfly/patternfly 6.6.0-prerelease.14 → 6.6.0-prerelease.16
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/components/Banner/banner.css +3 -0
- package/components/Banner/banner.scss +4 -1
- package/components/Button/button.css +15 -1
- package/components/Button/button.scss +17 -1
- package/components/Table/table.css +26 -18
- package/components/Table/table.scss +37 -27
- package/components/_index.css +44 -19
- package/docs/components/DualListSelector/examples/DualListSelector.md +72 -72
- package/docs/components/Pagination/examples/Pagination.md +120 -120
- package/docs/components/Table/examples/Table.md +7 -0
- package/docs/components/Toolbar/examples/Toolbar.md +16 -16
- package/docs/demos/CardView/examples/CardView.md +12 -12
- package/docs/demos/Compass/examples/Compass.md +16 -16
- package/docs/demos/DataList/examples/DataList.md +48 -48
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +20 -20
- package/docs/demos/Table/examples/Table.md +160 -160
- package/docs/demos/Toolbar/examples/Toolbar.md +36 -36
- package/package.json +1 -1
- package/patternfly-no-globals.css +44 -19
- package/patternfly.css +44 -19
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -21,6 +21,7 @@
|
|
|
21
21
|
--pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
|
|
22
22
|
--pf-v6-c-banner--link--TextDecoration: underline;
|
|
23
23
|
--pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
|
|
24
|
+
--pf-v6-c-banner--link--clicked--Color: var(--pf-v6-c-banner--Color);
|
|
24
25
|
--pf-v6-c-banner--link--disabled--Color: var(--pf-t--global--text--color--disabled);
|
|
25
26
|
--pf-v6-c-banner--link--TextDecorationColor: currentcolor;
|
|
26
27
|
--pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
|
|
@@ -143,9 +144,11 @@
|
|
|
143
144
|
.pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
|
|
144
145
|
--pf-v6-c-button--m-link--m-inline--Color: var(--pf-v6-c-banner--link--Color);
|
|
145
146
|
--pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
|
|
147
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--Color: var(--pf-v6-c-banner--link--clicked--Color);
|
|
146
148
|
--pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
|
|
147
149
|
--pf-v6-c-button--m-link--m-inline--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
|
|
148
150
|
--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
|
|
151
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
|
|
149
152
|
text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
|
|
150
153
|
}
|
|
151
154
|
.pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {
|
|
@@ -22,6 +22,7 @@
|
|
|
22
22
|
--#{$banner}--link--Color: var(--#{$banner}--Color);
|
|
23
23
|
--#{$banner}--link--TextDecoration: underline;
|
|
24
24
|
--#{$banner}--link--hover--Color: var(--#{$banner}--Color);
|
|
25
|
+
--#{$banner}--link--clicked--Color: var(--#{$banner}--Color);
|
|
25
26
|
--#{$banner}--link--disabled--Color: var(--pf-t--global--text--color--disabled);
|
|
26
27
|
--#{$banner}--link--TextDecorationColor: currentcolor;
|
|
27
28
|
|
|
@@ -173,10 +174,12 @@
|
|
|
173
174
|
.#{$button}.pf-m-inline {
|
|
174
175
|
--#{$button}--m-link--m-inline--Color: var(--#{$banner}--link--Color);
|
|
175
176
|
--#{$button}--m-link--m-inline--hover--Color: var(--#{$banner}--link--hover--Color);
|
|
177
|
+
--#{$button}--m-link--m-inline--m-clicked--Color: var(--#{$banner}--link--clicked--Color);
|
|
176
178
|
--#{$button}--disabled--Color: var(--#{$banner}--link--disabled--Color);
|
|
177
179
|
--#{$button}--m-link--m-inline--TextDecorationColor: var(--#{$banner}--link--TextDecorationColor);
|
|
178
180
|
--#{$button}--m-link--m-inline--hover--TextDecorationColor: var(--#{$banner}--link--TextDecorationColor);
|
|
179
|
-
|
|
181
|
+
--#{$button}--m-link--m-inline--m-clicked--TextDecorationColor: var(--#{$banner}--link--TextDecorationColor);
|
|
182
|
+
|
|
180
183
|
text-decoration-line: var(--#{$banner}--link--TextDecoration);
|
|
181
184
|
|
|
182
185
|
&:disabled,
|
|
@@ -126,6 +126,10 @@
|
|
|
126
126
|
--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
|
|
127
127
|
--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
|
|
128
128
|
--pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
|
|
129
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor: var(--pf-t--global--text-decoration--color--hover);
|
|
130
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
|
|
131
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
|
|
132
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
|
|
129
133
|
--pf-v6-c-button--m-link--m-inline--TransitionProperty: color, text-underline-offset;
|
|
130
134
|
--pf-v6-c-button--m-link--m-inline--TransitionDuration: var(--pf-t--global--motion--duration--fade--default), var(--pf-t--global--motion--duration--lg);
|
|
131
135
|
--pf-v6-c-button--m-link--m-inline--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate), var(--pf-t--global--motion--timing-function--default);
|
|
@@ -140,6 +144,8 @@
|
|
|
140
144
|
--pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
|
|
141
145
|
--pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
|
|
142
146
|
--pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
|
|
147
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
|
|
148
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
|
|
143
149
|
--pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
|
|
144
150
|
--pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
145
151
|
--pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
@@ -512,9 +518,14 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
|
512
518
|
--pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
|
|
513
519
|
--pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
|
|
514
520
|
--pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
|
|
515
|
-
--pf-v6-c-button--
|
|
521
|
+
--pf-v6-c-button--m-clicked--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationLine);
|
|
522
|
+
--pf-v6-c-button--m-clicked--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationStyle);
|
|
523
|
+
--pf-v6-c-button--m-clicked--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor);
|
|
524
|
+
--pf-v6-c-button--m-clicked--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset);
|
|
516
525
|
--pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
|
|
517
526
|
--pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
|
|
527
|
+
--pf-v6-c-button--m-link--m-clicked--Color: var(--pf-v6-c-button--m-link--m-inline--m-clicked--Color);
|
|
528
|
+
--pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-v6-c-button--m-link--m-inline--m-clicked__icon--Color);
|
|
518
529
|
--pf-v6-c-button--BorderWidth: 0;
|
|
519
530
|
--pf-v6-c-button--hover--BorderWidth: 0;
|
|
520
531
|
--pf-v6-c-button--m-clicked--BorderWidth: 0;
|
|
@@ -527,6 +538,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
|
527
538
|
.pf-v6-c-button.pf-m-link.pf-m-inline:hover, .pf-v6-c-button.pf-m-link.pf-m-inline:focus {
|
|
528
539
|
--pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset);
|
|
529
540
|
}
|
|
541
|
+
.pf-v6-c-button.pf-m-link.pf-m-inline:active, .pf-v6-c-button.pf-m-link.pf-m-inline.pf-m-clicked {
|
|
542
|
+
--pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset);
|
|
543
|
+
}
|
|
530
544
|
.pf-v6-c-button.pf-m-link.pf-m-danger {
|
|
531
545
|
--pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-link--m-danger--Color);
|
|
532
546
|
--pf-v6-c-button--m-danger--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--BackgroundColor);
|
|
@@ -144,6 +144,10 @@
|
|
|
144
144
|
--#{$button}--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
|
|
145
145
|
--#{$button}--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
|
|
146
146
|
--#{$button}--m-link--m-inline--hover--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
|
|
147
|
+
--#{$button}--m-link--m-inline--m-clicked--TextDecorationColor: var(--pf-t--global--text-decoration--color--hover);
|
|
148
|
+
--#{$button}--m-link--m-inline--m-clicked--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
|
|
149
|
+
--#{$button}--m-link--m-inline--m-clicked--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
|
|
150
|
+
--#{$button}--m-link--m-inline--m-clicked--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
|
|
147
151
|
--#{$button}--m-link--m-inline--TransitionProperty: color, text-underline-offset;
|
|
148
152
|
--#{$button}--m-link--m-inline--TransitionDuration: var(--pf-t--global--motion--duration--fade--default), var(--pf-t--global--motion--duration--lg);
|
|
149
153
|
--#{$button}--m-link--m-inline--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate), var(--pf-t--global--motion--timing-function--default);
|
|
@@ -158,6 +162,8 @@
|
|
|
158
162
|
--#{$button}--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
|
|
159
163
|
--#{$button}--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
|
|
160
164
|
--#{$button}--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
|
|
165
|
+
--#{$button}--m-link--m-inline--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
|
|
166
|
+
--#{$button}--m-link--m-inline--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
|
|
161
167
|
|
|
162
168
|
// Plain
|
|
163
169
|
--#{$button}--m-plain--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
|
|
@@ -588,9 +594,14 @@
|
|
|
588
594
|
--#{$button}--hover--TextDecorationLine: var(--#{$button}--m-link--m-inline--hover--TextDecorationLine);
|
|
589
595
|
--#{$button}--hover--TextDecorationStyle: var(--#{$button}--m-link--m-inline--hover--TextDecorationStyle);
|
|
590
596
|
--#{$button}--hover--TextDecorationColor: var(--#{$button}--m-link--m-inline--hover--TextDecorationColor);
|
|
591
|
-
--#{$button}--
|
|
597
|
+
--#{$button}--m-clicked--TextDecorationLine: var(--#{$button}--m-link--m-inline--m-clicked--TextDecorationLine);
|
|
598
|
+
--#{$button}--m-clicked--TextDecorationStyle: var(--#{$button}--m-link--m-inline--m-clicked--TextDecorationStyle);
|
|
599
|
+
--#{$button}--m-clicked--TextDecorationColor: var(--#{$button}--m-link--m-inline--m-clicked--TextDecorationColor);
|
|
600
|
+
--#{$button}--m-clicked--TextUnderlineOffset: var(--#{$button}--m-link--m-inline--m-clicked--TextUnderlineOffset);
|
|
592
601
|
--#{$button}--m-link--hover--Color: var(--#{$button}--m-link--m-inline--hover--Color);
|
|
593
602
|
--#{$button}--m-link--hover__icon--Color: var(--#{$button}--m-link--m-inline--hover__icon--Color);
|
|
603
|
+
--#{$button}--m-link--m-clicked--Color: var(--#{$button}--m-link--m-inline--m-clicked--Color);
|
|
604
|
+
--#{$button}--m-link--m-clicked__icon--Color: var(--#{$button}--m-link--m-inline--m-clicked__icon--Color);
|
|
594
605
|
--#{$button}--BorderWidth: 0;
|
|
595
606
|
--#{$button}--hover--BorderWidth: 0;
|
|
596
607
|
--#{$button}--m-clicked--BorderWidth: 0;
|
|
@@ -605,6 +616,11 @@
|
|
|
605
616
|
&:focus {
|
|
606
617
|
--#{$button}--m-link--m-inline--TextUnderlineOffset: var(--#{$button}--m-link--m-inline--hover--TextUnderlineOffset);
|
|
607
618
|
}
|
|
619
|
+
|
|
620
|
+
&:active,
|
|
621
|
+
&.pf-m-clicked {
|
|
622
|
+
--#{$button}--m-link--m-inline--TextUnderlineOffset: var(--#{$button}--m-link--m-inline--m-clicked--TextUnderlineOffset);
|
|
623
|
+
}
|
|
608
624
|
}
|
|
609
625
|
|
|
610
626
|
&.pf-m-danger {
|
|
@@ -155,7 +155,7 @@
|
|
|
155
155
|
--pf-v6-c-table__tbody--m-selected--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
|
|
156
156
|
--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndWidth: var(--pf-v6-c-table--border-width--base);
|
|
157
157
|
--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndColor: var(--pf-v6-c-table--BorderColor);
|
|
158
|
-
--pf-v6-c-table__thead--m-nested-column-header--after--ZIndex:
|
|
158
|
+
--pf-v6-c-table__thead--m-nested-column-header--after--ZIndex: initial;
|
|
159
159
|
--pf-v6-c-table__thead--m-nested-column-header--button--OutlineOffset: -0.1875rem;
|
|
160
160
|
--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockStart: var(--pf-t--global--spacer--xs);
|
|
161
161
|
--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
|
@@ -198,16 +198,13 @@
|
|
|
198
198
|
.pf-v6-c-table.pf-m-fixed {
|
|
199
199
|
table-layout: fixed;
|
|
200
200
|
}
|
|
201
|
-
.pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead::
|
|
201
|
+
.pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead .pf-v6-c-table__th::after {
|
|
202
202
|
opacity: 0;
|
|
203
203
|
transition-timing-function: var(--pf-v6-c-table--m-sticky-header--TransitionTimingFunction--BackgroundColor);
|
|
204
204
|
transition-duration: var(--pf-v6-c-table--m-sticky-header--TransitionDuration--BackgroundColor);
|
|
205
205
|
transition-property: opacity;
|
|
206
206
|
}
|
|
207
|
-
.pf-v6-c-table.pf-m-sticky-header, .pf-v6-c-table.pf-m-sticky-header-stuck {
|
|
208
|
-
--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndWidth: 0;
|
|
209
|
-
}
|
|
210
|
-
.pf-v6-c-table.pf-m-sticky-header-stuck > .pf-v6-c-table__thead::before, .pf-v6-c-table.pf-m-sticky-header-stuck > .pf-v6-c-table__thead::after {
|
|
207
|
+
.pf-v6-c-table.pf-m-sticky-header-stuck > .pf-v6-c-table__thead::after, .pf-v6-c-table.pf-m-sticky-header-stuck > .pf-v6-c-table__thead .pf-v6-c-table__th::after {
|
|
211
208
|
opacity: 1;
|
|
212
209
|
}
|
|
213
210
|
.pf-v6-c-table.pf-m-sticky-header, .pf-v6-c-table.pf-m-sticky-header-base {
|
|
@@ -218,27 +215,39 @@
|
|
|
218
215
|
inset-block-start: 0;
|
|
219
216
|
z-index: var(--pf-v6-c-table--m-sticky-header--ZIndex);
|
|
220
217
|
}
|
|
221
|
-
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead::
|
|
218
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead::after {
|
|
222
219
|
position: absolute;
|
|
223
220
|
inset: 0;
|
|
224
221
|
z-index: -1;
|
|
225
222
|
pointer-events: none;
|
|
226
223
|
content: "";
|
|
227
|
-
background-color: var(--pf-v6-c-table--m-sticky-header--BackgroundColor);
|
|
228
224
|
border-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
229
225
|
box-shadow: var(--pf-v6-c-table--m-sticky-header--BoxShadow);
|
|
230
226
|
}
|
|
231
|
-
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead
|
|
232
|
-
z-index: var(--pf-v6-c-table--m-sticky-header--cell--ZIndex);
|
|
233
|
-
}
|
|
234
|
-
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead::after {
|
|
227
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead .pf-v6-c-table__th::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead .pf-v6-c-table__th::after {
|
|
235
228
|
position: absolute;
|
|
236
229
|
inset: 0;
|
|
237
|
-
z-index:
|
|
230
|
+
z-index: -1;
|
|
238
231
|
pointer-events: none;
|
|
239
232
|
content: "";
|
|
233
|
+
background-color: var(--pf-v6-c-table--m-sticky-header--BackgroundColor);
|
|
240
234
|
border-block-end: var(--pf-v6-c-table--m-sticky-header--BorderBlockEndWidth) solid var(--pf-v6-c-table--m-sticky-header--BorderBlockEndColor);
|
|
241
235
|
}
|
|
236
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead .pf-v6-c-table__th:first-child::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead .pf-v6-c-table__th:first-child::after {
|
|
237
|
+
border-start-start-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
238
|
+
border-end-start-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
239
|
+
}
|
|
240
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead .pf-v6-c-table__th:last-child::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead .pf-v6-c-table__th:last-child::after {
|
|
241
|
+
border-start-end-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
242
|
+
border-end-end-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
243
|
+
}
|
|
244
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead > :where(th, td), .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead > :where(th, td) {
|
|
245
|
+
z-index: var(--pf-v6-c-table--m-sticky-header--cell--ZIndex);
|
|
246
|
+
}
|
|
247
|
+
:where(.pf-v6-theme-glass) .pf-v6-c-table.pf-m-sticky-header .pf-m-nested-column-header, :where(.pf-v6-theme-glass) .pf-v6-c-table.pf-m-sticky-header-base .pf-m-nested-column-header {
|
|
248
|
+
--pf-v6-c-table--m-sticky-header--BorderRadius: 0;
|
|
249
|
+
--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndWidth: 0;
|
|
250
|
+
}
|
|
242
251
|
.pf-v6-c-table:not(.pf-m-sticky-header) > .pf-m-nested-column-header tr:where(.pf-v6-c-table__tr):not(:last-child) {
|
|
243
252
|
border-block-end: 0;
|
|
244
253
|
}
|
|
@@ -949,14 +958,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
949
958
|
vertical-align: bottom;
|
|
950
959
|
}
|
|
951
960
|
.pf-v6-c-table__thead.pf-m-nested-column-header {
|
|
961
|
+
--pf-v6-c-table--m-sticky-header--BorderBlockEndWidth: 0;
|
|
952
962
|
position: relative;
|
|
953
963
|
}
|
|
954
|
-
.pf-v6-c-table__thead.pf-m-nested-column-header
|
|
955
|
-
position: absolute;
|
|
956
|
-
inset: 0;
|
|
964
|
+
.pf-v6-c-table__thead.pf-m-nested-column-header .pf-v6-c-table__tr:last-child:not(.pf-m-border-row) {
|
|
957
965
|
z-index: var(--pf-v6-c-table__thead--m-nested-column-header--after--ZIndex);
|
|
958
966
|
pointer-events: none;
|
|
959
|
-
content: "";
|
|
960
967
|
border-block-end: var(--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndWidth) solid var(--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndColor);
|
|
961
968
|
}
|
|
962
969
|
.pf-v6-c-table__thead.pf-m-nested-column-header .pf-v6-c-table__button {
|
|
@@ -997,7 +1004,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
997
1004
|
border-block-end: 0;
|
|
998
1005
|
}
|
|
999
1006
|
.pf-v6-c-table__tr.pf-m-border-row {
|
|
1000
|
-
|
|
1007
|
+
height: var(--pf-v6-c-table--border-width--base);
|
|
1008
|
+
background-color: var(--pf-v6-c-table--BorderColor);
|
|
1001
1009
|
}
|
|
1002
1010
|
|
|
1003
1011
|
.pf-v6-c-table__tfoot {
|
|
@@ -241,7 +241,7 @@
|
|
|
241
241
|
// * Table nested column header
|
|
242
242
|
--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth: var(--#{$table}--border-width--base);
|
|
243
243
|
--#{$table}__thead--m-nested-column-header--BorderBlockEndColor: var(--#{$table}--BorderColor);
|
|
244
|
-
--#{$table}__thead--m-nested-column-header--after--ZIndex:
|
|
244
|
+
--#{$table}__thead--m-nested-column-header--after--ZIndex: initial;
|
|
245
245
|
--#{$table}__thead--m-nested-column-header--button--OutlineOffset: #{pf-size-prem(-3px)};
|
|
246
246
|
--#{$table}__thead--m-nested-column-header__tr--PaddingBlockStart: var(--pf-t--global--spacer--xs);
|
|
247
247
|
--#{$table}__thead--m-nested-column-header__tr--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
|
@@ -301,8 +301,8 @@
|
|
|
301
301
|
table-layout: fixed;
|
|
302
302
|
}
|
|
303
303
|
|
|
304
|
-
&.pf-m-sticky-header-base > .#{$table}__thead
|
|
305
|
-
|
|
304
|
+
&.pf-m-sticky-header-base > .#{$table}__thead,
|
|
305
|
+
&.pf-m-sticky-header-base > .#{$table}__thead .#{$table}__th {
|
|
306
306
|
&::after {
|
|
307
307
|
opacity: 0;
|
|
308
308
|
transition-timing-function: var(--#{$table}--m-sticky-header--TransitionTimingFunction--BackgroundColor);
|
|
@@ -311,13 +311,8 @@
|
|
|
311
311
|
}
|
|
312
312
|
}
|
|
313
313
|
|
|
314
|
-
&.pf-m-sticky-header,
|
|
315
|
-
&.pf-m-sticky-header-stuck {
|
|
316
|
-
--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth: 0;
|
|
317
|
-
}
|
|
318
|
-
|
|
319
|
-
&.pf-m-sticky-header-stuck > .#{$table}__thead {
|
|
320
|
-
&::before,
|
|
314
|
+
&.pf-m-sticky-header-stuck > .#{$table}__thead,
|
|
315
|
+
&.pf-m-sticky-header-stuck > .#{$table}__thead .#{$table}__th {
|
|
321
316
|
&::after {
|
|
322
317
|
opacity: 1;
|
|
323
318
|
}
|
|
@@ -332,32 +327,47 @@
|
|
|
332
327
|
inset-block-start: 0;
|
|
333
328
|
z-index: var(--#{$table}--m-sticky-header--ZIndex);
|
|
334
329
|
|
|
335
|
-
&::
|
|
330
|
+
&::after {
|
|
336
331
|
position: absolute;
|
|
337
332
|
inset: 0;
|
|
338
333
|
z-index: -1;
|
|
339
334
|
pointer-events: none;
|
|
340
335
|
content: '';
|
|
341
|
-
background-color: var(--#{$table}--m-sticky-header--BackgroundColor);
|
|
342
336
|
border-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
343
337
|
box-shadow: var(--#{$table}--m-sticky-header--BoxShadow);
|
|
344
338
|
}
|
|
339
|
+
|
|
340
|
+
|
|
341
|
+
.#{$table}__th::after {
|
|
342
|
+
position: absolute;
|
|
343
|
+
inset: 0;
|
|
344
|
+
z-index: -1;
|
|
345
|
+
pointer-events: none;
|
|
346
|
+
content: '';
|
|
347
|
+
background-color: var(--#{$table}--m-sticky-header--BackgroundColor);
|
|
348
|
+
border-block-end: var(--#{$table}--m-sticky-header--BorderBlockEndWidth) solid var(--#{$table}--m-sticky-header--BorderBlockEndColor);
|
|
349
|
+
}
|
|
350
|
+
|
|
351
|
+
.#{$table}__th:first-child::after {
|
|
352
|
+
border-start-start-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
353
|
+
border-end-start-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
.#{$table}__th:last-child::after {
|
|
357
|
+
border-start-end-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
358
|
+
border-end-end-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
359
|
+
}
|
|
345
360
|
|
|
346
361
|
> :where(th, td) {
|
|
347
362
|
z-index: var(--#{$table}--m-sticky-header--cell--ZIndex); // set z-index here to allow sticky column to override
|
|
348
363
|
}
|
|
349
364
|
}
|
|
350
|
-
}
|
|
351
365
|
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
z-index: var(--#{$table}--m-sticky-header--border--ZIndex);
|
|
358
|
-
pointer-events: none;
|
|
359
|
-
content: '';
|
|
360
|
-
border-block-end: var(--#{$table}--m-sticky-header--BorderBlockEndWidth) solid var(--#{$table}--m-sticky-header--BorderBlockEndColor);
|
|
366
|
+
:where(.pf-v6-theme-glass) & {
|
|
367
|
+
.pf-m-nested-column-header {
|
|
368
|
+
--#{$table}--m-sticky-header--BorderRadius: 0;
|
|
369
|
+
--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth: 0;
|
|
370
|
+
}
|
|
361
371
|
}
|
|
362
372
|
}
|
|
363
373
|
|
|
@@ -1288,14 +1298,13 @@
|
|
|
1288
1298
|
|
|
1289
1299
|
// - Table nested column header button
|
|
1290
1300
|
&.pf-m-nested-column-header {
|
|
1301
|
+
--#{$table}--m-sticky-header--BorderBlockEndWidth: 0;
|
|
1302
|
+
|
|
1291
1303
|
position: relative;
|
|
1292
1304
|
|
|
1293
|
-
|
|
1294
|
-
position: absolute;
|
|
1295
|
-
inset: 0;
|
|
1305
|
+
.#{$table}__tr:last-child:not(.pf-m-border-row) {
|
|
1296
1306
|
z-index: var(--#{$table}__thead--m-nested-column-header--after--ZIndex);
|
|
1297
1307
|
pointer-events: none;
|
|
1298
|
-
content: '';
|
|
1299
1308
|
border-block-end: var(--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth) solid var(--#{$table}__thead--m-nested-column-header--BorderBlockEndColor);
|
|
1300
1309
|
}
|
|
1301
1310
|
|
|
@@ -1359,7 +1368,8 @@
|
|
|
1359
1368
|
}
|
|
1360
1369
|
|
|
1361
1370
|
&.pf-m-border-row {
|
|
1362
|
-
|
|
1371
|
+
height: var(--#{$table}--border-width--base);
|
|
1372
|
+
background-color: var(--#{$table}--BorderColor);
|
|
1363
1373
|
}
|
|
1364
1374
|
}
|
|
1365
1375
|
|
package/components/_index.css
CHANGED
|
@@ -1457,6 +1457,7 @@ div.pf-v6-c-avatar {
|
|
|
1457
1457
|
--pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
|
|
1458
1458
|
--pf-v6-c-banner--link--TextDecoration: underline;
|
|
1459
1459
|
--pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
|
|
1460
|
+
--pf-v6-c-banner--link--clicked--Color: var(--pf-v6-c-banner--Color);
|
|
1460
1461
|
--pf-v6-c-banner--link--disabled--Color: var(--pf-t--global--text--color--disabled);
|
|
1461
1462
|
--pf-v6-c-banner--link--TextDecorationColor: currentcolor;
|
|
1462
1463
|
--pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
|
|
@@ -1579,9 +1580,11 @@ div.pf-v6-c-avatar {
|
|
|
1579
1580
|
.pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
|
|
1580
1581
|
--pf-v6-c-button--m-link--m-inline--Color: var(--pf-v6-c-banner--link--Color);
|
|
1581
1582
|
--pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
|
|
1583
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--Color: var(--pf-v6-c-banner--link--clicked--Color);
|
|
1582
1584
|
--pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
|
|
1583
1585
|
--pf-v6-c-button--m-link--m-inline--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
|
|
1584
1586
|
--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
|
|
1587
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
|
|
1585
1588
|
text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
|
|
1586
1589
|
}
|
|
1587
1590
|
.pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {
|
|
@@ -1898,6 +1901,10 @@ button.pf-v6-c-breadcrumb__link {
|
|
|
1898
1901
|
--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
|
|
1899
1902
|
--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
|
|
1900
1903
|
--pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
|
|
1904
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor: var(--pf-t--global--text-decoration--color--hover);
|
|
1905
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
|
|
1906
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
|
|
1907
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
|
|
1901
1908
|
--pf-v6-c-button--m-link--m-inline--TransitionProperty: color, text-underline-offset;
|
|
1902
1909
|
--pf-v6-c-button--m-link--m-inline--TransitionDuration: var(--pf-t--global--motion--duration--fade--default), var(--pf-t--global--motion--duration--lg);
|
|
1903
1910
|
--pf-v6-c-button--m-link--m-inline--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate), var(--pf-t--global--motion--timing-function--default);
|
|
@@ -1912,6 +1919,8 @@ button.pf-v6-c-breadcrumb__link {
|
|
|
1912
1919
|
--pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
|
|
1913
1920
|
--pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
|
|
1914
1921
|
--pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
|
|
1922
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
|
|
1923
|
+
--pf-v6-c-button--m-link--m-inline--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
|
|
1915
1924
|
--pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
|
|
1916
1925
|
--pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
1917
1926
|
--pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
@@ -2284,9 +2293,14 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
|
2284
2293
|
--pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
|
|
2285
2294
|
--pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
|
|
2286
2295
|
--pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
|
|
2287
|
-
--pf-v6-c-button--
|
|
2296
|
+
--pf-v6-c-button--m-clicked--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationLine);
|
|
2297
|
+
--pf-v6-c-button--m-clicked--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationStyle);
|
|
2298
|
+
--pf-v6-c-button--m-clicked--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor);
|
|
2299
|
+
--pf-v6-c-button--m-clicked--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset);
|
|
2288
2300
|
--pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
|
|
2289
2301
|
--pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
|
|
2302
|
+
--pf-v6-c-button--m-link--m-clicked--Color: var(--pf-v6-c-button--m-link--m-inline--m-clicked--Color);
|
|
2303
|
+
--pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-v6-c-button--m-link--m-inline--m-clicked__icon--Color);
|
|
2290
2304
|
--pf-v6-c-button--BorderWidth: 0;
|
|
2291
2305
|
--pf-v6-c-button--hover--BorderWidth: 0;
|
|
2292
2306
|
--pf-v6-c-button--m-clicked--BorderWidth: 0;
|
|
@@ -2299,6 +2313,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
|
2299
2313
|
.pf-v6-c-button.pf-m-link.pf-m-inline:hover, .pf-v6-c-button.pf-m-link.pf-m-inline:focus {
|
|
2300
2314
|
--pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset);
|
|
2301
2315
|
}
|
|
2316
|
+
.pf-v6-c-button.pf-m-link.pf-m-inline:active, .pf-v6-c-button.pf-m-link.pf-m-inline.pf-m-clicked {
|
|
2317
|
+
--pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset);
|
|
2318
|
+
}
|
|
2302
2319
|
.pf-v6-c-button.pf-m-link.pf-m-danger {
|
|
2303
2320
|
--pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-link--m-danger--Color);
|
|
2304
2321
|
--pf-v6-c-button--m-danger--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--BackgroundColor);
|
|
@@ -19612,7 +19629,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
|
19612
19629
|
--pf-v6-c-table__tbody--m-selected--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
|
|
19613
19630
|
--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndWidth: var(--pf-v6-c-table--border-width--base);
|
|
19614
19631
|
--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndColor: var(--pf-v6-c-table--BorderColor);
|
|
19615
|
-
--pf-v6-c-table__thead--m-nested-column-header--after--ZIndex:
|
|
19632
|
+
--pf-v6-c-table__thead--m-nested-column-header--after--ZIndex: initial;
|
|
19616
19633
|
--pf-v6-c-table__thead--m-nested-column-header--button--OutlineOffset: -0.1875rem;
|
|
19617
19634
|
--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockStart: var(--pf-t--global--spacer--xs);
|
|
19618
19635
|
--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
|
@@ -19655,16 +19672,13 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
|
19655
19672
|
.pf-v6-c-table.pf-m-fixed {
|
|
19656
19673
|
table-layout: fixed;
|
|
19657
19674
|
}
|
|
19658
|
-
.pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead::
|
|
19675
|
+
.pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead .pf-v6-c-table__th::after {
|
|
19659
19676
|
opacity: 0;
|
|
19660
19677
|
transition-timing-function: var(--pf-v6-c-table--m-sticky-header--TransitionTimingFunction--BackgroundColor);
|
|
19661
19678
|
transition-duration: var(--pf-v6-c-table--m-sticky-header--TransitionDuration--BackgroundColor);
|
|
19662
19679
|
transition-property: opacity;
|
|
19663
19680
|
}
|
|
19664
|
-
.pf-v6-c-table.pf-m-sticky-header, .pf-v6-c-table.pf-m-sticky-header-stuck {
|
|
19665
|
-
--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndWidth: 0;
|
|
19666
|
-
}
|
|
19667
|
-
.pf-v6-c-table.pf-m-sticky-header-stuck > .pf-v6-c-table__thead::before, .pf-v6-c-table.pf-m-sticky-header-stuck > .pf-v6-c-table__thead::after {
|
|
19681
|
+
.pf-v6-c-table.pf-m-sticky-header-stuck > .pf-v6-c-table__thead::after, .pf-v6-c-table.pf-m-sticky-header-stuck > .pf-v6-c-table__thead .pf-v6-c-table__th::after {
|
|
19668
19682
|
opacity: 1;
|
|
19669
19683
|
}
|
|
19670
19684
|
.pf-v6-c-table.pf-m-sticky-header, .pf-v6-c-table.pf-m-sticky-header-base {
|
|
@@ -19675,27 +19689,39 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
|
19675
19689
|
inset-block-start: 0;
|
|
19676
19690
|
z-index: var(--pf-v6-c-table--m-sticky-header--ZIndex);
|
|
19677
19691
|
}
|
|
19678
|
-
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead::
|
|
19692
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead::after {
|
|
19679
19693
|
position: absolute;
|
|
19680
19694
|
inset: 0;
|
|
19681
19695
|
z-index: -1;
|
|
19682
19696
|
pointer-events: none;
|
|
19683
19697
|
content: "";
|
|
19684
|
-
background-color: var(--pf-v6-c-table--m-sticky-header--BackgroundColor);
|
|
19685
19698
|
border-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
19686
19699
|
box-shadow: var(--pf-v6-c-table--m-sticky-header--BoxShadow);
|
|
19687
19700
|
}
|
|
19688
|
-
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead
|
|
19689
|
-
z-index: var(--pf-v6-c-table--m-sticky-header--cell--ZIndex);
|
|
19690
|
-
}
|
|
19691
|
-
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead::after {
|
|
19701
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead .pf-v6-c-table__th::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead .pf-v6-c-table__th::after {
|
|
19692
19702
|
position: absolute;
|
|
19693
19703
|
inset: 0;
|
|
19694
|
-
z-index:
|
|
19704
|
+
z-index: -1;
|
|
19695
19705
|
pointer-events: none;
|
|
19696
19706
|
content: "";
|
|
19707
|
+
background-color: var(--pf-v6-c-table--m-sticky-header--BackgroundColor);
|
|
19697
19708
|
border-block-end: var(--pf-v6-c-table--m-sticky-header--BorderBlockEndWidth) solid var(--pf-v6-c-table--m-sticky-header--BorderBlockEndColor);
|
|
19698
19709
|
}
|
|
19710
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead .pf-v6-c-table__th:first-child::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead .pf-v6-c-table__th:first-child::after {
|
|
19711
|
+
border-start-start-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
19712
|
+
border-end-start-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
19713
|
+
}
|
|
19714
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead .pf-v6-c-table__th:last-child::after, .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead .pf-v6-c-table__th:last-child::after {
|
|
19715
|
+
border-start-end-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
19716
|
+
border-end-end-radius: var(--pf-v6-c-table--m-sticky-header--BorderRadius);
|
|
19717
|
+
}
|
|
19718
|
+
.pf-v6-c-table.pf-m-sticky-header > .pf-v6-c-table__thead > :where(th, td), .pf-v6-c-table.pf-m-sticky-header-base > .pf-v6-c-table__thead > :where(th, td) {
|
|
19719
|
+
z-index: var(--pf-v6-c-table--m-sticky-header--cell--ZIndex);
|
|
19720
|
+
}
|
|
19721
|
+
:where(.pf-v6-theme-glass) .pf-v6-c-table.pf-m-sticky-header .pf-m-nested-column-header, :where(.pf-v6-theme-glass) .pf-v6-c-table.pf-m-sticky-header-base .pf-m-nested-column-header {
|
|
19722
|
+
--pf-v6-c-table--m-sticky-header--BorderRadius: 0;
|
|
19723
|
+
--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndWidth: 0;
|
|
19724
|
+
}
|
|
19699
19725
|
.pf-v6-c-table:not(.pf-m-sticky-header) > .pf-m-nested-column-header tr:where(.pf-v6-c-table__tr):not(:last-child) {
|
|
19700
19726
|
border-block-end: 0;
|
|
19701
19727
|
}
|
|
@@ -20406,14 +20432,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
20406
20432
|
vertical-align: bottom;
|
|
20407
20433
|
}
|
|
20408
20434
|
.pf-v6-c-table__thead.pf-m-nested-column-header {
|
|
20435
|
+
--pf-v6-c-table--m-sticky-header--BorderBlockEndWidth: 0;
|
|
20409
20436
|
position: relative;
|
|
20410
20437
|
}
|
|
20411
|
-
.pf-v6-c-table__thead.pf-m-nested-column-header
|
|
20412
|
-
position: absolute;
|
|
20413
|
-
inset: 0;
|
|
20438
|
+
.pf-v6-c-table__thead.pf-m-nested-column-header .pf-v6-c-table__tr:last-child:not(.pf-m-border-row) {
|
|
20414
20439
|
z-index: var(--pf-v6-c-table__thead--m-nested-column-header--after--ZIndex);
|
|
20415
20440
|
pointer-events: none;
|
|
20416
|
-
content: "";
|
|
20417
20441
|
border-block-end: var(--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndWidth) solid var(--pf-v6-c-table__thead--m-nested-column-header--BorderBlockEndColor);
|
|
20418
20442
|
}
|
|
20419
20443
|
.pf-v6-c-table__thead.pf-m-nested-column-header .pf-v6-c-table__button {
|
|
@@ -20454,7 +20478,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
20454
20478
|
border-block-end: 0;
|
|
20455
20479
|
}
|
|
20456
20480
|
.pf-v6-c-table__tr.pf-m-border-row {
|
|
20457
|
-
|
|
20481
|
+
height: var(--pf-v6-c-table--border-width--base);
|
|
20482
|
+
background-color: var(--pf-v6-c-table--BorderColor);
|
|
20458
20483
|
}
|
|
20459
20484
|
|
|
20460
20485
|
.pf-v6-c-table__tfoot {
|