@patternfly/react-styles 6.2.2 → 6.3.0-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 +4 -10
- package/css/assets/images/icon-help.hbs +3 -0
- package/css/assets/images/icon-outlined-star.hbs +3 -0
- package/css/assets/images/icon-star.hbs +3 -0
- package/css/components/Accordion/accordion.css +71 -1
- package/css/components/Alert/alert-group.css +52 -31
- package/css/components/Alert/alert-group.d.ts +4 -1
- package/css/components/Alert/alert-group.js +4 -1
- package/css/components/Alert/alert-group.mjs +4 -1
- package/css/components/Button/button.css +27 -0
- package/css/components/Button/button.d.ts +3 -0
- package/css/components/Button/button.js +3 -0
- package/css/components/Button/button.mjs +3 -0
- package/css/components/Card/card.css +3 -0
- package/css/components/Drawer/drawer.css +28 -14
- package/css/components/ExpandableSection/expandable-section.css +46 -0
- package/css/components/FormControl/form-control.css +1 -2
- package/css/components/MenuToggle/menu-toggle.css +8 -4
- package/css/components/Skeleton/skeleton.css +22 -2
- package/css/components/Table/table.css +33 -0
- package/css/components/Tabs/tabs.css +65 -0
- package/css/components/Tabs/tabs.d.ts +2 -1
- package/css/components/Tabs/tabs.js +2 -1
- package/css/components/Tabs/tabs.mjs +2 -1
- package/css/components/Timestamp/timestamp.css +4 -0
- package/css/components/Timestamp/timestamp.d.ts +2 -1
- package/css/components/Timestamp/timestamp.js +2 -1
- package/css/components/Timestamp/timestamp.mjs +2 -1
- package/css/components/TreeView/tree-view.css +33 -0
- package/css/components/TreeView/tree-view.d.ts +1 -0
- package/css/components/TreeView/tree-view.js +1 -0
- package/css/components/TreeView/tree-view.mjs +1 -0
- package/css/components/Truncate/truncate.css +6 -0
- package/css/components/Truncate/truncate.d.ts +3 -0
- package/css/components/Truncate/truncate.js +3 -0
- package/css/components/Truncate/truncate.mjs +3 -0
- package/css/components/_index.css +398 -54
- package/css/components/_index.d.ts +8 -0
- package/css/components/_index.js +8 -0
- package/css/components/_index.mjs +8 -0
- package/package.json +3 -3
@@ -205,6 +205,7 @@
|
|
205
205
|
--pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
|
206
206
|
--pf-v6-c-accordion__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
|
207
207
|
--pf-v6-c-accordion__toggle--BorderRadius: var(--pf-t--global--border--radius--small);
|
208
|
+
--pf-v6-c-accordion__toggle--ZIndex: var(--pf-t--global--z-index--xs);
|
208
209
|
--pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
|
209
210
|
--pf-v6-c-accordion__toggle-text--Color: var(--pf-t--global--text--color--regular);
|
210
211
|
--pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--default);
|
@@ -222,6 +223,24 @@
|
|
222
223
|
--pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular);
|
223
224
|
--pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
|
224
225
|
--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem;
|
226
|
+
--pf-v6-c-accordion__item--before--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
|
227
|
+
--pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
|
228
|
+
--pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade);
|
229
|
+
--pf-v6-c-accordion__item--before--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
230
|
+
--pf-v6-c-accordion__item--before--Opacity: 0;
|
231
|
+
--pf-v6-c-accordion__item--m-expanded--before--Opacity: 1;
|
232
|
+
--pf-v6-c-accordion__item--m-expanded--before--TranslateY: 0;
|
233
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide: 0s;
|
234
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
|
235
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide: 0s;
|
236
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
|
237
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--slide: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide);
|
238
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--fade);
|
239
|
+
--pf-v6-c-accordion__expandable-content--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
240
|
+
--pf-v6-c-accordion__expandable-content--Opacity: 0;
|
241
|
+
--pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity: 1;
|
242
|
+
--pf-v6-c-accordion__expandable-content--TranslateY: 0;
|
243
|
+
--pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY: 0;
|
225
244
|
--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
226
245
|
--pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
227
246
|
--pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
|
@@ -241,6 +260,16 @@
|
|
241
260
|
--pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
|
242
261
|
--pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor: var(--pf-t--global--border--color--default);
|
243
262
|
}
|
263
|
+
@media screen and (prefers-reduced-motion: no-preference) {
|
264
|
+
.pf-v6-c-accordion {
|
265
|
+
--pf-v6-c-accordion__item--before--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
|
266
|
+
--pf-v6-c-accordion__item--before--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
|
267
|
+
--pf-v6-c-accordion__item--before--TranslateY: -.5rem;
|
268
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
|
269
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
|
270
|
+
--pf-v6-c-accordion__expandable-content--TranslateY: -.5rem;
|
271
|
+
}
|
272
|
+
}
|
244
273
|
|
245
274
|
.pf-v6-c-accordion {
|
246
275
|
display: flex;
|
@@ -274,18 +303,39 @@
|
|
274
303
|
}
|
275
304
|
|
276
305
|
.pf-v6-c-accordion__item {
|
306
|
+
position: relative;
|
307
|
+
}
|
308
|
+
.pf-v6-c-accordion__item::before {
|
309
|
+
position: absolute;
|
310
|
+
inset: 0;
|
311
|
+
pointer-events: none;
|
312
|
+
content: "";
|
313
|
+
background-color: var(--pf-v6-c-accordion__item--m-expanded--BackgroundColor);
|
277
314
|
border-radius: var(--pf-v6-c-accordion__item--BorderRadius);
|
315
|
+
opacity: var(--pf-v6-c-accordion__item--before--Opacity);
|
316
|
+
transition-timing-function: var(--pf-v6-c-accordion__item--before--TransitionTimingFunction);
|
317
|
+
transition-duration: var(--pf-v6-c-accordion__item--before--TransitionDuration--fade);
|
318
|
+
transition-property: opacity;
|
278
319
|
}
|
279
320
|
.pf-v6-c-accordion__item.pf-m-expanded {
|
280
321
|
--pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd);
|
281
322
|
--pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight);
|
282
|
-
|
323
|
+
--pf-v6-c-accordion__item--before--TransitionDuration--slide: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--slide);
|
324
|
+
--pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--fade);
|
325
|
+
--pf-v6-c-accordion__item--before--Opacity: var(--pf-v6-c-accordion__item--m-expanded--before--Opacity);
|
326
|
+
--pf-v6-c-accordion__item--before--TranslateY: var(--pf-v6-c-accordion__item--m-expanded--before--TranslateY);
|
327
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--slide: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide);
|
328
|
+
--pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade);
|
329
|
+
--pf-v6-c-accordion__expandable-content--Opacity: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity);
|
330
|
+
--pf-v6-c-accordion__expandable-content--TranslateY: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY);
|
283
331
|
}
|
284
332
|
.pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon {
|
285
333
|
transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate));
|
286
334
|
}
|
287
335
|
|
288
336
|
.pf-v6-c-accordion__toggle {
|
337
|
+
position: relative;
|
338
|
+
z-index: var(--pf-v6-c-accordion__toggle--ZIndex);
|
289
339
|
display: flex;
|
290
340
|
column-gap: var(--pf-v6-c-accordion__toggle--ColumnGap);
|
291
341
|
align-items: center;
|
@@ -321,7 +371,12 @@
|
|
321
371
|
scale: -1 1;
|
322
372
|
}
|
323
373
|
|
374
|
+
.pf-v6-c-accordion__expandable-content:where([hidden]) {
|
375
|
+
display: revert;
|
376
|
+
}
|
377
|
+
|
324
378
|
.pf-v6-c-accordion__expandable-content {
|
379
|
+
display: none;
|
325
380
|
margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
|
326
381
|
margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart);
|
327
382
|
margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd);
|
@@ -329,11 +384,26 @@
|
|
329
384
|
color: var(--pf-v6-c-accordion__expandable-content--Color);
|
330
385
|
background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor);
|
331
386
|
border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius);
|
387
|
+
opacity: var(--pf-v6-c-accordion__expandable-content--Opacity);
|
388
|
+
transition-timing-function: var(--pf-v6-c-accordion__expandable-content--TransitionTimingFunction);
|
389
|
+
transition-duration: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade), var(--pf-v6-c-accordion__expandable-content--TransitionDuration--slide), var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade);
|
390
|
+
transition-property: opacity, translate, display;
|
391
|
+
transition-behavior: allow-discrete;
|
392
|
+
translate: 0 var(--pf-v6-c-accordion__expandable-content--TranslateY);
|
332
393
|
}
|
333
394
|
.pf-v6-c-accordion__expandable-content.pf-m-fixed {
|
334
395
|
max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
|
335
396
|
overflow-y: auto;
|
336
397
|
}
|
398
|
+
.pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content {
|
399
|
+
display: revert;
|
400
|
+
}
|
401
|
+
@starting-style {
|
402
|
+
.pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content {
|
403
|
+
--pf-v6-c-accordion__expandable-content--Opacity: 0;
|
404
|
+
--pf-v6-c-accordion__expandable-content--TranslateY: -.5rem;
|
405
|
+
}
|
406
|
+
}
|
337
407
|
|
338
408
|
.pf-v6-c-accordion__expandable-content-body {
|
339
409
|
padding-block-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart);
|
@@ -597,27 +667,45 @@
|
|
597
667
|
var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration)
|
598
668
|
var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction)
|
599
669
|
0s;
|
600
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
601
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
602
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
603
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
604
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
605
|
-
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--
|
606
|
-
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--
|
607
|
-
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--
|
608
|
-
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--
|
609
|
-
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--
|
610
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
611
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
612
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
613
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
614
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
615
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
616
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
617
|
-
--pf-v6-c-alert-group--m-toast__item--m-
|
618
|
-
|
619
|
-
|
620
|
-
|
670
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
|
671
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--accelerate);
|
672
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows--default: var(--pf-t--global--motion--duration--fade--default);
|
673
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block--default: var(--pf-t--global--motion--duration--fade--default);
|
674
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDelay--default: var(--pf-t--global--motion--duration--fade--default);
|
675
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default: initial;
|
676
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default: initial;
|
677
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default: initial;
|
678
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default: initial;
|
679
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default: initial;
|
680
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-out--short);
|
681
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--accelerate);
|
682
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity: var(--pf-t--global--motion--duration--slide-out--short);
|
683
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--accelerate);
|
684
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--fade--short);
|
685
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--accelerate);
|
686
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block: var(--pf-t--global--motion--duration--slide-out--short);
|
687
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--short);
|
688
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--accelerate);
|
689
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows: var(--pf-t--global--motion--duration--slide-out--short);
|
690
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform: initial;
|
691
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform: initial;
|
692
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity: initial;
|
693
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity: initial;
|
694
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block: initial;
|
695
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block: initial;
|
696
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block: initial;
|
697
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows: initial;
|
698
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows: initial;
|
699
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows: initial;
|
700
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-out--short);
|
701
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
|
702
|
+
--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition: all
|
703
|
+
var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration)
|
704
|
+
var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionTimingFunction)
|
705
|
+
var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration);
|
706
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: initial;
|
707
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: initial;
|
708
|
+
--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: initial;
|
621
709
|
--pf-v6-c-alert-group__overflow-button--BorderWidth: 0;
|
622
710
|
--pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
|
623
711
|
--pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
@@ -677,40 +765,43 @@
|
|
677
765
|
transition: var(--pf-v6-c-alert-group--m-toast__item--c-alert--Transition);
|
678
766
|
}
|
679
767
|
}
|
680
|
-
.pf-v6-c-alert-group__item.pf-m-offstage-top:first-child {
|
768
|
+
.pf-v6-c-alert-group__item.pf-m-offstage-top:first-child, .pf-v6-c-alert-group__item.pf-m-incoming:first-child {
|
681
769
|
grid-template-rows: 0fr;
|
682
770
|
margin-block: 0;
|
683
771
|
overflow: hidden;
|
684
772
|
opacity: 0;
|
685
773
|
transform: translateY(-100%);
|
686
774
|
}
|
687
|
-
.pf-v6-c-alert-group__item.pf-m-offstage-top:first-child .pf-v6-c-alert {
|
775
|
+
.pf-v6-c-alert-group__item.pf-m-offstage-top:first-child .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-incoming:first-child .pf-v6-c-alert {
|
688
776
|
min-height: 0;
|
689
777
|
padding-block-start: 0;
|
690
778
|
padding-block-end: 0;
|
691
779
|
border-width: 0;
|
692
780
|
}
|
693
|
-
.pf-v6-c-alert-group__item.pf-m-offstage-right {
|
781
|
+
.pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing {
|
694
782
|
grid-template-rows: 0fr;
|
695
783
|
margin-block: 0;
|
696
784
|
overflow: hidden;
|
697
785
|
opacity: 0;
|
698
|
-
transition: grid-template-rows 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default), margin-block 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default), opacity var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default);
|
786
|
+
transition: grid-template-rows 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows--default)), margin-block 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block--default)), opacity var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity--default)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity--default));
|
699
787
|
}
|
700
|
-
.pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
|
788
|
+
.pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-outgoing .pf-v6-c-alert {
|
701
789
|
min-height: 0;
|
702
790
|
padding-block-start: 0;
|
703
791
|
padding-block-end: 0;
|
704
792
|
border-width: 0;
|
705
|
-
transition: all 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default);
|
793
|
+
transition: all 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDelay--default));
|
706
794
|
}
|
707
795
|
@media screen and (prefers-reduced-motion: no-preference) {
|
708
|
-
.pf-v6-c-alert-group__item.pf-m-offstage-right {
|
709
|
-
transition: transform var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform), opacity var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity), margin-block var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block), grid-template-rows var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows);
|
796
|
+
.pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing {
|
797
|
+
transition: transform var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--transform)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--transform)), opacity var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity)), margin-block var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--margin-block)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--margin-block)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block)), grid-template-rows var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--grid-template-rows)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--grid-template-rows)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows));
|
710
798
|
transform: translateX(100%);
|
711
799
|
}
|
712
|
-
.pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
|
713
|
-
|
800
|
+
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing {
|
801
|
+
transform: translateX(calc(100% * var(--pf-v6-global--inverse--multiplier)));
|
802
|
+
}
|
803
|
+
.pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-outgoing .pf-v6-c-alert {
|
804
|
+
transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition));
|
714
805
|
}
|
715
806
|
}
|
716
807
|
.pf-v6-c-alert-group__item:hover {
|
@@ -1681,6 +1772,11 @@ button.pf-v6-c-breadcrumb__link {
|
|
1681
1772
|
--pf-v6-c-button--m-favorited--hover__icon--Color: var(--pf-t--global--color--favorite--hover);
|
1682
1773
|
--pf-v6-c-button--m-favorited__icon--AnimationDuration: var(--pf-t--global--motion--duration--icon--long);
|
1683
1774
|
--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
1775
|
+
--pf-v6-c-button__icon--favorite--Opacity: 1;
|
1776
|
+
--pf-v6-c-button__icon--favorited--Opacity: 0;
|
1777
|
+
--pf-v6-c-button--m-favorited__icon--favorite--Opacity: 0;
|
1778
|
+
--pf-v6-c-button--m-favorited__icon--favorited--Opacity: 1;
|
1779
|
+
--pf-v6-c-button__icon--favorite--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
1684
1780
|
--pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
|
1685
1781
|
--pf-v6-c-button__progress--Opacity: 0;
|
1686
1782
|
--pf-v6-c-button__progress--TranslateY: -50%;
|
@@ -1991,6 +2087,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
1991
2087
|
--pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-display-lg--FontSize);
|
1992
2088
|
}
|
1993
2089
|
.pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
|
2090
|
+
display: grid;
|
1994
2091
|
transition-timing-function: var(--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction);
|
1995
2092
|
transition-duration: var(--pf-v6-c-button--m-favorite__icon--TransitionDuration);
|
1996
2093
|
transition-property: color;
|
@@ -1998,6 +2095,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
1998
2095
|
.pf-v6-c-button.pf-m-favorited {
|
1999
2096
|
--pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
|
2000
2097
|
--pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
|
2098
|
+
--pf-v6-c-button__icon--favorite--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorite--Opacity);
|
2099
|
+
--pf-v6-c-button__icon--favorited--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorited--Opacity);
|
2001
2100
|
}
|
2002
2101
|
.pf-v6-c-button.pf-m-favorited .pf-v6-c-button__icon {
|
2003
2102
|
animation-name: pf-v6-c-button-icon-favorited;
|
@@ -2077,6 +2176,21 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2077
2176
|
--pf-v6-c-button__icon--MarginInlineStart: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
|
2078
2177
|
}
|
2079
2178
|
|
2179
|
+
.pf-v6-c-button__icon-favorite,
|
2180
|
+
.pf-v6-c-button__icon-favorited {
|
2181
|
+
grid-area: 1/1/1/1;
|
2182
|
+
transition-duration: var(--pf-v6-c-button__icon--favorite--TransitionDuration);
|
2183
|
+
transition-property: opacity;
|
2184
|
+
}
|
2185
|
+
|
2186
|
+
.pf-v6-c-button__icon-favorite {
|
2187
|
+
opacity: var(--pf-v6-c-button__icon--favorite--Opacity);
|
2188
|
+
}
|
2189
|
+
|
2190
|
+
.pf-v6-c-button__icon-favorited {
|
2191
|
+
opacity: var(--pf-v6-c-button__icon--favorited--Opacity);
|
2192
|
+
}
|
2193
|
+
|
2080
2194
|
.pf-v6-c-button__progress {
|
2081
2195
|
position: absolute;
|
2082
2196
|
inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
|
@@ -2089,6 +2203,10 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2089
2203
|
--pf-v6-c-spinner--Color: currentcolor;
|
2090
2204
|
}
|
2091
2205
|
|
2206
|
+
.pf-v6-c-button__text {
|
2207
|
+
text-decoration: inherit;
|
2208
|
+
}
|
2209
|
+
|
2092
2210
|
.pf-v6-c-button__count {
|
2093
2211
|
display: inline-flex;
|
2094
2212
|
align-items: center;
|
@@ -2329,6 +2447,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2329
2447
|
--pf-v6-c-card__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
|
2330
2448
|
--pf-v6-c-card__title-text--FontWeight: var(--pf-t--global--font--weight--heading--default);
|
2331
2449
|
--pf-v6-c-card__title-text--LineHeight: var(--pf-t--global--font--line-height--heading);
|
2450
|
+
--pf-v6-c-card__title-text--OverflowWrap: break-word;
|
2332
2451
|
--pf-v6-c-card--c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
|
2333
2452
|
--pf-v6-c-card__body--FontSize: var(--pf-t--global--font--size--body--default);
|
2334
2453
|
--pf-v6-c-card__footer--FontSize: var(--pf-t--global--font--size--body--default);
|
@@ -2541,11 +2660,13 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2541
2660
|
}
|
2542
2661
|
|
2543
2662
|
.pf-v6-c-card__title-text {
|
2663
|
+
overflow: auto;
|
2544
2664
|
font-family: var(--pf-v6-c-card__title-text--FontFamily);
|
2545
2665
|
font-size: var(--pf-v6-c-card__title-text--FontSize);
|
2546
2666
|
font-weight: var(--pf-v6-c-card__title-text--FontWeight);
|
2547
2667
|
line-height: var(--pf-v6-c-card__title-text--LineHeight);
|
2548
2668
|
color: var(--pf-v6-c-card__title-text--Color);
|
2669
|
+
overflow-wrap: var(--pf-v6-c-card__title-text--OverflowWrap);
|
2549
2670
|
}
|
2550
2671
|
|
2551
2672
|
.pf-v6-c-card__actions {
|
@@ -5307,9 +5428,15 @@ ul) {
|
|
5307
5428
|
--pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
|
5308
5429
|
--pf-v6-c-drawer__panel--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
5309
5430
|
--pf-v6-c-drawer__panel--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
|
5431
|
+
--pf-v6-c-drawer__panel--TransitionDelay: 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus), var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
|
5432
|
+
--pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--fade);
|
5433
|
+
--pf-v6-c-drawer__panel--TransitionDelay--expand--focus: 0s;
|
5310
5434
|
--pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
|
5311
|
-
--pf-v6-c-drawer__panel--TransitionDuration: var(--pf-t--global--motion--duration--
|
5312
|
-
--pf-v6-c-drawer__panel--
|
5435
|
+
--pf-v6-c-drawer__panel--TransitionDuration--fade: var(--pf-t--global--motion--duration--fade--default);
|
5436
|
+
--pf-v6-c-drawer__panel--TransitionDuration: var(--pf-v6-c-drawer__panel--TransitionDuration--fade), 0s, 0s;
|
5437
|
+
--pf-v6-c-drawer__panel--TransitionProperty: opacity, visibility, transform;
|
5438
|
+
--pf-v6-c-drawer__panel--Opacity: 0;
|
5439
|
+
--pf-v6-c-drawer--m-expanded__panel--Opacity: 1;
|
5313
5440
|
--pf-v6-c-drawer__panel--FlexBasis: 100%;
|
5314
5441
|
--pf-v6-c-drawer__panel--md--FlexBasis--min: 1.5rem;
|
5315
5442
|
--pf-v6-c-drawer__panel--md--FlexBasis: 50%;
|
@@ -5399,6 +5526,17 @@ ul) {
|
|
5399
5526
|
--pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd: var(--pf-v6-c-drawer__panel--after--Width);
|
5400
5527
|
--pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: var(--pf-v6-c-drawer__panel--after--Width);
|
5401
5528
|
}
|
5529
|
+
@media screen and (prefers-reduced-motion: no-preference) {
|
5530
|
+
.pf-v6-c-drawer {
|
5531
|
+
--pf-v6-c-drawer__panel--TransitionDuration--slide: var(--pf-t--global--motion--duration--slide-in--short);
|
5532
|
+
--pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--slide);
|
5533
|
+
--pf-v6-c-drawer__panel--TransitionDelay: 0s, 0s, 0s, 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
|
5534
|
+
--pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
|
5535
|
+
--pf-v6-c-drawer__panel--TransitionDuration: 0s, var(--pf-v6-c-drawer__panel--TransitionDuration--slide), 0s, 0s, 0s;
|
5536
|
+
--pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis, visibility;
|
5537
|
+
--pf-v6-c-drawer__panel--Opacity: 1;
|
5538
|
+
}
|
5539
|
+
}
|
5402
5540
|
@media screen and (min-width: 75rem) {
|
5403
5541
|
.pf-v6-c-drawer {
|
5404
5542
|
--pf-v6-c-drawer__panel--MinWidth: var(--pf-v6-c-drawer__panel--xl--MinWidth);
|
@@ -5446,8 +5584,13 @@ ul) {
|
|
5446
5584
|
.pf-v6-c-drawer.pf-m-panel-bottom > .pf-v6-c-drawer__main {
|
5447
5585
|
flex-direction: column;
|
5448
5586
|
}
|
5587
|
+
.pf-v6-c-drawer.pf-m-expanded {
|
5588
|
+
--pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDelay--expand--focus);
|
5589
|
+
}
|
5449
5590
|
.pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
|
5450
5591
|
transform: translateX(-100%);
|
5592
|
+
--pf-v6-c-drawer__panel--Opacity: var(--pf-v6-c-drawer--m-expanded__panel--Opacity);
|
5593
|
+
visibility: visible;
|
5451
5594
|
}
|
5452
5595
|
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
|
5453
5596
|
transform: translateX(calc(-100% * var(--pf-v6-global--inverse--multiplier)));
|
@@ -5520,8 +5663,11 @@ ul) {
|
|
5520
5663
|
order: 1;
|
5521
5664
|
max-height: var(--pf-v6-c-drawer__panel--MaxHeight);
|
5522
5665
|
overflow: auto;
|
5666
|
+
visibility: hidden;
|
5523
5667
|
background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
|
5524
5668
|
box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
|
5669
|
+
opacity: var(--pf-v6-c-drawer__panel--Opacity);
|
5670
|
+
transition-delay: var(--pf-v6-c-drawer__panel--TransitionDelay);
|
5525
5671
|
transition-timing-function: var(--pf-v6-c-drawer__panel--TransitionTimingFunction);
|
5526
5672
|
transition-duration: var(--pf-v6-c-drawer__panel--TransitionDuration);
|
5527
5673
|
transition-property: var(--pf-v6-c-drawer__panel--TransitionProperty);
|
@@ -5578,17 +5724,6 @@ ul) {
|
|
5578
5724
|
padding-block-end: var(--pf-v6-c-drawer__panel--PaddingBlockEnd);
|
5579
5725
|
}
|
5580
5726
|
|
5581
|
-
@keyframes pf-remove-tab-focus {
|
5582
|
-
to {
|
5583
|
-
visibility: hidden;
|
5584
|
-
}
|
5585
|
-
}
|
5586
|
-
.pf-v6-c-drawer__panel[hidden] {
|
5587
|
-
animation-name: pf-remove-tab-focus;
|
5588
|
-
animation-delay: var(--pf-v6-c-drawer__panel--TransitionDuration);
|
5589
|
-
animation-fill-mode: forwards;
|
5590
|
-
}
|
5591
|
-
|
5592
5727
|
.pf-v6-c-drawer__head {
|
5593
5728
|
display: grid;
|
5594
5729
|
grid-template-columns: auto;
|
@@ -5696,7 +5831,7 @@ ul) {
|
|
5696
5831
|
.pf-v6-c-drawer {
|
5697
5832
|
min-width: var(--pf-v6-c-drawer__panel--MinWidth);
|
5698
5833
|
}
|
5699
|
-
.pf-v6-c-drawer
|
5834
|
+
.pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
|
5700
5835
|
box-shadow: var(--pf-v6-c-drawer--m-expanded__panel--BoxShadow);
|
5701
5836
|
}
|
5702
5837
|
.pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable {
|
@@ -6280,6 +6415,17 @@ ul) {
|
|
6280
6415
|
--pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
|
6281
6416
|
--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
|
6282
6417
|
--pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate: -90deg;
|
6418
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide: 0s;
|
6419
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
|
6420
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--expand--slide: 0s;
|
6421
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
|
6422
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--slide: var(--pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide);
|
6423
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--fade: var(--pf-v6-c-expandable-section__content--TransitionDuration--collapse--fade);
|
6424
|
+
--pf-v6-c-expandable-section__content--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
6425
|
+
--pf-v6-c-expandable-section__content--Opacity: 0;
|
6426
|
+
--pf-v6-c-expandable-section__content--TranslateY: 0;
|
6427
|
+
--pf-v6-c-expandable-section--m-expanded__content--Opacity: 1;
|
6428
|
+
--pf-v6-c-expandable-section--m-expanded__content--TranslateY: 0;
|
6283
6429
|
--pf-v6-c-expandable-section__content--MaxWidth: auto;
|
6284
6430
|
--pf-v6-c-expandable-section--m-limit-width__content--MaxWidth: 46.875rem;
|
6285
6431
|
--pf-v6-c-expandable-section--m-display-lg--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
@@ -6291,10 +6437,18 @@ ul) {
|
|
6291
6437
|
--pf-v6-c-expandable-section--m-display-lg--BorderWidth: var(--pf-t--global--border--width--box--default);
|
6292
6438
|
--pf-v6-c-expandable-section--m-display-lg--BorderColor: var(--pf-t--global--border--color--default);
|
6293
6439
|
--pf-v6-c-expandable-section--m-display-lg--BorderRadius: var(--pf-t--global--border--radius--medium);
|
6440
|
+
--pf-v6-c-expandable-section--m-display-lg--TransitionDelay: var(--pf-v6-c-expandable-section__content--TransitionDuration--fade);
|
6294
6441
|
--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) + var(--pf-t--global--spacer--gap--text-to-element--default) + var(--pf-v6-c-expandable-section__toggle-icon--MinWidth));
|
6295
6442
|
--pf-v6-c-expandable-section--m-truncate__content--LineClamp: 3;
|
6296
6443
|
--pf-v6-c-expandable-section--m-truncate--Gap: var(--pf-t--global--spacer--xs);
|
6297
6444
|
}
|
6445
|
+
@media screen and (prefers-reduced-motion: no-preference) {
|
6446
|
+
.pf-v6-c-expandable-section {
|
6447
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
|
6448
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
|
6449
|
+
--pf-v6-c-expandable-section__content--TranslateY: -.5rem;
|
6450
|
+
}
|
6451
|
+
}
|
6298
6452
|
|
6299
6453
|
.pf-v6-c-expandable-section {
|
6300
6454
|
display: flex;
|
@@ -6305,6 +6459,11 @@ ul) {
|
|
6305
6459
|
--pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate);
|
6306
6460
|
--pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
|
6307
6461
|
--pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg--m-expanded--PaddingBlockEnd);
|
6462
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--slide: var(--pf-v6-c-expandable-section__content--TransitionDuration--expand--slide);
|
6463
|
+
--pf-v6-c-expandable-section__content--TransitionDuration--fade: var(--pf-v6-c-expandable-section__content--TransitionDuration--expand--fade);
|
6464
|
+
--pf-v6-c-expandable-section__content--Opacity: var(--pf-v6-c-expandable-section--m-expanded__content--Opacity);
|
6465
|
+
--pf-v6-c-expandable-section__content--TranslateY: var(--pf-v6-c-expandable-section--m-expanded__content--TranslateY);
|
6466
|
+
--pf-v6-c-expandable-section--m-display-lg--TransitionDelay: 0s;
|
6308
6467
|
}
|
6309
6468
|
.pf-v6-c-expandable-section.pf-m-limit-width {
|
6310
6469
|
--pf-v6-c-expandable-section__content--MaxWidth: var(--pf-v6-c-expandable-section--m-limit-width__content--MaxWidth);
|
@@ -6317,6 +6476,7 @@ ul) {
|
|
6317
6476
|
background-color: var(--pf-v6-c-expandable-section--m-display-lg--BackgroundColor);
|
6318
6477
|
border: var(--pf-v6-c-expandable-section--m-display-lg--BorderWidth) solid var(--pf-v6-c-expandable-section--m-display-lg--BorderColor);
|
6319
6478
|
border-radius: var(--pf-v6-c-expandable-section--m-display-lg--BorderRadius);
|
6479
|
+
transition: padding-block-end 0s var(--pf-v6-c-expandable-section--m-display-lg--TransitionDelay, 0s);
|
6320
6480
|
}
|
6321
6481
|
.pf-v6-c-expandable-section.pf-m-indented {
|
6322
6482
|
--pf-v6-c-expandable-section__content--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart);
|
@@ -6351,6 +6511,27 @@ ul) {
|
|
6351
6511
|
padding-block-end: var(--pf-v6-c-expandable-section__content--PaddingBlockEnd, 0);
|
6352
6512
|
padding-inline-start: var(--pf-v6-c-expandable-section__content--PaddingInlineStart, 0);
|
6353
6513
|
}
|
6514
|
+
.pf-v6-c-expandable-section__content:where([hidden]) {
|
6515
|
+
display: revert;
|
6516
|
+
}
|
6517
|
+
.pf-v6-c-expandable-section:where(:not(.pf-m-truncate)) .pf-v6-c-expandable-section__content {
|
6518
|
+
display: none;
|
6519
|
+
opacity: var(--pf-v6-c-expandable-section__content--Opacity);
|
6520
|
+
transition-timing-function: var(--pf-v6-c-expandable-section__content--TransitionTimingFunction);
|
6521
|
+
transition-duration: var(--pf-v6-c-expandable-section__content--TransitionDuration--fade), var(--pf-v6-c-expandable-section__content--TransitionDuration--slide), var(--pf-v6-c-expandable-section__content--TransitionDuration--fade);
|
6522
|
+
transition-property: opacity, translate, display;
|
6523
|
+
transition-behavior: allow-discrete;
|
6524
|
+
translate: 0 var(--pf-v6-c-expandable-section__content--TranslateY);
|
6525
|
+
}
|
6526
|
+
.pf-v6-c-expandable-section.pf-m-expanded .pf-v6-c-expandable-section__content {
|
6527
|
+
display: revert;
|
6528
|
+
}
|
6529
|
+
@starting-style {
|
6530
|
+
.pf-v6-c-expandable-section.pf-m-expanded .pf-v6-c-expandable-section__content {
|
6531
|
+
--pf-v6-c-expandable-section__content--Opacity: 0;
|
6532
|
+
--pf-v6-c-expandable-section__content--TranslateY: -.5rem;
|
6533
|
+
}
|
6534
|
+
}
|
6354
6535
|
|
6355
6536
|
.pf-v6-c-file-upload {
|
6356
6537
|
--pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
|
@@ -7070,12 +7251,11 @@ ul) {
|
|
7070
7251
|
padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
|
7071
7252
|
padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
|
7072
7253
|
color: var(--pf-v6-c-form-control--Color);
|
7254
|
+
appearance: none;
|
7073
7255
|
background-color: transparent;
|
7074
7256
|
border: none;
|
7075
7257
|
border-radius: var(--pf-v6-c-form-control--BorderRadius);
|
7076
7258
|
outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
|
7077
|
-
-moz-appearance: none;
|
7078
|
-
-webkit-appearance: none;
|
7079
7259
|
}
|
7080
7260
|
.pf-v6-c-form-control > ::placeholder {
|
7081
7261
|
color: var(--pf-v6-c-form-control--m-placeholder--Color);
|
@@ -10650,16 +10830,20 @@ ul.pf-v6-c-list {
|
|
10650
10830
|
flex-wrap: nowrap;
|
10651
10831
|
}
|
10652
10832
|
|
10653
|
-
.pf-v6-c-menu-toggle__icon {
|
10654
|
-
flex-shrink: 0;
|
10655
|
-
}
|
10656
10833
|
.pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
|
10657
10834
|
.pf-v6-c-menu-toggle__icon.pf-m-avatar img,
|
10658
|
-
.pf-v6-c-menu-toggle__icon.pf-m-avatar svg {
|
10835
|
+
.pf-v6-c-menu-toggle__icon.pf-m-avatar svg, .pf-v6-c-menu-toggle:not(.pf-m-plain) .pf-v6-c-menu-toggle__icon {
|
10659
10836
|
margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
|
10660
10837
|
margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
|
10661
10838
|
}
|
10662
10839
|
|
10840
|
+
.pf-v6-c-menu-toggle__icon {
|
10841
|
+
flex-shrink: 0;
|
10842
|
+
}
|
10843
|
+
.pf-v6-c-menu-toggle__icon :where(picture, img) {
|
10844
|
+
vertical-align: middle;
|
10845
|
+
}
|
10846
|
+
|
10663
10847
|
.pf-v6-c-menu-toggle__controls {
|
10664
10848
|
display: flex;
|
10665
10849
|
gap: var(--pf-v6-c-menu-toggle__controls--Gap);
|
@@ -14331,8 +14515,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
14331
14515
|
--pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
|
14332
14516
|
--pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
|
14333
14517
|
--pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
|
14334
|
-
--pf-v6-c-skeleton--after--TranslateX:
|
14335
|
-
--pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
|
14518
|
+
--pf-v6-c-skeleton--after--TranslateX: 0;
|
14519
|
+
--pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading-reduced-motion;
|
14336
14520
|
--pf-v6-c-skeleton--after--AnimationDuration: 3s;
|
14337
14521
|
--pf-v6-c-skeleton--after--AnimationIterationCount: infinite;
|
14338
14522
|
--pf-v6-c-skeleton--after--AnimationTimingFunction: linear;
|
@@ -14364,6 +14548,15 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
14364
14548
|
--pf-v6-c-skeleton--m-height-75--Height: 75%;
|
14365
14549
|
--pf-v6-c-skeleton--m-height-100--Height: 100%;
|
14366
14550
|
}
|
14551
|
+
@media screen and (prefers-reduced-motion: no-preference) {
|
14552
|
+
.pf-v6-c-skeleton {
|
14553
|
+
--pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
|
14554
|
+
--pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
|
14555
|
+
--pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
|
14556
|
+
--pf-v6-c-skeleton--after--TranslateX: -100%;
|
14557
|
+
--pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
|
14558
|
+
}
|
14559
|
+
}
|
14367
14560
|
|
14368
14561
|
.pf-v6-c-skeleton {
|
14369
14562
|
position: relative;
|
@@ -14484,6 +14677,17 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
14484
14677
|
transform: translateX(100%);
|
14485
14678
|
}
|
14486
14679
|
}
|
14680
|
+
@keyframes pf-v6-c-skeleton-loading-reduced-motion {
|
14681
|
+
0% {
|
14682
|
+
opacity: 0.25;
|
14683
|
+
}
|
14684
|
+
60% {
|
14685
|
+
opacity: 1;
|
14686
|
+
}
|
14687
|
+
100% {
|
14688
|
+
opacity: 0.25;
|
14689
|
+
}
|
14690
|
+
}
|
14487
14691
|
.pf-v6-c-skip-to-content {
|
14488
14692
|
--pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
|
14489
14693
|
--pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
|
@@ -16639,6 +16843,17 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
16639
16843
|
--pf-v6-c-table__action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
|
16640
16844
|
--pf-v6-c-table__action--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
16641
16845
|
--pf-v6-c-table__action--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
16846
|
+
--pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
|
16847
|
+
--pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
|
16848
|
+
--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
|
16849
|
+
--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
|
16850
|
+
--pf-v6-c-table__expandable-row--TransitionDuration--slide: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide);
|
16851
|
+
--pf-v6-c-table__expandable-row--TransitionDuration--fade: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
|
16852
|
+
--pf-v6-c-table__expandable-row--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
16853
|
+
--pf-v6-c-table__expandable-row--Opacity: 0;
|
16854
|
+
--pf-v6-c-table__tbody--m-expanded__expandable-row--Opacity: 1;
|
16855
|
+
--pf-v6-c-table__expandable-row--TranslateY: 0;
|
16856
|
+
--pf-v6-c-table__tbody--m-expanded__expandable-row--TranslateY: 0;
|
16642
16857
|
--pf-v6-c-table__expandable-row-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
16643
16858
|
--pf-v6-c-table__expandable-row-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
16644
16859
|
--pf-v6-c-table__expandable-row-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
|
@@ -16699,6 +16914,13 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
16699
16914
|
--pf-v6-c-table--m-sticky-header--ZIndex: calc(var(--pf-t--global--z-index--xs) + 1);
|
16700
16915
|
--pf-v6-c-table--m-sticky-header--border--ZIndex: calc(var(--pf-t--global--z-index--xs) + 2);
|
16701
16916
|
}
|
16917
|
+
@media screen and (prefers-reduced-motion: no-preference) {
|
16918
|
+
.pf-v6-c-table {
|
16919
|
+
--pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
|
16920
|
+
--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
|
16921
|
+
--pf-v6-c-table__expandable-row--TranslateY: -.5rem;
|
16922
|
+
}
|
16923
|
+
}
|
16702
16924
|
|
16703
16925
|
.pf-v6-c-table {
|
16704
16926
|
width: 100%;
|
@@ -17267,6 +17489,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
17267
17489
|
.pf-v6-c-table__expandable-row {
|
17268
17490
|
position: relative;
|
17269
17491
|
border-block-end: 0 solid transparent;
|
17492
|
+
opacity: var(--pf-v6-c-table__expandable-row--Opacity);
|
17493
|
+
transition-timing-function: var(--pf-v6-c-table__expandable-row--TransitionTimingFunction);
|
17494
|
+
transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--slide), var(--pf-v6-c-table__expandable-row--TransitionDuration--fade);
|
17495
|
+
transition-property: opacity, translate, display;
|
17496
|
+
transition-behavior: allow-discrete;
|
17497
|
+
translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
|
17270
17498
|
}
|
17271
17499
|
:not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__th,
|
17272
17500
|
:not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__td {
|
@@ -17295,6 +17523,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
17295
17523
|
.pf-v6-c-table__expandable-row.pf-m-expanded {
|
17296
17524
|
border-block-end-color: var(--pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor);
|
17297
17525
|
border-block-end-width: var(--pf-v6-c-table--border-width--base);
|
17526
|
+
opacity: var(--pf-v6-c-table__tbody--m-expanded__expandable-row--Opacity);
|
17527
|
+
transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--slide), var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--fade);
|
17528
|
+
translate: 0 var(--pf-v6-c-table__tbody--m-expanded__expandable-row--TranslateY);
|
17529
|
+
}
|
17530
|
+
@starting-style {
|
17531
|
+
.pf-v6-c-table__expandable-row.pf-m-expanded {
|
17532
|
+
opacity: var(--pf-v6-c-table__expandable-row--Opacity);
|
17533
|
+
translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
|
17534
|
+
}
|
17298
17535
|
}
|
17299
17536
|
.pf-v6-c-table__expandable-row:not(.pf-m-expanded) {
|
17300
17537
|
display: none;
|
@@ -18319,6 +18556,16 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18319
18556
|
}
|
18320
18557
|
}
|
18321
18558
|
|
18559
|
+
@property --pf-v6-c-tabs--link-accent--length {
|
18560
|
+
syntax: "<length>";
|
18561
|
+
inherits: true;
|
18562
|
+
initial-value: 0px;
|
18563
|
+
}
|
18564
|
+
@property --pf-v6-c-tabs--link-accent--start {
|
18565
|
+
syntax: "<length>";
|
18566
|
+
inherits: true;
|
18567
|
+
initial-value: 0px;
|
18568
|
+
}
|
18322
18569
|
.pf-v6-c-tabs {
|
18323
18570
|
--pf-v6-c-tabs--inset: 0;
|
18324
18571
|
--pf-v6-c-tabs--Width: auto;
|
@@ -18380,6 +18627,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18380
18627
|
--pf-v6-c-tabs--m-box--m-secondary__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
|
18381
18628
|
--pf-v6-c-tabs--m-box--m-secondary__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
|
18382
18629
|
--pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
|
18630
|
+
--pf-v6-c-tabs__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--short);
|
18631
|
+
--pf-v6-c-tabs__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
|
18383
18632
|
--pf-v6-c-tabs__link--before--border-color--base: var(--pf-t--global--border--color--default);
|
18384
18633
|
--pf-v6-c-tabs__link--before--border-width--base: var(--pf-t--global--border--width--regular);
|
18385
18634
|
--pf-v6-c-tabs__link--before--BorderBlockStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
|
@@ -18404,6 +18653,26 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18404
18653
|
--pf-v6-c-tabs__link--after--BorderInlineStartWidth: 0;
|
18405
18654
|
--pf-v6-c-tabs__item--m-current__link--after--BorderColor: var(--pf-t--global--border--color--clicked);
|
18406
18655
|
--pf-v6-c-tabs__item--m-current__link--after--BorderWidth: var(--pf-t--global--border--width--extra-strong);
|
18656
|
+
--pf-v6-c-tabs--link-accent--start: 0;
|
18657
|
+
--pf-v6-c-tabs--link-accent--length: auto;
|
18658
|
+
--pf-v6-c-tabs--link-accent--color: var(--pf-v6-c-tabs__item--m-current__link--after--BorderColor);
|
18659
|
+
--pf-v6-c-tabs--link-accent--border-size: var(--pf-v6-c-tabs__item--m-current__link--after--BorderWidth);
|
18660
|
+
--pf-v6-c-tabs--link-accent--InsetBlockStart: auto;
|
18661
|
+
--pf-v6-c-tabs--link-accent--InsetBlockEnd: 0;
|
18662
|
+
--pf-v6-c-tabs--link-accent--InsetInlineStart: initial;
|
18663
|
+
--pf-v6-c-tabs--link-accent--Width: initial;
|
18664
|
+
--pf-v6-c-tabs--link-accent--Height: 0;
|
18665
|
+
--pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--link-accent--border-size);
|
18666
|
+
--pf-v6-c-tabs--link-accent--BorderInlineStartWidth: 0;
|
18667
|
+
--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart: initial;
|
18668
|
+
--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd: auto;
|
18669
|
+
--pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart: 0;
|
18670
|
+
--pf-v6-c-tabs--m-vertical--link-accent--Width: 0;
|
18671
|
+
--pf-v6-c-tabs--m-vertical--link-accent--Height: initial;
|
18672
|
+
--pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth: 0;
|
18673
|
+
--pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--link-accent--border-size);
|
18674
|
+
--pf-v6-c-tabs--link-accent--TransitionDuration: var(--pf-t--global--motion--duration--md);
|
18675
|
+
--pf-v6-c-tabs--link-accent--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
|
18407
18676
|
--pf-v6-c-tabs__scroll-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
18408
18677
|
--pf-v6-c-tabs__scroll-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
|
18409
18678
|
--pf-v6-c-tabs__scroll-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
@@ -18561,6 +18830,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18561
18830
|
--pf-v6-c-tabs__link--after--InsetBlockEnd: 0;
|
18562
18831
|
--pf-v6-c-tabs__link--after--InsetInlineEnd: auto;
|
18563
18832
|
--pf-v6-c-tabs__list--ScrollSnapTypeAxis: var(--pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis);
|
18833
|
+
--pf-v6-c-tabs--link-accent--InsetBlockStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart);
|
18834
|
+
--pf-v6-c-tabs--link-accent--InsetBlockEnd: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd);
|
18835
|
+
--pf-v6-c-tabs--link-accent--InsetInlineStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart);
|
18836
|
+
--pf-v6-c-tabs--link-accent--Width: var(--pf-v6-c-tabs--m-vertical--link-accent--Width);
|
18837
|
+
--pf-v6-c-tabs--link-accent--Height: var(--pf-v6-c-tabs--m-vertical--link-accent--Height);
|
18838
|
+
--pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth);
|
18839
|
+
--pf-v6-c-tabs--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth);
|
18564
18840
|
display: inline-flex;
|
18565
18841
|
flex-direction: column;
|
18566
18842
|
height: 100%;
|
@@ -18823,6 +19099,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18823
19099
|
text-decoration-line: none;
|
18824
19100
|
background-color: var(--pf-v6-c-tabs__link--BackgroundColor);
|
18825
19101
|
border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
|
19102
|
+
transition: background-color var(--pf-v6-c-tabs__link--TransitionDuration--background-color) var(--pf-v6-c-tabs__link--TransitionTimingFunction--background-color);
|
18826
19103
|
}
|
18827
19104
|
.pf-v6-c-tabs__item.pf-m-action, .pf-v6-c-tabs__link {
|
18828
19105
|
--pf-v6-c-tabs__link--after--BorderBlockEndWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
|
@@ -19135,6 +19412,30 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
19135
19412
|
}
|
19136
19413
|
}
|
19137
19414
|
|
19415
|
+
@media (prefers-reduced-motion: no-preference) {
|
19416
|
+
.pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__link::after,
|
19417
|
+
.pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__item.pf-m-action::after {
|
19418
|
+
content: revert;
|
19419
|
+
}
|
19420
|
+
.pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__list::after {
|
19421
|
+
position: absolute;
|
19422
|
+
inset-block-start: var(--pf-v6-c-tabs--link-accent--InsetBlockStart, var(--pf-v6-c-tabs--link-accent--start));
|
19423
|
+
inset-block-end: var(--pf-v6-c-tabs--link-accent--InsetBlockEnd);
|
19424
|
+
inset-inline-start: var(--pf-v6-c-tabs--link-accent--InsetInlineStart, var(--pf-v6-c-tabs--link-accent--start));
|
19425
|
+
width: var(--pf-v6-c-tabs--link-accent--Width, var(--pf-v6-c-tabs--link-accent--length));
|
19426
|
+
height: var(--pf-v6-c-tabs--link-accent--Height, var(--pf-v6-c-tabs--link-accent--length));
|
19427
|
+
content: "";
|
19428
|
+
border: 0 solid var(--pf-v6-c-tabs--link-accent--color);
|
19429
|
+
border-block-end-width: var(--pf-v6-c-tabs--link-accent--BorderBlockEndWidth);
|
19430
|
+
border-inline-start-width: var(--pf-v6-c-tabs--link-accent--BorderInlineStartWidth);
|
19431
|
+
transition-timing-function: var(--pf-v6-c-tabs--link-accent--TransitionTimingFunction);
|
19432
|
+
transition-duration: var(--pf-v6-c-tabs--link-accent--TransitionDuration);
|
19433
|
+
transition-property: --pf-v6-c-tabs--link-accent--length, --pf-v6-c-tabs--link-accent--start, width;
|
19434
|
+
}
|
19435
|
+
.pf-v6-c-tabs.pf-m-initializing-accent {
|
19436
|
+
--pf-v6-c-tabs--link-accent--TransitionDuration: 0;
|
19437
|
+
}
|
19438
|
+
}
|
19138
19439
|
.pf-v6-c-text-input-group {
|
19139
19440
|
--pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
|
19140
19441
|
--pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
|
@@ -19471,6 +19772,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
19471
19772
|
--pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle);
|
19472
19773
|
}
|
19473
19774
|
|
19775
|
+
.pf-v6-c-timestamp__text {
|
19776
|
+
text-decoration: inherit;
|
19777
|
+
}
|
19778
|
+
|
19474
19779
|
.pf-v6-c-title {
|
19475
19780
|
--pf-v6-c-title--FontFamily: var(--pf-t--global--font--family--heading);
|
19476
19781
|
--pf-v6-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
|
@@ -21745,6 +22050,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
21745
22050
|
grid-auto-flow: column;
|
21746
22051
|
align-items: baseline;
|
21747
22052
|
min-width: var(--pf-v6-c-truncate--MinWidth);
|
22053
|
+
text-decoration: inherit;
|
22054
|
+
}
|
22055
|
+
.pf-v6-c-truncate.pf-m-fixed {
|
22056
|
+
display: inline;
|
22057
|
+
align-items: revert;
|
22058
|
+
min-width: revert;
|
21748
22059
|
}
|
21749
22060
|
|
21750
22061
|
.pf-v6-c-truncate__start,
|
@@ -21836,6 +22147,17 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
21836
22147
|
--pf-v6-c-tree-view__node-container--Display: contents;
|
21837
22148
|
--pf-v6-c-tree-view__node-content--RowGap: var(--pf-t--global--spacer--sm);
|
21838
22149
|
--pf-v6-c-tree-view__node-content--Overflow: visible;
|
22150
|
+
--pf-v6-c-tree-view__list--TransitionDuration--expand--slide: 0s;
|
22151
|
+
--pf-v6-c-tree-view__list--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
|
22152
|
+
--pf-v6-c-tree-view__list--TransitionDuration--collapse--slide: 0s;
|
22153
|
+
--pf-v6-c-tree-view__list--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
|
22154
|
+
--pf-v6-c-tree-view__list--TransitionDuration--slide: var(--pf-v6-c-tree-view__list--TransitionDuration--collapse--slide);
|
22155
|
+
--pf-v6-c-tree-view__list--TransitionDuration--fade: var(--pf-v6-c-tree-view__list--TransitionDuration--collapse--fade);
|
22156
|
+
--pf-v6-c-tree-view__list--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
22157
|
+
--pf-v6-c-tree-view__list--Opacity: 0;
|
22158
|
+
--pf-v6-c-tree-view--m-expanded__list--Opacity: 1;
|
22159
|
+
--pf-v6-c-tree-view__list--TranslateY: 0;
|
22160
|
+
--pf-v6-c-tree-view--m-expanded__list--TranslateY: 0;
|
21839
22161
|
--pf-v6-c-tree-view__list-item__list-item__node-toggle--InsetBlockStart: var(--pf-v6-c-tree-view__node--PaddingBlockStart);
|
21840
22162
|
--pf-v6-c-tree-view__list-item__list-item__node-toggle--InsetInlineStart: var(--pf-v6-c-tree-view__node--PaddingInlineStart);
|
21841
22163
|
--pf-v6-c-tree-view__list-item__list-item__node-toggle--TranslateX: -100%;
|
@@ -21851,6 +22173,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
21851
22173
|
--pf-v6-c-tree-view__node-toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
|
21852
22174
|
--pf-v6-c-tree-view__node-toggle--MarginBlockStart: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingBlockStart) * -1);
|
21853
22175
|
--pf-v6-c-tree-view__node-toggle--MarginBlockEnd: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingBlockStart) * -1);
|
22176
|
+
--pf-v6-c-tree-view__node-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
22177
|
+
--pf-v6-c-tree-view__node-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
21854
22178
|
--pf-v6-c-tree-view__node-check--MarginInlineEnd: var(--pf-t--global--spacer--sm);
|
21855
22179
|
--pf-v6-c-tree-view__node-count--MarginInlineStart: var(--pf-t--global--spacer--sm);
|
21856
22180
|
--pf-v6-c-tree-view__search--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
@@ -21926,6 +22250,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
21926
22250
|
--pf-v6-c-tree-view--m-compact--m-no-background__node--nested--PaddingBlockEnd: 0;
|
21927
22251
|
--pf-v6-c-tree-view--m-compact--m-no-background__node--before--InsetBlockStart: calc(var(--pf-v6-c-tree-view--m-compact__node-container--nested--PaddingBlockStart) + var(--pf-v6-c-tree-view--m-compact__node--nested--PaddingBlockStart) + 0.25rem);
|
21928
22252
|
}
|
22253
|
+
@media screen and (prefers-reduced-motion: no-preference) {
|
22254
|
+
.pf-v6-c-tree-view {
|
22255
|
+
--pf-v6-c-tree-view__list--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
|
22256
|
+
--pf-v6-c-tree-view__list--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
|
22257
|
+
--pf-v6-c-tree-view__list--TranslateY: -.5rem;
|
22258
|
+
}
|
22259
|
+
}
|
21929
22260
|
|
21930
22261
|
.pf-v6-c-tree-view.pf-m-compact .pf-v6-c-tree-view__list-item, .pf-v6-c-tree-view.pf-m-guides .pf-v6-c-tree-view__list-item {
|
21931
22262
|
position: relative;
|
@@ -22041,12 +22372,20 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
22041
22372
|
display: inline-block;
|
22042
22373
|
min-width: var(--pf-v6-c-tree-view__node-toggle-icon--MinWidth);
|
22043
22374
|
text-align: center;
|
22375
|
+
transition: transform var(--pf-v6-c-tree-view__node-toggle-icon--TransitionDuration) var(--pf-v6-c-tree-view__node-toggle-icon--TransitionTimingFunction);
|
22044
22376
|
transform: rotate(var(--pf-v6-c-tree-view__node-toggle-icon--Rotate));
|
22045
22377
|
}
|
22046
22378
|
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-tree-view__node-toggle-icon {
|
22047
22379
|
scale: -1 1;
|
22048
22380
|
}
|
22049
22381
|
|
22382
|
+
.pf-v6-c-tree-view__list-item .pf-v6-c-tree-view__list {
|
22383
|
+
opacity: var(--pf-v6-c-tree-view__list--Opacity);
|
22384
|
+
transition-timing-function: var(--pf-v6-c-tree-view__list--TransitionTimingFunction);
|
22385
|
+
transition-duration: var(--pf-v6-c-tree-view__list--TransitionDuration--fade), var(--pf-v6-c-tree-view__list--TransitionDuration--slide);
|
22386
|
+
transition-property: opacity, translate;
|
22387
|
+
translate: 0 var(--pf-v6-c-tree-view__list--TranslateY);
|
22388
|
+
}
|
22050
22389
|
.pf-v6-c-tree-view__list-item .pf-v6-c-tree-view__list-item {
|
22051
22390
|
--pf-v6-c-tree-view__node-toggle-icon--Rotate: var(--pf-v6-c-tree-view__node-toggle-icon--base--Rotate);
|
22052
22391
|
--pf-v6-c-tree-view__node-toggle--Color: var(--pf-v6-c-tree-view__node-toggle--Color--base);
|
@@ -22055,6 +22394,11 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
22055
22394
|
--pf-v6-c-tree-view__node-toggle--Color: var(--pf-v6-c-tree-view__list-item--m-expanded__node-toggle--Color);
|
22056
22395
|
--pf-v6-c-tree-view__node-toggle-icon--Rotate: var(--pf-v6-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate);
|
22057
22396
|
}
|
22397
|
+
.pf-v6-c-tree-view__list-item.pf-m-expanded > .pf-v6-c-tree-view__list {
|
22398
|
+
opacity: var(--pf-v6-c-tree-view--m-expanded__list--Opacity);
|
22399
|
+
transition-duration: var(--pf-v6-c-tree-view__list--TransitionDuration--expand--fade), var(--pf-v6-c-tree-view__list--TransitionDuration--expand--slide);
|
22400
|
+
translate: 0 var(--pf-v6-c-tree-view--m-expanded__list--TranslateY);
|
22401
|
+
}
|
22058
22402
|
|
22059
22403
|
.pf-v6-c-tree-view__node,
|
22060
22404
|
.pf-v6-c-tree-view__node-container {
|