@patternfly/react-styles 6.2.0-prerelease.9 → 6.2.1-prerelease.0
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 +32 -0
- package/css/components/Accordion/accordion.css +3 -1
- package/css/components/Alert/alert-group.css +2 -2
- package/css/components/Banner/banner.css +2 -2
- package/css/components/Button/button.css +25 -0
- package/css/components/Button/button.d.ts +2 -0
- package/css/components/Button/button.js +2 -0
- package/css/components/Button/button.mjs +2 -0
- package/css/components/Card/card.css +24 -2
- package/css/components/Card/card.d.ts +1 -0
- package/css/components/Card/card.js +1 -0
- package/css/components/Card/card.mjs +1 -0
- package/css/components/ClipboardCopy/clipboard-copy.css +6 -1
- package/css/components/ClipboardCopy/clipboard-copy.d.ts +1 -0
- package/css/components/ClipboardCopy/clipboard-copy.js +1 -0
- package/css/components/ClipboardCopy/clipboard-copy.mjs +1 -0
- package/css/components/CodeEditor/code-editor.css +3 -0
- package/css/components/CodeEditor/code-editor.d.ts +1 -0
- package/css/components/CodeEditor/code-editor.js +1 -0
- package/css/components/CodeEditor/code-editor.mjs +1 -0
- package/css/components/DataList/data-list.css +3 -1
- package/css/components/Drawer/drawer.css +28 -14
- package/css/components/DualListSelector/dual-list-selector.css +4 -2
- package/css/components/ExpandableSection/expandable-section.css +3 -1
- package/css/components/Form/form.css +4 -2
- package/css/components/FormControl/form-control.css +109 -43
- package/css/components/HelperText/helper-text.css +2 -2
- package/css/components/JumpLinks/jump-links.css +4 -2
- package/css/components/Menu/menu.css +4 -4
- package/css/components/MenuToggle/menu-toggle.css +1 -1
- package/css/components/Nav/nav.css +12 -15
- package/css/components/NotificationDrawer/notification-drawer.css +3 -1
- package/css/components/Page/page.css +20 -4
- package/css/components/Page/page.d.ts +1 -0
- package/css/components/Page/page.js +1 -0
- package/css/components/Page/page.mjs +1 -0
- package/css/components/Switch/switch.css +3 -1
- package/css/components/Table/table-grid.css +3 -1
- package/css/components/Table/table.css +7 -5
- package/css/components/Tabs/tabs.css +71 -2
- 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/Toolbar/toolbar.css +10 -3
- package/css/components/Toolbar/toolbar.d.ts +1 -0
- package/css/components/Toolbar/toolbar.js +1 -0
- package/css/components/Toolbar/toolbar.mjs +1 -0
- package/css/components/Truncate/truncate.css +5 -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/Wizard/wizard.css +4 -2
- package/css/components/_index.css +364 -114
- package/css/components/_index.d.ts +6 -3
- package/css/components/_index.js +6 -3
- package/css/components/_index.mjs +6 -3
- package/css/docs/components/Toolbar/examples/Toolbar.css +3 -0
- package/package.json +3 -3
@@ -210,7 +210,9 @@
|
|
210
210
|
--pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--default);
|
211
211
|
--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
|
212
212
|
--pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--heading--default);
|
213
|
-
--pf-v6-c-accordion__toggle-icon--
|
213
|
+
--pf-v6-c-accordion__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
214
|
+
--pf-v6-c-accordion__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
215
|
+
--pf-v6-c-accordion__toggle-icon--Transition: transform var(--pf-v6-c-accordion__toggle-icon--TransitionDuration) var(--pf-v6-c-accordion__toggle-icon--TransitionTimingFunction);
|
214
216
|
--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg;
|
215
217
|
--pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
|
216
218
|
--pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
|
@@ -675,14 +677,14 @@
|
|
675
677
|
transition: var(--pf-v6-c-alert-group--m-toast__item--c-alert--Transition);
|
676
678
|
}
|
677
679
|
}
|
678
|
-
.pf-v6-c-alert-group__item.pf-m-offstage-top {
|
680
|
+
.pf-v6-c-alert-group__item.pf-m-offstage-top:first-child {
|
679
681
|
grid-template-rows: 0fr;
|
680
682
|
margin-block: 0;
|
681
683
|
overflow: hidden;
|
682
684
|
opacity: 0;
|
683
685
|
transform: translateY(-100%);
|
684
686
|
}
|
685
|
-
.pf-v6-c-alert-group__item.pf-m-offstage-top .pf-v6-c-alert {
|
687
|
+
.pf-v6-c-alert-group__item.pf-m-offstage-top:first-child .pf-v6-c-alert {
|
686
688
|
min-height: 0;
|
687
689
|
padding-block-start: 0;
|
688
690
|
padding-block-end: 0;
|
@@ -1250,8 +1252,8 @@
|
|
1250
1252
|
cursor: not-allowed;
|
1251
1253
|
}
|
1252
1254
|
.pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
|
1253
|
-
--pf-v6-c-button--m-link--Color: var(--pf-v6-c-banner--link--Color);
|
1254
|
-
--pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
|
1255
|
+
--pf-v6-c-button--m-link--m-inline--Color: var(--pf-v6-c-banner--link--Color);
|
1256
|
+
--pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
|
1255
1257
|
--pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
|
1256
1258
|
text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
|
1257
1259
|
}
|
@@ -1673,6 +1675,12 @@ button.pf-v6-c-breadcrumb__link {
|
|
1673
1675
|
--pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
|
1674
1676
|
--pf-v6-c-button--m-notify__icon--AnimationDuration--notify: var(--pf-t--global--motion--duration--3xl);
|
1675
1677
|
--pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify: var(--pf-t--global--motion--timing-function--default);
|
1678
|
+
--pf-v6-c-button--m-favorite__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
1679
|
+
--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
1680
|
+
--pf-v6-c-button--m-favorited__icon--Color: var(--pf-t--global--color--favorite--default);
|
1681
|
+
--pf-v6-c-button--m-favorited--hover__icon--Color: var(--pf-t--global--color--favorite--hover);
|
1682
|
+
--pf-v6-c-button--m-favorited__icon--AnimationDuration: var(--pf-t--global--motion--duration--icon--long);
|
1683
|
+
--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
1676
1684
|
--pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
|
1677
1685
|
--pf-v6-c-button__progress--Opacity: 0;
|
1678
1686
|
--pf-v6-c-button__progress--TranslateY: -50%;
|
@@ -1982,6 +1990,20 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
1982
1990
|
--pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-display-lg--PaddingInlineStart);
|
1983
1991
|
--pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-display-lg--FontSize);
|
1984
1992
|
}
|
1993
|
+
.pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
|
1994
|
+
transition-timing-function: var(--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction);
|
1995
|
+
transition-duration: var(--pf-v6-c-button--m-favorite__icon--TransitionDuration);
|
1996
|
+
transition-property: color;
|
1997
|
+
}
|
1998
|
+
.pf-v6-c-button.pf-m-favorited {
|
1999
|
+
--pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
|
2000
|
+
--pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
|
2001
|
+
}
|
2002
|
+
.pf-v6-c-button.pf-m-favorited .pf-v6-c-button__icon {
|
2003
|
+
animation-name: pf-v6-c-button-icon-favorited;
|
2004
|
+
animation-duration: var(--pf-v6-c-button--m-favorited__icon--AnimationDuration);
|
2005
|
+
animation-timing-function: var(--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction);
|
2006
|
+
}
|
1985
2007
|
.pf-v6-c-button:hover, .pf-v6-c-button:focus {
|
1986
2008
|
--pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
|
1987
2009
|
--pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
|
@@ -2080,6 +2102,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2080
2102
|
transform: rotate(-60deg);
|
2081
2103
|
}
|
2082
2104
|
}
|
2105
|
+
@keyframes pf-v6-c-button-icon-favorited {
|
2106
|
+
50% {
|
2107
|
+
transform: scale(1.5);
|
2108
|
+
}
|
2109
|
+
}
|
2083
2110
|
.pf-v6-c-calendar-month {
|
2084
2111
|
--pf-v6-c-calendar-month--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
2085
2112
|
--pf-v6-c-calendar-month--PaddingBlockStart: var(--pf-t--global--spacer--lg);
|
@@ -2302,6 +2329,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2302
2329
|
--pf-v6-c-card__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
|
2303
2330
|
--pf-v6-c-card__title-text--FontWeight: var(--pf-t--global--font--weight--heading--default);
|
2304
2331
|
--pf-v6-c-card__title-text--LineHeight: var(--pf-t--global--font--line-height--heading);
|
2332
|
+
--pf-v6-c-card__title-text--OverflowWrap: break-word;
|
2305
2333
|
--pf-v6-c-card--c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
|
2306
2334
|
--pf-v6-c-card__body--FontSize: var(--pf-t--global--font--size--body--default);
|
2307
2335
|
--pf-v6-c-card__footer--FontSize: var(--pf-t--global--font--size--body--default);
|
@@ -2310,12 +2338,14 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2310
2338
|
--pf-v6-c-card__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--default);
|
2311
2339
|
--pf-v6-c-card__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
|
2312
2340
|
--pf-v6-c-card__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
|
2341
|
+
--pf-v6-c-card__header--m-wrap--RowGap: var(--pf-t--global--spacer--sm);
|
2342
|
+
--pf-v6-c-card__header--m-wrap--ColumnGap: var(--pf-t--global--spacer--md);
|
2313
2343
|
--pf-v6-c-card__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
|
2314
2344
|
--pf-v6-c-card__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
|
2315
2345
|
--pf-v6-c-card__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
|
2316
2346
|
--pf-v6-c-card__header-toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
|
2317
2347
|
--pf-v6-c-card__header-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
2318
|
-
--pf-v6-c-card__header-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--
|
2348
|
+
--pf-v6-c-card__header-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
2319
2349
|
--pf-v6-c-card--m-expanded__header-toggle-icon--Rotate: 90deg;
|
2320
2350
|
--pf-v6-c-card--m-selectable--BorderWidth: var(--pf-v6-c-card--BorderWidth);
|
2321
2351
|
--pf-v6-c-card--m-clickable--m-current--BorderColor: var(--pf-t--global--border--color--clicked);
|
@@ -2473,6 +2503,21 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2473
2503
|
.pf-v6-c-card__header.pf-m-toggle-right .pf-v6-c-card__header-toggle {
|
2474
2504
|
order: 2;
|
2475
2505
|
}
|
2506
|
+
.pf-v6-c-card__header.pf-m-wrap {
|
2507
|
+
--pf-v6-c-card__actions--PaddingInlineStart: 0;
|
2508
|
+
gap: var(--pf-v6-c-card__header--m-wrap--RowGap) var(--pf-v6-c-card__header--m-wrap--ColumnGap);
|
2509
|
+
}
|
2510
|
+
.pf-v6-c-card__header.pf-m-wrap,
|
2511
|
+
.pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions {
|
2512
|
+
flex-wrap: wrap;
|
2513
|
+
row-gap: var(--pf-v6-c-card__header--m-wrap--RowGap);
|
2514
|
+
}
|
2515
|
+
.pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions {
|
2516
|
+
margin-inline-start: 0;
|
2517
|
+
}
|
2518
|
+
.pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions + * {
|
2519
|
+
margin-inline-end: auto;
|
2520
|
+
}
|
2476
2521
|
|
2477
2522
|
.pf-v6-c-card__header-main {
|
2478
2523
|
flex-grow: 1;
|
@@ -2488,18 +2533,22 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
|
|
2488
2533
|
|
2489
2534
|
.pf-v6-c-card__header-toggle-icon {
|
2490
2535
|
display: inline-block;
|
2491
|
-
transition
|
2536
|
+
transition-timing-function: var(--pf-v6-c-card__header-toggle-icon--TransitionTimingFunction);
|
2537
|
+
transition-duration: var(--pf-v6-c-card__header-toggle-icon--TransitionDuration);
|
2538
|
+
transition-property: transform;
|
2492
2539
|
}
|
2493
2540
|
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-card__header-toggle-icon {
|
2494
2541
|
scale: -1 1;
|
2495
2542
|
}
|
2496
2543
|
|
2497
2544
|
.pf-v6-c-card__title-text {
|
2545
|
+
overflow: auto;
|
2498
2546
|
font-family: var(--pf-v6-c-card__title-text--FontFamily);
|
2499
2547
|
font-size: var(--pf-v6-c-card__title-text--FontSize);
|
2500
2548
|
font-weight: var(--pf-v6-c-card__title-text--FontWeight);
|
2501
2549
|
line-height: var(--pf-v6-c-card__title-text--LineHeight);
|
2502
2550
|
color: var(--pf-v6-c-card__title-text--Color);
|
2551
|
+
overflow-wrap: var(--pf-v6-c-card__title-text--OverflowWrap);
|
2503
2552
|
}
|
2504
2553
|
|
2505
2554
|
.pf-v6-c-card__actions {
|
@@ -2699,7 +2748,9 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
|
|
2699
2748
|
}
|
2700
2749
|
|
2701
2750
|
.pf-v6-c-clipboard-copy {
|
2702
|
-
--pf-v6-c-clipboard-copy__toggle-icon--
|
2751
|
+
--pf-v6-c-clipboard-copy__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
2752
|
+
--pf-v6-c-clipboard-copy__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
2753
|
+
--pf-v6-c-clipboard-copy__toggle-icon--Transition: transform var(--pf-v6-c-clipboard-copy__toggle-icon--TransitionDuration) var(--pf-v6-c-clipboard-copy__toggle-icon--TransitionTimingFunction);
|
2703
2754
|
--pf-v6-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
|
2704
2755
|
--pf-v6-c-clipboard-copy__expandable-content--MarginBlockStart: var(--pf-t--global--spacer--xs);
|
2705
2756
|
--pf-v6-c-clipboard-copy__expandable-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
@@ -2739,6 +2790,9 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
|
|
2739
2790
|
.pf-v6-c-clipboard-copy.pf-m-inline.pf-m-block {
|
2740
2791
|
display: block;
|
2741
2792
|
}
|
2793
|
+
.pf-v6-c-clipboard-copy.pf-m-inline.pf-m-truncate {
|
2794
|
+
display: inline-flex;
|
2795
|
+
}
|
2742
2796
|
|
2743
2797
|
.pf-v6-c-clipboard-copy__group {
|
2744
2798
|
display: flex;
|
@@ -2997,6 +3051,9 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
|
|
2997
3051
|
.pf-v6-c-code-editor__main .monaco-editor {
|
2998
3052
|
background-color: var(--pf-v6-c-code-editor__main--BackgroundColor);
|
2999
3053
|
}
|
3054
|
+
.pf-v6-c-code-editor__main a.label-name {
|
3055
|
+
text-decoration-line: none;
|
3056
|
+
}
|
3000
3057
|
|
3001
3058
|
.pf-v6-c-code-editor__header + .pf-v6-c-code-editor__main {
|
3002
3059
|
border-block-start-width: 0;
|
@@ -3764,7 +3821,9 @@ ul) {
|
|
3764
3821
|
--pf-v6-c-data-list__toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
|
3765
3822
|
--pf-v6-c-data-list__toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
|
3766
3823
|
--pf-v6-c-data-list__toggle-icon--Height: calc(var(--pf-v6-c-data-list--FontSize) * var(--pf-v6-c-data-list--LineHeight));
|
3767
|
-
--pf-v6-c-data-list__toggle-icon--
|
3824
|
+
--pf-v6-c-data-list__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
3825
|
+
--pf-v6-c-data-list__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
3826
|
+
--pf-v6-c-data-list__toggle-icon--Transition: transform var(--pf-v6-c-data-list__toggle-icon--TransitionDuration) var(--pf-v6-c-data-list__toggle-icon--TransitionTimingFunction);
|
3768
3827
|
--pf-v6-c-data-list__toggle-icon--Rotate: 0;
|
3769
3828
|
--pf-v6-c-data-list__item--m-expanded__toggle-icon--Rotate: 90deg;
|
3770
3829
|
--pf-v6-c-data-list__item-draggable-button--BackgroundColor: transparent;
|
@@ -4600,7 +4659,7 @@ ul) {
|
|
4600
4659
|
--pf-v6-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
|
4601
4660
|
--pf-v6-c-dual-list-selector__item-toggle-icon--Rotate: 0;
|
4602
4661
|
--pf-v6-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
|
4603
|
-
--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--
|
4662
|
+
--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
4604
4663
|
--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
4605
4664
|
--pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-v6-c-dual-list-selector__list-item-row--FontSize);
|
4606
4665
|
--pf-v6-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
|
@@ -4824,7 +4883,9 @@ ul) {
|
|
4824
4883
|
min-width: var(--pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth);
|
4825
4884
|
color: var(--pf-v6-c-dual-list-selector__item-toggle-icon--Color, inherit);
|
4826
4885
|
text-align: center;
|
4827
|
-
transition
|
4886
|
+
transition-timing-function: var(--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionTimingFunction);
|
4887
|
+
transition-duration: var(--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionDuration);
|
4888
|
+
transition-property: transform;
|
4828
4889
|
transform: rotate(var(--pf-v6-c-dual-list-selector__item-toggle-icon--Rotate));
|
4829
4890
|
}
|
4830
4891
|
|
@@ -5249,9 +5310,15 @@ ul) {
|
|
5249
5310
|
--pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
|
5250
5311
|
--pf-v6-c-drawer__panel--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
5251
5312
|
--pf-v6-c-drawer__panel--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
|
5313
|
+
--pf-v6-c-drawer__panel--TransitionDelay: 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus), var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
|
5314
|
+
--pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--fade);
|
5315
|
+
--pf-v6-c-drawer__panel--TransitionDelay--expand--focus: 0s;
|
5252
5316
|
--pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
|
5253
|
-
--pf-v6-c-drawer__panel--TransitionDuration: var(--pf-t--global--motion--duration--
|
5254
|
-
--pf-v6-c-drawer__panel--
|
5317
|
+
--pf-v6-c-drawer__panel--TransitionDuration--fade: var(--pf-t--global--motion--duration--fade--default);
|
5318
|
+
--pf-v6-c-drawer__panel--TransitionDuration: var(--pf-v6-c-drawer__panel--TransitionDuration--fade), 0s, 0s;
|
5319
|
+
--pf-v6-c-drawer__panel--TransitionProperty: opacity, visibility, transform;
|
5320
|
+
--pf-v6-c-drawer__panel--Opacity: 0;
|
5321
|
+
--pf-v6-c-drawer--m-expanded__panel--Opacity: 1;
|
5255
5322
|
--pf-v6-c-drawer__panel--FlexBasis: 100%;
|
5256
5323
|
--pf-v6-c-drawer__panel--md--FlexBasis--min: 1.5rem;
|
5257
5324
|
--pf-v6-c-drawer__panel--md--FlexBasis: 50%;
|
@@ -5341,6 +5408,17 @@ ul) {
|
|
5341
5408
|
--pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd: var(--pf-v6-c-drawer__panel--after--Width);
|
5342
5409
|
--pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: var(--pf-v6-c-drawer__panel--after--Width);
|
5343
5410
|
}
|
5411
|
+
@media screen and (prefers-reduced-motion: no-preference) {
|
5412
|
+
.pf-v6-c-drawer {
|
5413
|
+
--pf-v6-c-drawer__panel--TransitionDuration--slide: var(--pf-t--global--motion--duration--slide-in--short);
|
5414
|
+
--pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--slide);
|
5415
|
+
--pf-v6-c-drawer__panel--TransitionDelay: 0s, 0s, 0s, 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
|
5416
|
+
--pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
|
5417
|
+
--pf-v6-c-drawer__panel--TransitionDuration: 0s, var(--pf-v6-c-drawer__panel--TransitionDuration--slide), 0s, 0s, 0s;
|
5418
|
+
--pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis, visibility;
|
5419
|
+
--pf-v6-c-drawer__panel--Opacity: 1;
|
5420
|
+
}
|
5421
|
+
}
|
5344
5422
|
@media screen and (min-width: 75rem) {
|
5345
5423
|
.pf-v6-c-drawer {
|
5346
5424
|
--pf-v6-c-drawer__panel--MinWidth: var(--pf-v6-c-drawer__panel--xl--MinWidth);
|
@@ -5388,8 +5466,13 @@ ul) {
|
|
5388
5466
|
.pf-v6-c-drawer.pf-m-panel-bottom > .pf-v6-c-drawer__main {
|
5389
5467
|
flex-direction: column;
|
5390
5468
|
}
|
5469
|
+
.pf-v6-c-drawer.pf-m-expanded {
|
5470
|
+
--pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDelay--expand--focus);
|
5471
|
+
}
|
5391
5472
|
.pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
|
5392
5473
|
transform: translateX(-100%);
|
5474
|
+
--pf-v6-c-drawer__panel--Opacity: var(--pf-v6-c-drawer--m-expanded__panel--Opacity);
|
5475
|
+
visibility: visible;
|
5393
5476
|
}
|
5394
5477
|
: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 {
|
5395
5478
|
transform: translateX(calc(-100% * var(--pf-v6-global--inverse--multiplier)));
|
@@ -5462,8 +5545,11 @@ ul) {
|
|
5462
5545
|
order: 1;
|
5463
5546
|
max-height: var(--pf-v6-c-drawer__panel--MaxHeight);
|
5464
5547
|
overflow: auto;
|
5548
|
+
visibility: hidden;
|
5465
5549
|
background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
|
5466
5550
|
box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
|
5551
|
+
opacity: var(--pf-v6-c-drawer__panel--Opacity);
|
5552
|
+
transition-delay: var(--pf-v6-c-drawer__panel--TransitionDelay);
|
5467
5553
|
transition-timing-function: var(--pf-v6-c-drawer__panel--TransitionTimingFunction);
|
5468
5554
|
transition-duration: var(--pf-v6-c-drawer__panel--TransitionDuration);
|
5469
5555
|
transition-property: var(--pf-v6-c-drawer__panel--TransitionProperty);
|
@@ -5520,17 +5606,6 @@ ul) {
|
|
5520
5606
|
padding-block-end: var(--pf-v6-c-drawer__panel--PaddingBlockEnd);
|
5521
5607
|
}
|
5522
5608
|
|
5523
|
-
@keyframes pf-remove-tab-focus {
|
5524
|
-
to {
|
5525
|
-
visibility: hidden;
|
5526
|
-
}
|
5527
|
-
}
|
5528
|
-
.pf-v6-c-drawer__panel[hidden] {
|
5529
|
-
animation-name: pf-remove-tab-focus;
|
5530
|
-
animation-delay: var(--pf-v6-c-drawer__panel--TransitionDuration);
|
5531
|
-
animation-fill-mode: forwards;
|
5532
|
-
}
|
5533
|
-
|
5534
5609
|
.pf-v6-c-drawer__head {
|
5535
5610
|
display: grid;
|
5536
5611
|
grid-template-columns: auto;
|
@@ -5638,7 +5713,7 @@ ul) {
|
|
5638
5713
|
.pf-v6-c-drawer {
|
5639
5714
|
min-width: var(--pf-v6-c-drawer__panel--MinWidth);
|
5640
5715
|
}
|
5641
|
-
.pf-v6-c-drawer
|
5716
|
+
.pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
|
5642
5717
|
box-shadow: var(--pf-v6-c-drawer--m-expanded__panel--BoxShadow);
|
5643
5718
|
}
|
5644
5719
|
.pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable {
|
@@ -6215,7 +6290,9 @@ ul) {
|
|
6215
6290
|
--pf-v6-c-expandable-section--Gap: var(--pf-t--global--spacer--sm);
|
6216
6291
|
--pf-v6-c-expandable-section__toggle-icon--MinWidth: 1em;
|
6217
6292
|
--pf-v6-c-expandable-section__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
|
6218
|
-
--pf-v6-c-expandable-section__toggle-icon--
|
6293
|
+
--pf-v6-c-expandable-section__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
6294
|
+
--pf-v6-c-expandable-section__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
6295
|
+
--pf-v6-c-expandable-section__toggle-icon--Transition: transform var(--pf-v6-c-expandable-section__toggle-icon--TransitionDuration) var(--pf-v6-c-expandable-section__toggle-icon--TransitionTimingFunction);
|
6219
6296
|
--pf-v6-c-expandable-section__toggle-icon--Rotate: 0;
|
6220
6297
|
--pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
|
6221
6298
|
--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
|
@@ -6407,7 +6484,7 @@ ul) {
|
|
6407
6484
|
--pf-v6-c-form__field-group__field-group--field-group__field-group-toggle--after--BorderBlockStartWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
|
6408
6485
|
--pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
|
6409
6486
|
--pf-v6-c-form__field-group-toggle-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
|
6410
|
-
--pf-v6-c-form__field-group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--
|
6487
|
+
--pf-v6-c-form__field-group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
6411
6488
|
--pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
6412
6489
|
--pf-v6-c-form__field-group-toggle-icon--MinWidth: var(--pf-t--global--font--size--body--default);
|
6413
6490
|
--pf-v6-c-form__field-group-toggle-icon--Rotate: 0;
|
@@ -6805,7 +6882,9 @@ ul) {
|
|
6805
6882
|
display: inline-block;
|
6806
6883
|
min-width: var(--pf-v6-c-form__field-group-toggle-icon--MinWidth);
|
6807
6884
|
text-align: center;
|
6808
|
-
transition
|
6885
|
+
transition-timing-function: var(--pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction);
|
6886
|
+
transition-duration: var(--pf-v6-c-form__field-group-toggle-icon--TransitionDuration);
|
6887
|
+
transition-property: transform;
|
6809
6888
|
transform: rotate(var(--pf-v6-c-form__field-group-toggle-icon--Rotate));
|
6810
6889
|
}
|
6811
6890
|
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-form__field-group-toggle-icon {
|
@@ -6879,10 +6958,29 @@ ul) {
|
|
6879
6958
|
--pf-v6-c-form-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
|
6880
6959
|
--pf-v6-c-form-control--Width: 100%;
|
6881
6960
|
--pf-v6-c-form-control--inset--base: var(--pf-t--global--spacer--control--horizontal--default);
|
6882
|
-
--pf-v6-c-form-control--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
|
6883
|
-
--pf-v6-c-form-control--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
|
6884
|
-
--pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
|
6885
|
-
--pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control--inset--base);
|
6961
|
+
--pf-v6-c-form-control--PaddingBlockStart--base: var(--pf-t--global--spacer--control--vertical--default);
|
6962
|
+
--pf-v6-c-form-control--PaddingBlockEnd--base: var(--pf-t--global--spacer--control--vertical--default);
|
6963
|
+
--pf-v6-c-form-control--PaddingInlineEnd--base: var(--pf-v6-c-form-control--inset--base);
|
6964
|
+
--pf-v6-c-form-control--PaddingInlineStart--base: var(--pf-v6-c-form-control--inset--base);
|
6965
|
+
--pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
|
6966
|
+
--pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
|
6967
|
+
--pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
|
6968
|
+
--pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
|
6969
|
+
--pf-v6-c-form-control__utilities--input--PaddingInlineEnd: var(--pf-v6-c-form-control__input--PaddingInlineEnd);
|
6970
|
+
--pf-v6-c-form-control__utilities--select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--PaddingInlineEnd);
|
6971
|
+
--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd: var(--pf-v6-c-form-control__textarea--PaddingInlineEnd);
|
6972
|
+
--pf-v6-c-form-control__input--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
|
6973
|
+
--pf-v6-c-form-control__input--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
|
6974
|
+
--pf-v6-c-form-control__input--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
|
6975
|
+
--pf-v6-c-form-control__input--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
|
6976
|
+
--pf-v6-c-form-control__select--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
|
6977
|
+
--pf-v6-c-form-control__select--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
|
6978
|
+
--pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
|
6979
|
+
--pf-v6-c-form-control__select--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
|
6980
|
+
--pf-v6-c-form-control__textarea--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
|
6981
|
+
--pf-v6-c-form-control__textarea--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
|
6982
|
+
--pf-v6-c-form-control__textarea--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
|
6983
|
+
--pf-v6-c-form-control__textarea--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
|
6886
6984
|
--pf-v6-c-form-control--hover--after--BorderWidth: var(--pf-t--global--border--width--control--hover);
|
6887
6985
|
--pf-v6-c-form-control--hover--after--BorderColor: var(--pf-t--global--border--color--hover);
|
6888
6986
|
--pf-v6-c-form-control--m-success--hover--after--BorderColor: var(--pf-t--global--border--color--status--success--hover);
|
@@ -6902,25 +7000,33 @@ ul) {
|
|
6902
7000
|
--pf-v6-c-form-control--m-readonly--m-plain--BorderColor: transparent;
|
6903
7001
|
--pf-v6-c-form-control--m-readonly--m-plain--inset--base: 0;
|
6904
7002
|
--pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset: 0;
|
7003
|
+
--pf-v6-c-form-control--icon--width: var(--pf-v6-c-form-control--FontSize);
|
6905
7004
|
--pf-v6-c-form-control--m-success--after--BorderWidth: var(--pf-t--global--border--width--control--default);
|
6906
7005
|
--pf-v6-c-form-control--m-success--after--BorderColor: var(--pf-t--global--border--color--status--success--default);
|
6907
|
-
--pf-v6-c-form-control--m-success--PaddingInlineEnd:
|
7006
|
+
--pf-v6-c-form-control--m-success--PaddingInlineEnd: initial;
|
7007
|
+
--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd: initial;
|
7008
|
+
--pf-v6-c-form-control__input--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
|
7009
|
+
--pf-v6-c-form-control__select--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
|
7010
|
+
--pf-v6-c-form-control__textarea--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
|
6908
7011
|
--pf-v6-c-form-control--m-warning--after--BorderWidth: var(--pf-t--global--border--width--control--default);
|
6909
7012
|
--pf-v6-c-form-control--m-warning--after--BorderColor: var(--pf-t--global--border--color--status--warning--default);
|
6910
|
-
--pf-v6-c-form-control--m-warning--PaddingInlineEnd:
|
7013
|
+
--pf-v6-c-form-control--m-warning--PaddingInlineEnd: initial;
|
7014
|
+
--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd: initial;
|
7015
|
+
--pf-v6-c-form-control__input--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
|
7016
|
+
--pf-v6-c-form-control__select--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
|
7017
|
+
--pf-v6-c-form-control__textarea--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
|
6911
7018
|
--pf-v6-c-form-control--m-error--after--BorderWidth: var(--pf-t--global--border--width--control--default);
|
6912
7019
|
--pf-v6-c-form-control--m-error--after--BorderColor: var(--pf-t--global--border--color--status--danger--default);
|
6913
|
-
--pf-v6-c-form-control--m-error--PaddingInlineEnd:
|
7020
|
+
--pf-v6-c-form-control--m-error--PaddingInlineEnd: initial;
|
7021
|
+
--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd: initial;
|
6914
7022
|
--pf-v6-c-form-control--m-error--icon--width: var(--pf-v6-c-form-control--FontSize);
|
6915
|
-
--pf-v6-c-form-
|
7023
|
+
--pf-v6-c-form-control__input--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
|
7024
|
+
--pf-v6-c-form-control__select--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
|
7025
|
+
--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
|
7026
|
+
--pf-v6-c-form-control--m-icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
|
6916
7027
|
--pf-v6-c-form-control--m-icon--icon--width: var(--pf-v6-c-form-control--FontSize);
|
6917
7028
|
--pf-v6-c-form-control--m-icon--icon--spacer: calc(var(--pf-t--global--spacer--control--horizontal--default) / 2);
|
6918
|
-
--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--
|
6919
|
-
--pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
|
6920
|
-
--pf-v6-c-form-control__select--PaddingInlineStart: var(--pf-v6-c-form-control--inset--base);
|
6921
|
-
--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd: calc((var(--pf-v6-c-form-control__icon--FontSize) * 2) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart));
|
6922
|
-
--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd: calc((var(--pf-v6-c-form-control__icon--FontSize) * 2) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart));
|
6923
|
-
--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd: calc((var(--pf-v6-c-form-control__icon--FontSize) * 2) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart));
|
7029
|
+
--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--icon--width) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
|
6924
7030
|
--pf-v6-c-form-control--textarea--Width: var(--pf-v6-c-form-control--Width);
|
6925
7031
|
--pf-v6-c-form-control--textarea--Height: auto;
|
6926
7032
|
--pf-v6-c-form-control--textarea--PaddingBlockStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
|
@@ -6934,11 +7040,13 @@ ul) {
|
|
6934
7040
|
--pf-v6-c-form-control--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
|
6935
7041
|
--pf-v6-c-form-control--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
|
6936
7042
|
--pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
|
6937
|
-
--pf-v6-c-form-control__utilities--PaddingBlockStart: var(--pf-
|
6938
|
-
--pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control--
|
6939
|
-
--pf-v6-c-form-
|
6940
|
-
--pf-v6-c-form-control__toggle-icon--PaddingInlineStart:
|
7043
|
+
--pf-v6-c-form-control__utilities--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart);
|
7044
|
+
--pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
|
7045
|
+
--pf-v6-c-form-control__utilities--textarea--PaddingBlockStart: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
|
7046
|
+
--pf-v6-c-form-control__toggle-icon--PaddingInlineStart: 0;
|
7047
|
+
--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd: 0;
|
6941
7048
|
--pf-v6-c-form-control__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
|
7049
|
+
--pf-v6-c-form-control__toggle-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
|
6942
7050
|
--pf-v6-c-form-control--m-disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
|
6943
7051
|
}
|
6944
7052
|
|
@@ -6979,12 +7087,11 @@ ul) {
|
|
6979
7087
|
padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
|
6980
7088
|
padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
|
6981
7089
|
color: var(--pf-v6-c-form-control--Color);
|
7090
|
+
appearance: none;
|
6982
7091
|
background-color: transparent;
|
6983
7092
|
border: none;
|
6984
7093
|
border-radius: var(--pf-v6-c-form-control--BorderRadius);
|
6985
7094
|
outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
|
6986
|
-
-moz-appearance: none;
|
6987
|
-
-webkit-appearance: none;
|
6988
7095
|
}
|
6989
7096
|
.pf-v6-c-form-control > ::placeholder {
|
6990
7097
|
color: var(--pf-v6-c-form-control--m-placeholder--Color);
|
@@ -6992,6 +7099,14 @@ ul) {
|
|
6992
7099
|
.pf-v6-c-form-control > :is(input, select) {
|
6993
7100
|
text-overflow: ellipsis;
|
6994
7101
|
}
|
7102
|
+
.pf-v6-c-form-control:has(input) {
|
7103
|
+
--pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__input--PaddingBlockStart);
|
7104
|
+
--pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__input--PaddingBlockEnd);
|
7105
|
+
--pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__input--PaddingInlineStart);
|
7106
|
+
--pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control__input--PaddingInlineEnd);
|
7107
|
+
--pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd);
|
7108
|
+
}
|
7109
|
+
|
6995
7110
|
.pf-v6-c-form-control.pf-m-textarea {
|
6996
7111
|
padding-block-start: var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset);
|
6997
7112
|
padding-block-end: var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset);
|
@@ -7001,14 +7116,20 @@ ul) {
|
|
7001
7116
|
.pf-v6-c-form-control.pf-m-textarea.pf-m-success, .pf-v6-c-form-control.pf-m-textarea.pf-m-warning, .pf-v6-c-form-control.pf-m-textarea.pf-m-error {
|
7002
7117
|
--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset: calc(var(--pf-v6-c-form-control__icon--FontSize) + var(--pf-v6-c-form-control--ColumnGap));
|
7003
7118
|
}
|
7119
|
+
.pf-v6-c-form-control.pf-m-textarea:has(textarea) {
|
7120
|
+
--pf-v6-c-form-control--PaddingBlockStart: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
|
7121
|
+
--pf-v6-c-form-control--PaddingBlockEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockEnd) - var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset));
|
7122
|
+
--pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineStart) - var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset));
|
7123
|
+
--pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineEnd) - var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset) + var(--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset, 0px));
|
7124
|
+
--pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd);
|
7125
|
+
}
|
7004
7126
|
.pf-v6-c-form-control.pf-m-textarea > textarea {
|
7005
|
-
padding-block-start: calc(var(--pf-v6-c-form-control--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
|
7006
|
-
padding-block-end: calc(var(--pf-v6-c-form-control--PaddingBlockEnd) - var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset));
|
7007
|
-
padding-inline-start: calc(var(--pf-v6-c-form-control--PaddingInlineStart) - var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset));
|
7008
|
-
padding-inline-end: calc(var(--pf-v6-c-form-control--PaddingInlineEnd) - var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset) + var(--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset, 0));
|
7009
7127
|
outline-offset: 0;
|
7010
7128
|
scrollbar-gutter: stable;
|
7011
7129
|
}
|
7130
|
+
.pf-v6-c-form-control.pf-m-textarea .pf-v6-c-form-control__utilities {
|
7131
|
+
padding-block-start: var(--pf-v6-c-form-control__utilities--textarea--PaddingBlockStart);
|
7132
|
+
}
|
7012
7133
|
.pf-v6-c-form-control.pf-m-readonly {
|
7013
7134
|
--pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
|
7014
7135
|
--pf-v6-c-form-control--before--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
|
@@ -7041,37 +7162,58 @@ ul) {
|
|
7041
7162
|
cursor: not-allowed;
|
7042
7163
|
}
|
7043
7164
|
.pf-v6-c-form-control.pf-m-error {
|
7044
|
-
--pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd);
|
7045
7165
|
--pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-error--after--BorderColor);
|
7046
7166
|
--pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-error--hover--after--BorderColor);
|
7047
7167
|
--pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
|
7048
|
-
--pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd);
|
7049
7168
|
--pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
|
7050
7169
|
}
|
7051
|
-
.pf-v6-c-form-control.pf-m-error
|
7052
|
-
--pf-v6-c-form-control--PaddingInlineEnd
|
7170
|
+
.pf-v6-c-form-control.pf-m-error > textarea {
|
7171
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd));
|
7172
|
+
}
|
7173
|
+
.pf-v6-c-form-control.pf-m-error > input {
|
7174
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-error--PaddingInlineEnd));
|
7175
|
+
}
|
7176
|
+
.pf-v6-c-form-control.pf-m-error > select {
|
7177
|
+
padding-inline-end: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-error--PaddingInlineEnd));
|
7178
|
+
}
|
7179
|
+
.pf-v6-c-form-control.pf-m-error.pf-m-icon > :is(input) {
|
7180
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
|
7053
7181
|
}
|
7054
7182
|
.pf-v6-c-form-control.pf-m-success {
|
7055
|
-
--pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd);
|
7056
7183
|
--pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-success--after--BorderColor);
|
7057
7184
|
--pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-success--hover--after--BorderColor);
|
7058
7185
|
--pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-success__icon--m-status--Color);
|
7059
|
-
--pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd);
|
7060
7186
|
--pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-success--after--BorderWidth);
|
7061
7187
|
}
|
7062
|
-
.pf-v6-c-form-control.pf-m-success
|
7063
|
-
--pf-v6-c-form-control--PaddingInlineEnd
|
7188
|
+
.pf-v6-c-form-control.pf-m-success > textarea {
|
7189
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-success--PaddingInlineEnd));
|
7190
|
+
}
|
7191
|
+
.pf-v6-c-form-control.pf-m-success > input {
|
7192
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-success--PaddingInlineEnd));
|
7193
|
+
}
|
7194
|
+
.pf-v6-c-form-control.pf-m-success > select {
|
7195
|
+
padding-inline-end: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-success--PaddingInlineEnd));
|
7196
|
+
}
|
7197
|
+
.pf-v6-c-form-control.pf-m-success.pf-m-icon > :is(input) {
|
7198
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
|
7064
7199
|
}
|
7065
7200
|
.pf-v6-c-form-control.pf-m-warning {
|
7066
|
-
--pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd);
|
7067
7201
|
--pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-warning--after--BorderColor);
|
7068
7202
|
--pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-warning--hover--after--BorderColor);
|
7069
7203
|
--pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-warning__icon--m-status--Color);
|
7070
|
-
--pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd);
|
7071
7204
|
--pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-warning--after--BorderWidth);
|
7072
7205
|
}
|
7073
|
-
.pf-v6-c-form-control.pf-m-warning
|
7074
|
-
--pf-v6-c-form-control--PaddingInlineEnd
|
7206
|
+
.pf-v6-c-form-control.pf-m-warning > textarea {
|
7207
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-warning--PaddingInlineEnd));
|
7208
|
+
}
|
7209
|
+
.pf-v6-c-form-control.pf-m-warning > input {
|
7210
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-warning--PaddingInlineEnd));
|
7211
|
+
}
|
7212
|
+
.pf-v6-c-form-control.pf-m-warning > select {
|
7213
|
+
padding-inline-end: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-warning--PaddingInlineEnd));
|
7214
|
+
}
|
7215
|
+
.pf-v6-c-form-control.pf-m-warning.pf-m-icon > :is(input) {
|
7216
|
+
padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
|
7075
7217
|
}
|
7076
7218
|
.pf-v6-c-form-control:hover {
|
7077
7219
|
--pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
|
@@ -7080,13 +7222,19 @@ ul) {
|
|
7080
7222
|
.pf-v6-c-form-control.pf-m-icon {
|
7081
7223
|
--pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
|
7082
7224
|
}
|
7083
|
-
.pf-v6-c-form-control
|
7084
|
-
--pf-v6-c-form-control--
|
7225
|
+
.pf-v6-c-form-control:has(select) {
|
7226
|
+
--pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__select--PaddingBlockStart);
|
7227
|
+
--pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__select--PaddingBlockEnd);
|
7085
7228
|
--pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
|
7229
|
+
--pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) + var(--pf-v6-c-form-control__icon--FontSize));
|
7230
|
+
--pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
|
7086
7231
|
background-color: var(--pf-v6-c-form-control--BackgroundColor);
|
7087
7232
|
}
|
7233
|
+
.pf-v6-c-form-control:has(select) .pf-v6-c-form-control__utilities {
|
7234
|
+
padding-inline-end: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
|
7235
|
+
}
|
7088
7236
|
@-moz-document url-prefix() {
|
7089
|
-
.pf-v6-c-form-control
|
7237
|
+
.pf-v6-c-form-control:has(select) {
|
7090
7238
|
--pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
|
7091
7239
|
--pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
|
7092
7240
|
}
|
@@ -7132,6 +7280,7 @@ ul) {
|
|
7132
7280
|
grid-column: 3;
|
7133
7281
|
padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
|
7134
7282
|
padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
|
7283
|
+
font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
|
7135
7284
|
color: var(--pf-v6-c-form-control__toggle-icon--Color);
|
7136
7285
|
pointer-events: none;
|
7137
7286
|
}
|
@@ -7147,10 +7296,6 @@ ul) {
|
|
7147
7296
|
pointer-events: none;
|
7148
7297
|
}
|
7149
7298
|
|
7150
|
-
select ~ .pf-v6-c-form-control__utilities {
|
7151
|
-
--pf-v6-c-form-control__utilities--PaddingInlineEnd: 0;
|
7152
|
-
}
|
7153
|
-
|
7154
7299
|
.pf-v6-c-hint {
|
7155
7300
|
--pf-v6-c-hint--GridRowGap: var(--pf-t--global--spacer--sm);
|
7156
7301
|
--pf-v6-c-hint--PaddingBlockStart: var(--pf-t--global--spacer--lg);
|
@@ -7286,11 +7431,11 @@ select ~ .pf-v6-c-form-control__utilities {
|
|
7286
7431
|
--pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-error--FontWeight);
|
7287
7432
|
--pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-error--Color);
|
7288
7433
|
--pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color);
|
7289
|
-
animation-name:
|
7434
|
+
animation-name: pf-v6-c-helper-text-item-fade-in;
|
7290
7435
|
animation-duration: var(--pf-v6-c-helper-text__item--m-error--TransitionDuration--Opacity);
|
7291
7436
|
animation-timing-function: var(--pf-v6-c-helper-text__item--m-error--TransitionTimingFunction--Opacity);
|
7292
7437
|
}
|
7293
|
-
@keyframes
|
7438
|
+
@keyframes pf-v6-c-helper-text-item-fade-in {
|
7294
7439
|
from {
|
7295
7440
|
opacity: 0;
|
7296
7441
|
}
|
@@ -7770,7 +7915,7 @@ label.pf-v6-c-input-group__text {
|
|
7770
7915
|
--pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd: var(--pf-t--global--spacer--sm);
|
7771
7916
|
--pf-v6-c-jump-links__toggle--Display: none;
|
7772
7917
|
--pf-v6-c-jump-links__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
|
7773
|
-
--pf-v6-c-jump-links__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--
|
7918
|
+
--pf-v6-c-jump-links__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
7774
7919
|
--pf-v6-c-jump-links__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
7775
7920
|
--pf-v6-c-jump-links__toggle-icon--Rotate: 0;
|
7776
7921
|
--pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
|
@@ -7962,7 +8107,9 @@ label.pf-v6-c-input-group__text {
|
|
7962
8107
|
.pf-v6-c-jump-links__toggle-icon {
|
7963
8108
|
display: inline-block;
|
7964
8109
|
color: var(--pf-v6-c-jump-links__toggle-icon--Color);
|
7965
|
-
transition
|
8110
|
+
transition-timing-function: var(--pf-v6-c-jump-links__toggle-icon--TransitionTimingFunction);
|
8111
|
+
transition-duration: var(--pf-v6-c-jump-links__toggle-icon--TransitionDuration);
|
8112
|
+
transition-property: transform;
|
7966
8113
|
transform: rotate(var(--pf-v6-c-jump-links__toggle-icon--Rotate));
|
7967
8114
|
}
|
7968
8115
|
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-jump-links__toggle-icon {
|
@@ -10033,16 +10180,16 @@ ul.pf-v6-c-list {
|
|
10033
10180
|
opacity: 0;
|
10034
10181
|
}
|
10035
10182
|
|
10036
|
-
.pf-v6-c-menu__item-toggle-icon.pf-m-favorited, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button,
|
10183
|
+
.pf-v6-c-menu__item-toggle-icon.pf-m-favorited, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited),
|
10037
10184
|
.pf-v6-c-menu__item-action.pf-m-favorited,
|
10038
10185
|
.pf-v6-c-menu__item-action.pf-m-favorited:hover,
|
10039
|
-
.pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button {
|
10186
|
+
.pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited) {
|
10040
10187
|
--pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
|
10041
10188
|
}
|
10042
|
-
.pf-v6-c-menu__item-toggle-icon.pf-m-favorited:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:is(:hover, :focus),
|
10189
|
+
.pf-v6-c-menu__item-toggle-icon.pf-m-favorited:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus),
|
10043
10190
|
.pf-v6-c-menu__item-action.pf-m-favorited:is(:hover, :focus),
|
10044
10191
|
.pf-v6-c-menu__item-action.pf-m-favorited:hover:is(:hover, :focus),
|
10045
|
-
.pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:is(:hover, :focus) {
|
10192
|
+
.pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus) {
|
10046
10193
|
--pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
|
10047
10194
|
}
|
10048
10195
|
|
@@ -10172,7 +10319,7 @@ ul.pf-v6-c-list {
|
|
10172
10319
|
--pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
|
10173
10320
|
--pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
|
10174
10321
|
--pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
|
10175
|
-
--pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-
|
10322
|
+
--pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
|
10176
10323
|
--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
|
10177
10324
|
--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
|
10178
10325
|
--pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
|
@@ -11015,9 +11162,9 @@ ul.pf-v6-c-list {
|
|
11015
11162
|
--pf-v6-c-nav__subnav--PaddingBlockStart: var(--pf-v6-c-nav__item--RowGap);
|
11016
11163
|
--pf-v6-c-nav__subnav--PaddingBlockEnd: var(--pf-v6-c-nav__item--RowGap);
|
11017
11164
|
--pf-v6-c-nav__subnav--PaddingInlineStart: var(--pf-t--global--spacer--md);
|
11018
|
-
--pf-v6-c-nav__subnav--TransitionDuration--
|
11019
|
-
--pf-v6-c-nav__subnav--
|
11020
|
-
--pf-v6-c-nav__subnav--TransitionTimingFunction--
|
11165
|
+
--pf-v6-c-nav__subnav--TransitionDuration--expand: var(--pf-t--global--motion--duration--slide-in--default);
|
11166
|
+
--pf-v6-c-nav__subnav--TransitionDuration--collapse: var(--pf-t--global--motion--duration--slide-in--short);
|
11167
|
+
--pf-v6-c-nav__subnav--TransitionTimingFunction--expand: var(--pf-t--global--motion--timing-function--default);
|
11021
11168
|
--pf-v6-c-nav__scroll-button--BorderColor: var(--pf-t--global--border--color--default);
|
11022
11169
|
--pf-v6-c-nav__scroll-button--BorderWidth: var(--pf-t--global--border--width--divider--default);
|
11023
11170
|
--pf-v6-c-nav__scroll-button--first-of-type--c-button--BorderStartStartRadius: var(--pf-t--global--border--radius--pill);
|
@@ -11046,12 +11193,6 @@ ul.pf-v6-c-list {
|
|
11046
11193
|
--pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
|
11047
11194
|
--pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
|
11048
11195
|
}
|
11049
|
-
@media (prefers-reduced-motion: no-preference) {
|
11050
|
-
.pf-v6-c-nav {
|
11051
|
-
--pf-v6-c-nav__subnav--TransitionDuration--expansion: var(--pf-t--global--motion--duration--slide-in--default);
|
11052
|
-
--pf-v6-c-nav__subnav--hidden--TransitionDuration--expansion: var(--pf-t--global--motion--duration--slide-in--short);
|
11053
|
-
}
|
11054
|
-
}
|
11055
11196
|
|
11056
11197
|
.pf-v6-c-nav,
|
11057
11198
|
.pf-v6-c-nav__section,
|
@@ -11103,7 +11244,7 @@ ul.pf-v6-c-list {
|
|
11103
11244
|
}
|
11104
11245
|
|
11105
11246
|
[class^=pf-v6-c-nav][hidden] {
|
11106
|
-
|
11247
|
+
display: none;
|
11107
11248
|
}
|
11108
11249
|
|
11109
11250
|
.pf-v6-c-nav__nav,
|
@@ -11112,7 +11253,6 @@ ul.pf-v6-c-list {
|
|
11112
11253
|
--pf-v6-c-nav__item--RowGap--row-offset: calc(var(--pf-v6-c-nav__list--RowGap) / 2 * -1);
|
11113
11254
|
--pf-v6-c-nav__link--clickable-inset--Block: var(--pf-v6-c-nav__item--RowGap--row-offset);
|
11114
11255
|
--pf-v6-c-nav__button--RowGap--row-offset: calc(var(--pf-v6-c-nav__item--RowGap) * -1);
|
11115
|
-
visibility: visible;
|
11116
11256
|
}
|
11117
11257
|
|
11118
11258
|
.pf-v6-c-nav__list {
|
@@ -11129,15 +11269,19 @@ ul.pf-v6-c-list {
|
|
11129
11269
|
padding-block-end: var(--pf-v6-c-nav__subnav--PaddingBlockEnd);
|
11130
11270
|
padding-inline-start: var(--pf-v6-c-nav__subnav--PaddingInlineStart);
|
11131
11271
|
overflow-y: clip;
|
11132
|
-
transition-
|
11133
|
-
transition-
|
11134
|
-
transition-
|
11272
|
+
transition-delay: 0s, var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s);
|
11273
|
+
transition-timing-function: var(--pf-v6-c-nav__subnav--TransitionTimingFunction--expand);
|
11274
|
+
transition-duration: var(--pf-v6-c-nav__subnav--TransitionDuration--expand), 0s, 0s, 0s, 0s;
|
11275
|
+
transition-property: opacity, visibility, grid-template-rows, padding-block-start, padding-block-end;
|
11135
11276
|
}
|
11136
11277
|
.pf-v6-c-nav__subnav[hidden] {
|
11137
|
-
--pf-v6-c-nav__subnav--
|
11278
|
+
--pf-v6-c-nav__subnav--TransitionDelay--expand--focus: var(--pf-v6-c-nav__subnav--TransitionDuration--expand);
|
11279
|
+
--pf-v6-c-nav__subnav--TransitionDuration--expand: var(--pf-v6-c-nav__subnav--TransitionDuration--collapse);
|
11138
11280
|
--pf-v6-c-nav__subnav--PaddingBlockStart: 0;
|
11139
11281
|
--pf-v6-c-nav__subnav--PaddingBlockEnd: 0;
|
11282
|
+
display: grid;
|
11140
11283
|
grid-template-rows: 0fr;
|
11284
|
+
visibility: hidden;
|
11141
11285
|
opacity: 0;
|
11142
11286
|
}
|
11143
11287
|
|
@@ -11370,7 +11514,9 @@ ul.pf-v6-c-list {
|
|
11370
11514
|
--pf-v6-c-notification-drawer__group-toggle-count--MarginInlineEnd: var(--pf-t--global--spacer--md);
|
11371
11515
|
--pf-v6-c-notification-drawer__group-toggle-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
|
11372
11516
|
--pf-v6-c-notification-drawer__group-toggle-icon--Color: var(--pf-t--global--icon--color--regular);
|
11373
|
-
--pf-v6-c-notification-drawer__group-toggle-icon--
|
11517
|
+
--pf-v6-c-notification-drawer__group-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
11518
|
+
--pf-v6-c-notification-drawer__group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
11519
|
+
--pf-v6-c-notification-drawer__group-toggle-icon--Transition: transform var(--pf-v6-c-notification-drawer__group-toggle-icon--TransitionDuration) var(--pf-v6-c-notification-drawer__group-toggle-icon--TransitionTimingFunction);
|
11374
11520
|
--pf-v6-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate: 90deg;
|
11375
11521
|
}
|
11376
11522
|
|
@@ -11619,8 +11765,9 @@ ul.pf-v6-c-list {
|
|
11619
11765
|
--pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
|
11620
11766
|
--pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
|
11621
11767
|
--pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
|
11622
|
-
--pf-v6-c-page__sidebar--Width: 18.125rem;
|
11623
|
-
--pf-v6-c-page__sidebar--
|
11768
|
+
--pf-v6-c-page__sidebar--Width--base: 18.125rem;
|
11769
|
+
--pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--Width--base);
|
11770
|
+
--pf-v6-c-page__sidebar--xl--Width: var(--pf-v6-c-page__sidebar--Width--base);
|
11624
11771
|
--pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
|
11625
11772
|
--pf-v6-c-page__sidebar--BoxShadow: none;
|
11626
11773
|
--pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
|
@@ -11652,12 +11799,18 @@ ul.pf-v6-c-list {
|
|
11652
11799
|
--pf-v6-c-page__main-container--GridArea: main;
|
11653
11800
|
--pf-v6-c-page--masthead--main-container--GridArea: sidebar / sidebar / main / main;
|
11654
11801
|
--pf-v6-c-page__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg));
|
11802
|
+
--pf-v6-c-page__main-container--AlignSelf: start;
|
11655
11803
|
--pf-v6-c-page__main-container--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
11656
11804
|
--pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page--inset);
|
11657
11805
|
--pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page--inset);
|
11658
11806
|
--pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--medium);
|
11659
11807
|
--pf-v6-c-page__main-container--BorderWidth: 0.25rem;
|
11660
11808
|
--pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
|
11809
|
+
--pf-v6-c-page__main-container--xs--AlignSelf: stretch;
|
11810
|
+
--pf-v6-c-page__main-container--xs--BorderRadius: 0;
|
11811
|
+
--pf-v6-c-page__main-container--xs--MarginInlineStart: 0;
|
11812
|
+
--pf-v6-c-page__main-container--xs--MaxHeight: 100%;
|
11813
|
+
--pf-v6-c-page__main-container--xs--MarginInlineEnd: 0;
|
11661
11814
|
--pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
11662
11815
|
--pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
|
11663
11816
|
--pf-v6-c-page__main-section--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
@@ -12015,7 +12168,7 @@ ul.pf-v6-c-list {
|
|
12015
12168
|
.pf-v6-c-page__main-container {
|
12016
12169
|
display: flex;
|
12017
12170
|
flex-direction: column;
|
12018
|
-
align-self:
|
12171
|
+
align-self: var(--pf-v6-c-page__main-container--AlignSelf);
|
12019
12172
|
max-height: var(--pf-v6-c-page__main-container--MaxHeight);
|
12020
12173
|
margin-inline-start: var(--pf-v6-c-page__main-container--MarginInlineStart);
|
12021
12174
|
margin-inline-end: var(--pf-v6-c-page__main-container--MarginInlineEnd);
|
@@ -12023,6 +12176,15 @@ ul.pf-v6-c-list {
|
|
12023
12176
|
border: var(--pf-v6-c-page__main-container--BorderWidth) solid var(--pf-v6-c-page__main-container--BorderColor);
|
12024
12177
|
border-radius: var(--pf-v6-c-page__main-container--BorderRadius);
|
12025
12178
|
}
|
12179
|
+
@media screen and (max-width: calc(48rem - 1px)) {
|
12180
|
+
.pf-v6-c-page__main-container {
|
12181
|
+
--pf-v6-c-page__main-container--AlignSelf: var(--pf-v6-c-page__main-container--xs--AlignSelf);
|
12182
|
+
--pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page__main-container--xs--MarginInlineStart);
|
12183
|
+
--pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page__main-container--xs--MarginInlineEnd);
|
12184
|
+
--pf-v6-c-page__main-container--MaxHeight: var(--pf-v6-c-page__main-container--xs--MaxHeight);
|
12185
|
+
--pf-v6-c-page__main-container--BorderRadius: var(--pf-v6-c-page__main-container--xs--BorderRadius);
|
12186
|
+
}
|
12187
|
+
}
|
12026
12188
|
|
12027
12189
|
.pf-v6-c-page__main-container,
|
12028
12190
|
.pf-v6-c-page__drawer {
|
@@ -12033,7 +12195,7 @@ ul.pf-v6-c-list {
|
|
12033
12195
|
-webkit-overflow-scrolling: touch;
|
12034
12196
|
}
|
12035
12197
|
@media screen and (min-width: 75rem) {
|
12036
|
-
.pf-v6-c-masthead + .pf-v6-c-page__main-container, .pf-v6-c-page__sidebar.pf-m-collapsed + .pf-v6-c-page__main-container,
|
12198
|
+
.pf-v6-c-page.pf-m-no-sidebar, .pf-v6-c-masthead + .pf-v6-c-page__main-container, .pf-v6-c-page__sidebar.pf-m-collapsed + .pf-v6-c-page__main-container,
|
12037
12199
|
.pf-v6-c-masthead + .pf-v6-c-page__drawer,
|
12038
12200
|
.pf-v6-c-page__sidebar.pf-m-collapsed + .pf-v6-c-page__drawer {
|
12039
12201
|
--pf-v6-c-page__main-container--GridArea: var(--pf-v6-c-page--masthead--main-container--GridArea);
|
@@ -14683,7 +14845,9 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
14683
14845
|
--pf-v6-c-switch__toggle--before--Height: var(--pf-v6-c-switch__toggle--before--Width);
|
14684
14846
|
--pf-v6-c-switch__toggle--before--InsetInlineStart: calc((var(--pf-v6-c-switch__toggle--Height) - var(--pf-v6-c-switch__toggle--before--Height)) / 2);
|
14685
14847
|
--pf-v6-c-switch__toggle--before--BorderRadius: var(--pf-t--global--border--radius--large);
|
14686
|
-
--pf-v6-c-switch__toggle--before--
|
14848
|
+
--pf-v6-c-switch__toggle--before--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
14849
|
+
--pf-v6-c-switch__toggle--before--TransitionDuration: var(--pf-t--global--motion--duration--md);
|
14850
|
+
--pf-v6-c-switch__toggle--before--Transition: transform var(--pf-v6-c-switch__toggle--before--TransitionTimingFunction) var(--pf-v6-c-switch__toggle--before--TransitionDuration), background-color var(--pf-v6-c-switch__toggle--before--TransitionTimingFunction) var(--pf-v6-c-switch__toggle--before--TransitionDuration);
|
14687
14851
|
--pf-v6-c-switch__toggle--Width: calc(var(--pf-v6-c-switch__toggle--Height) + var(--pf-v6-c-switch__toggle-icon--Offset) + var(--pf-v6-c-switch__toggle--before--Width));
|
14688
14852
|
}
|
14689
14853
|
|
@@ -14898,7 +15062,9 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
14898
15062
|
--pf-v6-c-table__action--responsive--MarginInlineStart: var(--pf-t--global--spacer--xl);
|
14899
15063
|
--pf-v6-c-table--m-grid__favorite--action--MarginInlineStart: var(--pf-t--global--spacer--2xl);
|
14900
15064
|
--pf-v6-c-table--m-grid__check--favorite--action--MarginInlineStart: calc(var(--pf-v6-c-table--m-grid__check--favorite--MarginInlineStart) + var(--pf-v6-c-table--m-grid__favorite--action--MarginInlineStart));
|
14901
|
-
--pf-v6-c-table__toggle__icon--
|
15065
|
+
--pf-v6-c-table__toggle__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
15066
|
+
--pf-v6-c-table__toggle__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
15067
|
+
--pf-v6-c-table__toggle__icon--Transition: transform var(--pf-v6-c-table__toggle__icon--TransitionDuration) var(--pf-v6-c-table__toggle__icon--TransitionTimingFunction);
|
14902
15068
|
--pf-v6-c-table__toggle--m-expanded__icon--Rotate: 180deg;
|
14903
15069
|
}
|
14904
15070
|
|
@@ -16465,7 +16631,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
16465
16631
|
--pf-v6-c-table__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
16466
16632
|
--pf-v6-c-table__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
16467
16633
|
--pf-v6-c-table__toggle--c-button__toggle-icon--Rotate: 270deg;
|
16468
|
-
--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--
|
16634
|
+
--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
16469
16635
|
--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
16470
16636
|
--pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate: 360deg;
|
16471
16637
|
--pf-v6-c-table__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
@@ -16963,7 +17129,9 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
|
|
16963
17129
|
transform: rotate(var(--pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate));
|
16964
17130
|
}
|
16965
17131
|
.pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
|
16966
|
-
transition
|
17132
|
+
transition-timing-function: var(--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionTimingFunction);
|
17133
|
+
transition-duration: var(--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration);
|
17134
|
+
transition-property: transform;
|
16967
17135
|
transform: rotate(var(--pf-v6-c-table__toggle--c-button__toggle-icon--Rotate));
|
16968
17136
|
}
|
16969
17137
|
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
|
@@ -16998,13 +17166,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
16998
17166
|
vertical-align: baseline;
|
16999
17167
|
}
|
17000
17168
|
|
17001
|
-
.pf-v6-c-table__favorite .pf-v6-c-button {
|
17169
|
+
.pf-v6-c-table__favorite .pf-v6-c-button:not(.pf-m-favorite) {
|
17002
17170
|
--pf-v6-c-button--FontSize: var(--pf-v6-c-table__favorite--c-button--FontSize);
|
17003
17171
|
}
|
17004
|
-
.pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button {
|
17172
|
+
.pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited) {
|
17005
17173
|
--pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-table__favorite--m-favorited--c-button--Color);
|
17006
17174
|
}
|
17007
|
-
.pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:is(:hover, :focus) {
|
17175
|
+
.pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus) {
|
17008
17176
|
--pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-table__favorite--m-favorited--c-button--Color);
|
17009
17177
|
}
|
17010
17178
|
|
@@ -18167,6 +18335,16 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18167
18335
|
}
|
18168
18336
|
}
|
18169
18337
|
|
18338
|
+
@property --pf-v6-c-tabs--link-accent--length {
|
18339
|
+
syntax: "<length>";
|
18340
|
+
inherits: true;
|
18341
|
+
initial-value: 0px;
|
18342
|
+
}
|
18343
|
+
@property --pf-v6-c-tabs--link-accent--start {
|
18344
|
+
syntax: "<length>";
|
18345
|
+
inherits: true;
|
18346
|
+
initial-value: 0px;
|
18347
|
+
}
|
18170
18348
|
.pf-v6-c-tabs {
|
18171
18349
|
--pf-v6-c-tabs--inset: 0;
|
18172
18350
|
--pf-v6-c-tabs--Width: auto;
|
@@ -18228,6 +18406,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18228
18406
|
--pf-v6-c-tabs--m-box--m-secondary__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
|
18229
18407
|
--pf-v6-c-tabs--m-box--m-secondary__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
|
18230
18408
|
--pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
|
18409
|
+
--pf-v6-c-tabs__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--short);
|
18410
|
+
--pf-v6-c-tabs__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
|
18231
18411
|
--pf-v6-c-tabs__link--before--border-color--base: var(--pf-t--global--border--color--default);
|
18232
18412
|
--pf-v6-c-tabs__link--before--border-width--base: var(--pf-t--global--border--width--regular);
|
18233
18413
|
--pf-v6-c-tabs__link--before--BorderBlockStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
|
@@ -18252,6 +18432,26 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18252
18432
|
--pf-v6-c-tabs__link--after--BorderInlineStartWidth: 0;
|
18253
18433
|
--pf-v6-c-tabs__item--m-current__link--after--BorderColor: var(--pf-t--global--border--color--clicked);
|
18254
18434
|
--pf-v6-c-tabs__item--m-current__link--after--BorderWidth: var(--pf-t--global--border--width--extra-strong);
|
18435
|
+
--pf-v6-c-tabs--link-accent--start: 0;
|
18436
|
+
--pf-v6-c-tabs--link-accent--length: auto;
|
18437
|
+
--pf-v6-c-tabs--link-accent--color: var(--pf-v6-c-tabs__item--m-current__link--after--BorderColor);
|
18438
|
+
--pf-v6-c-tabs--link-accent--border-size: var(--pf-v6-c-tabs__item--m-current__link--after--BorderWidth);
|
18439
|
+
--pf-v6-c-tabs--link-accent--InsetBlockStart: auto;
|
18440
|
+
--pf-v6-c-tabs--link-accent--InsetBlockEnd: 0;
|
18441
|
+
--pf-v6-c-tabs--link-accent--InsetInlineStart: initial;
|
18442
|
+
--pf-v6-c-tabs--link-accent--Width: initial;
|
18443
|
+
--pf-v6-c-tabs--link-accent--Height: 0;
|
18444
|
+
--pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--link-accent--border-size);
|
18445
|
+
--pf-v6-c-tabs--link-accent--BorderInlineStartWidth: 0;
|
18446
|
+
--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart: initial;
|
18447
|
+
--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd: auto;
|
18448
|
+
--pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart: 0;
|
18449
|
+
--pf-v6-c-tabs--m-vertical--link-accent--Width: 0;
|
18450
|
+
--pf-v6-c-tabs--m-vertical--link-accent--Height: initial;
|
18451
|
+
--pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth: 0;
|
18452
|
+
--pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--link-accent--border-size);
|
18453
|
+
--pf-v6-c-tabs--link-accent--TransitionDuration: var(--pf-t--global--motion--duration--md);
|
18454
|
+
--pf-v6-c-tabs--link-accent--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
|
18255
18455
|
--pf-v6-c-tabs__scroll-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
|
18256
18456
|
--pf-v6-c-tabs__scroll-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
|
18257
18457
|
--pf-v6-c-tabs__scroll-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
@@ -18271,7 +18471,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18271
18471
|
--pf-v6-c-tabs__item--ScrollSnapAlign: end;
|
18272
18472
|
--pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis: y;
|
18273
18473
|
--pf-v6-c-tabs__toggle--Display: flex;
|
18274
|
-
--pf-v6-c-tabs__toggle-icon--
|
18474
|
+
--pf-v6-c-tabs__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
18475
|
+
--pf-v6-c-tabs__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
18476
|
+
--pf-v6-c-tabs__toggle-icon--Transition: transform var(--pf-v6-c-tabs__toggle-icon--TransitionDuration) var(--pf-v6-c-tabs__toggle-icon--TransitionTimingFunction);
|
18275
18477
|
--pf-v6-c-tabs__toggle-icon--Rotate: 0;
|
18276
18478
|
--pf-v6-c-tabs--m-expanded__toggle-icon--Rotate: 90deg;
|
18277
18479
|
--pf-v6-c-tabs--m-expandable--RowGap: var(--pf-t--global--spacer--sm);
|
@@ -18291,7 +18493,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18291
18493
|
--pf-v6-c-tabs__add--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
18292
18494
|
--pf-v6-c-tabs__add--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
18293
18495
|
--pf-v6-c-tabs__link-toggle-icon--Color: var(--pf-t--global--icon--color--regular);
|
18294
|
-
--pf-v6-c-tabs__link-toggle-icon--
|
18496
|
+
--pf-v6-c-tabs__link-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
18497
|
+
--pf-v6-c-tabs__link-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
18498
|
+
--pf-v6-c-tabs__link-toggle-icon--Transition: transform var(--pf-v6-c-tabs__link-toggle-icon--TransitionDuration) var(--pf-v6-c-tabs__link-toggle-icon--TransitionTimingFunction);
|
18295
18499
|
--pf-v6-c-tabs__link-toggle-icon--Rotate: 0;
|
18296
18500
|
--pf-v6-c-tabs__link-toggle-icon--FontSize: var(--pf-t--global--font--size--sm);
|
18297
18501
|
--pf-v6-c-tabs__link--m-expanded__toggle-icon--Rotate: 90deg;
|
@@ -18405,6 +18609,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18405
18609
|
--pf-v6-c-tabs__link--after--InsetBlockEnd: 0;
|
18406
18610
|
--pf-v6-c-tabs__link--after--InsetInlineEnd: auto;
|
18407
18611
|
--pf-v6-c-tabs__list--ScrollSnapTypeAxis: var(--pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis);
|
18612
|
+
--pf-v6-c-tabs--link-accent--InsetBlockStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart);
|
18613
|
+
--pf-v6-c-tabs--link-accent--InsetBlockEnd: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd);
|
18614
|
+
--pf-v6-c-tabs--link-accent--InsetInlineStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart);
|
18615
|
+
--pf-v6-c-tabs--link-accent--Width: var(--pf-v6-c-tabs--m-vertical--link-accent--Width);
|
18616
|
+
--pf-v6-c-tabs--link-accent--Height: var(--pf-v6-c-tabs--m-vertical--link-accent--Height);
|
18617
|
+
--pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth);
|
18618
|
+
--pf-v6-c-tabs--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth);
|
18408
18619
|
display: inline-flex;
|
18409
18620
|
flex-direction: column;
|
18410
18621
|
height: 100%;
|
@@ -18667,6 +18878,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18667
18878
|
text-decoration-line: none;
|
18668
18879
|
background-color: var(--pf-v6-c-tabs__link--BackgroundColor);
|
18669
18880
|
border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
|
18881
|
+
transition: background-color var(--pf-v6-c-tabs__link--TransitionDuration--background-color) var(--pf-v6-c-tabs__link--TransitionTimingFunction--background-color);
|
18670
18882
|
}
|
18671
18883
|
.pf-v6-c-tabs__item.pf-m-action, .pf-v6-c-tabs__link {
|
18672
18884
|
--pf-v6-c-tabs__link--after--BorderBlockEndWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
|
@@ -18979,6 +19191,30 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
18979
19191
|
}
|
18980
19192
|
}
|
18981
19193
|
|
19194
|
+
@media (prefers-reduced-motion: no-preference) {
|
19195
|
+
.pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__link::after,
|
19196
|
+
.pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__item.pf-m-action::after {
|
19197
|
+
content: revert;
|
19198
|
+
}
|
19199
|
+
.pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__list::after {
|
19200
|
+
position: absolute;
|
19201
|
+
inset-block-start: var(--pf-v6-c-tabs--link-accent--InsetBlockStart, var(--pf-v6-c-tabs--link-accent--start));
|
19202
|
+
inset-block-end: var(--pf-v6-c-tabs--link-accent--InsetBlockEnd);
|
19203
|
+
inset-inline-start: var(--pf-v6-c-tabs--link-accent--InsetInlineStart, var(--pf-v6-c-tabs--link-accent--start));
|
19204
|
+
width: var(--pf-v6-c-tabs--link-accent--Width, var(--pf-v6-c-tabs--link-accent--length));
|
19205
|
+
height: var(--pf-v6-c-tabs--link-accent--Height, var(--pf-v6-c-tabs--link-accent--length));
|
19206
|
+
content: "";
|
19207
|
+
border: 0 solid var(--pf-v6-c-tabs--link-accent--color);
|
19208
|
+
border-block-end-width: var(--pf-v6-c-tabs--link-accent--BorderBlockEndWidth);
|
19209
|
+
border-inline-start-width: var(--pf-v6-c-tabs--link-accent--BorderInlineStartWidth);
|
19210
|
+
transition-timing-function: var(--pf-v6-c-tabs--link-accent--TransitionTimingFunction);
|
19211
|
+
transition-duration: var(--pf-v6-c-tabs--link-accent--TransitionDuration);
|
19212
|
+
transition-property: --pf-v6-c-tabs--link-accent--length, --pf-v6-c-tabs--link-accent--start, width;
|
19213
|
+
}
|
19214
|
+
.pf-v6-c-tabs.pf-m-initializing-accent {
|
19215
|
+
--pf-v6-c-tabs--link-accent--TransitionDuration: 0;
|
19216
|
+
}
|
19217
|
+
}
|
18982
19218
|
.pf-v6-c-text-input-group {
|
18983
19219
|
--pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
|
18984
19220
|
--pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
|
@@ -19586,7 +19822,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
19586
19822
|
--pf-v6-c-toolbar--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
|
19587
19823
|
--pf-v6-c-toolbar--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
19588
19824
|
--pf-v6-c-toolbar__expand-all-icon--Rotate: 0;
|
19589
|
-
--pf-v6-c-toolbar__expand-all-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--
|
19825
|
+
--pf-v6-c-toolbar__expand-all-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
19590
19826
|
--pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
19591
19827
|
--pf-v6-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate: 90deg;
|
19592
19828
|
--pf-v6-c-toolbar__group--m-filter-group--ColumnGap: var(--pf-t--global--spacer--gap--control-to-control--default);
|
@@ -19766,13 +20002,18 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
19766
20002
|
}
|
19767
20003
|
.pf-v6-c-toolbar.pf-m-full-height {
|
19768
20004
|
--pf-v6-c-toolbar--PaddingBlockStart: 0;
|
19769
|
-
--pf-v6-c-toolbar--
|
20005
|
+
--pf-v6-c-toolbar--PaddingBlockEnd: 0;
|
19770
20006
|
}
|
19771
20007
|
.pf-v6-c-toolbar.pf-m-full-height .pf-v6-c-toolbar__group,
|
19772
20008
|
.pf-v6-c-toolbar.pf-m-full-height .pf-v6-c-toolbar__item {
|
19773
20009
|
align-items: stretch;
|
19774
20010
|
align-self: stretch;
|
19775
20011
|
}
|
20012
|
+
.pf-v6-c-toolbar.pf-m-no-padding {
|
20013
|
+
--pf-v6-c-toolbar--PaddingBlockEnd: 0;
|
20014
|
+
--pf-v6-c-toolbar--m-sticky--PaddingBlockStart: 0;
|
20015
|
+
--pf-v6-c-toolbar--m-sticky--PaddingBlockEnd: 0;
|
20016
|
+
}
|
19776
20017
|
.pf-v6-c-toolbar.pf-m-primary {
|
19777
20018
|
--pf-v6-c-toolbar--BackgroundColor: var(--pf-v6-c-toolbar--m-primary--BackgroundColor);
|
19778
20019
|
}
|
@@ -19919,7 +20160,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
19919
20160
|
|
19920
20161
|
.pf-v6-c-toolbar__expand-all-icon {
|
19921
20162
|
display: inline-flex;
|
19922
|
-
transition
|
20163
|
+
transition-timing-function: var(--pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction);
|
20164
|
+
transition-duration: var(--pf-v6-c-toolbar__expand-all-icon--TransitionDuration);
|
20165
|
+
transition-property: transform;
|
19923
20166
|
transform: rotate(var(--pf-v6-c-toolbar__expand-all-icon--Rotate));
|
19924
20167
|
}
|
19925
20168
|
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-toolbar__expand-all-icon {
|
@@ -21583,6 +21826,11 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
21583
21826
|
align-items: baseline;
|
21584
21827
|
min-width: var(--pf-v6-c-truncate--MinWidth);
|
21585
21828
|
}
|
21829
|
+
.pf-v6-c-truncate.pf-m-fixed {
|
21830
|
+
display: inline;
|
21831
|
+
align-items: revert;
|
21832
|
+
min-width: revert;
|
21833
|
+
}
|
21586
21834
|
|
21587
21835
|
.pf-v6-c-truncate__start,
|
21588
21836
|
.pf-v6-c-truncate__end {
|
@@ -22151,7 +22399,7 @@ label.pf-v6-c-tree-view__node-text {
|
|
22151
22399
|
--pf-v6-c-wizard__nav-link-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
22152
22400
|
--pf-v6-c-wizard__nav-link-toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
22153
22401
|
--pf-v6-c-wizard__nav-link-toggle--Color: var(--pf-t--global--icon--color--regular);
|
22154
|
-
--pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--
|
22402
|
+
--pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
22155
22403
|
--pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
22156
22404
|
--pf-v6-c-wizard__nav-link-toggle-icon--Rotate: 0;
|
22157
22405
|
--pf-v6-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate: 90deg;
|
@@ -22557,7 +22805,9 @@ label.pf-v6-c-tree-view__node-text {
|
|
22557
22805
|
|
22558
22806
|
.pf-v6-c-wizard__nav-link-toggle-icon {
|
22559
22807
|
display: inline-block;
|
22560
|
-
transition
|
22808
|
+
transition-timing-function: var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction);
|
22809
|
+
transition-duration: var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration);
|
22810
|
+
transition-property: transform;
|
22561
22811
|
transform: rotate(var(--pf-v6-c-wizard__nav-link-toggle-icon--Rotate));
|
22562
22812
|
}
|
22563
22813
|
:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-wizard__nav-link-toggle-icon {
|