@patternfly/patternfly 6.3.0-prerelease.1 → 6.3.0-prerelease.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/README.md +1 -1
  2. package/assets/images/icon-help.hbs +3 -0
  3. package/components/Alert/alert-group.css +52 -31
  4. package/components/Alert/alert-group.scss +77 -46
  5. package/components/CodeEditor/code-editor.css +3 -0
  6. package/components/CodeEditor/code-editor.scss +3 -1
  7. package/components/Drawer/drawer.css +28 -14
  8. package/components/Drawer/drawer.scss +28 -9
  9. package/components/ExpandableSection/expandable-section.css +30 -0
  10. package/components/ExpandableSection/expandable-section.scss +30 -0
  11. package/components/MenuToggle/menu-toggle.css +8 -4
  12. package/components/MenuToggle/menu-toggle.scss +15 -3
  13. package/components/Page/page.css +4 -3
  14. package/components/Page/page.scss +4 -2
  15. package/components/Skeleton/skeleton.css +22 -2
  16. package/components/Skeleton/skeleton.scss +25 -3
  17. package/components/Tabs/tabs.css +65 -0
  18. package/components/Tabs/tabs.scss +77 -0
  19. package/components/Truncate/truncate.css +5 -0
  20. package/components/Truncate/truncate.scss +6 -0
  21. package/components/_index.css +216 -54
  22. package/docs/components/Button/examples/Button.md +13 -1
  23. package/docs/components/CodeEditor/examples/CodeEditor.md +26 -2
  24. package/docs/components/Divider/examples/Divider.md +1 -1
  25. package/docs/components/Drawer/examples/Drawer.md +4 -0
  26. package/docs/components/Form/examples/Form.md +156 -12
  27. package/docs/components/MenuToggle/examples/MenuToggle.md +3 -4
  28. package/docs/components/ModalBox/examples/ModalBox.md +13 -1
  29. package/docs/components/Page/examples/Page.md +1 -0
  30. package/docs/components/Table/examples/Table.md +30 -6
  31. package/docs/components/Tabs/examples/Tabs.md +6741 -12
  32. package/docs/components/Truncate/examples/Truncate.md +53 -10
  33. package/docs/demos/Card/examples/Card.md +57 -0
  34. package/docs/demos/DescriptionList/examples/DescriptionList.md +38 -0
  35. package/docs/demos/Drawer/examples/Drawer.md +38 -0
  36. package/docs/demos/Form/examples/BasicForms.md +130 -10
  37. package/docs/demos/Masthead/examples/Masthead.md +1 -1
  38. package/docs/demos/Modal/examples/Modal.md +39 -3
  39. package/docs/demos/Nav/examples/Nav.md +2 -2
  40. package/docs/demos/Page/examples/Page.md +355 -0
  41. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -1
  42. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +76 -0
  43. package/docs/demos/Table/examples/Table.md +67 -23
  44. package/docs/demos/Tabs/examples/Tabs.md +570 -0
  45. package/package.json +6 -6
  46. package/patternfly-no-globals.css +216 -54
  47. package/patternfly.css +216 -54
  48. package/patternfly.min.css +1 -1
  49. package/patternfly.min.css.map +1 -1
package/patternfly.css CHANGED
@@ -8195,27 +8195,45 @@ button) {
8195
8195
  var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration)
8196
8196
  var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction)
8197
8197
  0s;
8198
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
8199
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--accelerate);
8200
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default: var(--pf-t--global--motion--duration--fade--default);
8201
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default: var(--pf-t--global--motion--duration--fade--default);
8202
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default: var(--pf-t--global--motion--duration--fade--default);
8203
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-out--short);
8204
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--accelerate);
8205
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity: var(--pf-t--global--motion--duration--slide-out--short);
8206
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--accelerate);
8207
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--fade--short);
8208
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--accelerate);
8209
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block: var(--pf-t--global--motion--duration--slide-out--short);
8210
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--short);
8211
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--accelerate);
8212
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows: var(--pf-t--global--motion--duration--slide-out--short);
8213
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-out--short);
8214
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
8215
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: all
8216
- var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration)
8217
- var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction)
8218
- var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration);
8198
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
8199
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--accelerate);
8200
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows--default: var(--pf-t--global--motion--duration--fade--default);
8201
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block--default: var(--pf-t--global--motion--duration--fade--default);
8202
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDelay--default: var(--pf-t--global--motion--duration--fade--default);
8203
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default: initial;
8204
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default: initial;
8205
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default: initial;
8206
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default: initial;
8207
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default: initial;
8208
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-out--short);
8209
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--accelerate);
8210
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity: var(--pf-t--global--motion--duration--slide-out--short);
8211
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--accelerate);
8212
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--fade--short);
8213
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--accelerate);
8214
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block: var(--pf-t--global--motion--duration--slide-out--short);
8215
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--short);
8216
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--accelerate);
8217
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows: var(--pf-t--global--motion--duration--slide-out--short);
8218
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform: initial;
8219
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform: initial;
8220
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity: initial;
8221
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity: initial;
8222
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block: initial;
8223
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block: initial;
8224
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block: initial;
8225
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows: initial;
8226
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows: initial;
8227
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows: initial;
8228
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-out--short);
8229
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
8230
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition: all
8231
+ var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration)
8232
+ var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionTimingFunction)
8233
+ var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration);
8234
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: initial;
8235
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: initial;
8236
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: initial;
8219
8237
  --pf-v6-c-alert-group__overflow-button--BorderWidth: 0;
8220
8238
  --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
8221
8239
  --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -8275,40 +8293,43 @@ button) {
8275
8293
  transition: var(--pf-v6-c-alert-group--m-toast__item--c-alert--Transition);
8276
8294
  }
8277
8295
  }
8278
- .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child {
8296
+ .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child, .pf-v6-c-alert-group__item.pf-m-incoming:first-child {
8279
8297
  grid-template-rows: 0fr;
8280
8298
  margin-block: 0;
8281
8299
  overflow: hidden;
8282
8300
  opacity: 0;
8283
8301
  transform: translateY(-100%);
8284
8302
  }
8285
- .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child .pf-v6-c-alert {
8303
+ .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 {
8286
8304
  min-height: 0;
8287
8305
  padding-block-start: 0;
8288
8306
  padding-block-end: 0;
8289
8307
  border-width: 0;
8290
8308
  }
8291
- .pf-v6-c-alert-group__item.pf-m-offstage-right {
8309
+ .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing {
8292
8310
  grid-template-rows: 0fr;
8293
8311
  margin-block: 0;
8294
8312
  overflow: hidden;
8295
8313
  opacity: 0;
8296
- 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);
8314
+ 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));
8297
8315
  }
8298
- .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
8316
+ .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 {
8299
8317
  min-height: 0;
8300
8318
  padding-block-start: 0;
8301
8319
  padding-block-end: 0;
8302
8320
  border-width: 0;
8303
- transition: all 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default);
8321
+ 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));
8304
8322
  }
8305
8323
  @media screen and (prefers-reduced-motion: no-preference) {
8306
- .pf-v6-c-alert-group__item.pf-m-offstage-right {
8307
- 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);
8324
+ .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing {
8325
+ 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));
8308
8326
  transform: translateX(100%);
8309
8327
  }
8310
- .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
8311
- transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition);
8328
+ :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 {
8329
+ transform: translateX(calc(100% * var(--pf-v6-global--inverse--multiplier)));
8330
+ }
8331
+ .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 {
8332
+ 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));
8312
8333
  }
8313
8334
  }
8314
8335
  .pf-v6-c-alert-group__item:hover {
@@ -10649,6 +10670,9 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
10649
10670
  .pf-v6-c-code-editor__main .monaco-editor {
10650
10671
  background-color: var(--pf-v6-c-code-editor__main--BackgroundColor);
10651
10672
  }
10673
+ .pf-v6-c-code-editor__main a.label-name {
10674
+ text-decoration-line: none;
10675
+ }
10652
10676
 
10653
10677
  .pf-v6-c-code-editor__header + .pf-v6-c-code-editor__main {
10654
10678
  border-block-start-width: 0;
@@ -12905,9 +12929,15 @@ ul) {
12905
12929
  --pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
12906
12930
  --pf-v6-c-drawer__panel--PaddingBlockStart: var(--pf-t--global--spacer--sm);
12907
12931
  --pf-v6-c-drawer__panel--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12932
+ --pf-v6-c-drawer__panel--TransitionDelay: 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus), var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
12933
+ --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--fade);
12934
+ --pf-v6-c-drawer__panel--TransitionDelay--expand--focus: 0s;
12908
12935
  --pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
12909
- --pf-v6-c-drawer__panel--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--short);
12910
- --pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis;
12936
+ --pf-v6-c-drawer__panel--TransitionDuration--fade: var(--pf-t--global--motion--duration--fade--default);
12937
+ --pf-v6-c-drawer__panel--TransitionDuration: var(--pf-v6-c-drawer__panel--TransitionDuration--fade), 0s, 0s;
12938
+ --pf-v6-c-drawer__panel--TransitionProperty: opacity, visibility, transform;
12939
+ --pf-v6-c-drawer__panel--Opacity: 0;
12940
+ --pf-v6-c-drawer--m-expanded__panel--Opacity: 1;
12911
12941
  --pf-v6-c-drawer__panel--FlexBasis: 100%;
12912
12942
  --pf-v6-c-drawer__panel--md--FlexBasis--min: 1.5rem;
12913
12943
  --pf-v6-c-drawer__panel--md--FlexBasis: 50%;
@@ -12997,6 +13027,17 @@ ul) {
12997
13027
  --pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd: var(--pf-v6-c-drawer__panel--after--Width);
12998
13028
  --pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: var(--pf-v6-c-drawer__panel--after--Width);
12999
13029
  }
13030
+ @media screen and (prefers-reduced-motion: no-preference) {
13031
+ .pf-v6-c-drawer {
13032
+ --pf-v6-c-drawer__panel--TransitionDuration--slide: var(--pf-t--global--motion--duration--slide-in--short);
13033
+ --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--slide);
13034
+ --pf-v6-c-drawer__panel--TransitionDelay: 0s, 0s, 0s, 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
13035
+ --pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
13036
+ --pf-v6-c-drawer__panel--TransitionDuration: 0s, var(--pf-v6-c-drawer__panel--TransitionDuration--slide), 0s, 0s, 0s;
13037
+ --pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis, visibility;
13038
+ --pf-v6-c-drawer__panel--Opacity: 1;
13039
+ }
13040
+ }
13000
13041
  @media screen and (min-width: 75rem) {
13001
13042
  .pf-v6-c-drawer {
13002
13043
  --pf-v6-c-drawer__panel--MinWidth: var(--pf-v6-c-drawer__panel--xl--MinWidth);
@@ -13044,8 +13085,13 @@ ul) {
13044
13085
  .pf-v6-c-drawer.pf-m-panel-bottom > .pf-v6-c-drawer__main {
13045
13086
  flex-direction: column;
13046
13087
  }
13088
+ .pf-v6-c-drawer.pf-m-expanded {
13089
+ --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDelay--expand--focus);
13090
+ }
13047
13091
  .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
13048
13092
  transform: translateX(-100%);
13093
+ --pf-v6-c-drawer__panel--Opacity: var(--pf-v6-c-drawer--m-expanded__panel--Opacity);
13094
+ visibility: visible;
13049
13095
  }
13050
13096
  :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 {
13051
13097
  transform: translateX(calc(-100% * var(--pf-v6-global--inverse--multiplier)));
@@ -13118,8 +13164,11 @@ ul) {
13118
13164
  order: 1;
13119
13165
  max-height: var(--pf-v6-c-drawer__panel--MaxHeight);
13120
13166
  overflow: auto;
13167
+ visibility: hidden;
13121
13168
  background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
13122
13169
  box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
13170
+ opacity: var(--pf-v6-c-drawer__panel--Opacity);
13171
+ transition-delay: var(--pf-v6-c-drawer__panel--TransitionDelay);
13123
13172
  transition-timing-function: var(--pf-v6-c-drawer__panel--TransitionTimingFunction);
13124
13173
  transition-duration: var(--pf-v6-c-drawer__panel--TransitionDuration);
13125
13174
  transition-property: var(--pf-v6-c-drawer__panel--TransitionProperty);
@@ -13176,17 +13225,6 @@ ul) {
13176
13225
  padding-block-end: var(--pf-v6-c-drawer__panel--PaddingBlockEnd);
13177
13226
  }
13178
13227
 
13179
- @keyframes pf-remove-tab-focus {
13180
- to {
13181
- visibility: hidden;
13182
- }
13183
- }
13184
- .pf-v6-c-drawer__panel[hidden] {
13185
- animation-name: pf-remove-tab-focus;
13186
- animation-delay: var(--pf-v6-c-drawer__panel--TransitionDuration);
13187
- animation-fill-mode: forwards;
13188
- }
13189
-
13190
13228
  .pf-v6-c-drawer__head {
13191
13229
  display: grid;
13192
13230
  grid-template-columns: auto;
@@ -13294,7 +13332,7 @@ ul) {
13294
13332
  .pf-v6-c-drawer {
13295
13333
  min-width: var(--pf-v6-c-drawer__panel--MinWidth);
13296
13334
  }
13297
- .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
13335
+ .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
13298
13336
  box-shadow: var(--pf-v6-c-drawer--m-expanded__panel--BoxShadow);
13299
13337
  }
13300
13338
  .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable {
@@ -13878,6 +13916,17 @@ ul) {
13878
13916
  --pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
13879
13917
  --pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
13880
13918
  --pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate: -90deg;
13919
+ --pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide: 0s;
13920
+ --pf-v6-c-expandable-section__content--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
13921
+ --pf-v6-c-expandable-section__content--TransitionDuration--expand--slide: 0s;
13922
+ --pf-v6-c-expandable-section__content--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
13923
+ --pf-v6-c-expandable-section__content--TransitionDuration--slide: var(--pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide);
13924
+ --pf-v6-c-expandable-section__content--TransitionDuration--fade: var(--pf-v6-c-expandable-section__content--TransitionDuration--collapse--fade);
13925
+ --pf-v6-c-expandable-section__content--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
13926
+ --pf-v6-c-expandable-section__content--Opacity: 0;
13927
+ --pf-v6-c-expandable-section--m-expanded__content--Opacity: 1;
13928
+ --pf-v6-c-expandable-section__content--TranslateY: 0;
13929
+ --pf-v6-c-expandable-section--m-expanded__content--TranslateY: 0;
13881
13930
  --pf-v6-c-expandable-section__content--MaxWidth: auto;
13882
13931
  --pf-v6-c-expandable-section--m-limit-width__content--MaxWidth: 46.875rem;
13883
13932
  --pf-v6-c-expandable-section--m-display-lg--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -13889,10 +13938,18 @@ ul) {
13889
13938
  --pf-v6-c-expandable-section--m-display-lg--BorderWidth: var(--pf-t--global--border--width--box--default);
13890
13939
  --pf-v6-c-expandable-section--m-display-lg--BorderColor: var(--pf-t--global--border--color--default);
13891
13940
  --pf-v6-c-expandable-section--m-display-lg--BorderRadius: var(--pf-t--global--border--radius--medium);
13941
+ --pf-v6-c-expandable-section--m-display-lg--TransitionDelay: var(--pf-v6-c-expandable-section__content--TransitionDuration--fade);
13892
13942
  --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));
13893
13943
  --pf-v6-c-expandable-section--m-truncate__content--LineClamp: 3;
13894
13944
  --pf-v6-c-expandable-section--m-truncate--Gap: var(--pf-t--global--spacer--xs);
13895
13945
  }
13946
+ @media screen and (prefers-reduced-motion: no-preference) {
13947
+ .pf-v6-c-expandable-section {
13948
+ --pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
13949
+ --pf-v6-c-expandable-section__content--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
13950
+ --pf-v6-c-expandable-section__content--TranslateY: -.5rem;
13951
+ }
13952
+ }
13896
13953
 
13897
13954
  .pf-v6-c-expandable-section {
13898
13955
  display: flex;
@@ -13903,6 +13960,11 @@ ul) {
13903
13960
  --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate);
13904
13961
  --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);
13905
13962
  --pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg--m-expanded--PaddingBlockEnd);
13963
+ --pf-v6-c-expandable-section__content--TransitionDuration--slide: var(--pf-v6-c-expandable-section__content--TransitionDuration--expand--slide);
13964
+ --pf-v6-c-expandable-section__content--TransitionDuration--fade: var(--pf-v6-c-expandable-section__content--TransitionDuration--expand--fade);
13965
+ --pf-v6-c-expandable-section__content--Opacity: var(--pf-v6-c-expandable-section--m-expanded__content--Opacity);
13966
+ --pf-v6-c-expandable-section__content--TranslateY: var(--pf-v6-c-expandable-section--m-expanded__content--TranslateY);
13967
+ --pf-v6-c-expandable-section--m-display-lg--TransitionDelay: 0s;
13906
13968
  }
13907
13969
  .pf-v6-c-expandable-section.pf-m-limit-width {
13908
13970
  --pf-v6-c-expandable-section__content--MaxWidth: var(--pf-v6-c-expandable-section--m-limit-width__content--MaxWidth);
@@ -13915,6 +13977,7 @@ ul) {
13915
13977
  background-color: var(--pf-v6-c-expandable-section--m-display-lg--BackgroundColor);
13916
13978
  border: var(--pf-v6-c-expandable-section--m-display-lg--BorderWidth) solid var(--pf-v6-c-expandable-section--m-display-lg--BorderColor);
13917
13979
  border-radius: var(--pf-v6-c-expandable-section--m-display-lg--BorderRadius);
13980
+ transition: padding-block-end 0s var(--pf-v6-c-expandable-section--m-display-lg--TransitionDelay, 0s);
13918
13981
  }
13919
13982
  .pf-v6-c-expandable-section.pf-m-indented {
13920
13983
  --pf-v6-c-expandable-section__content--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart);
@@ -13948,6 +14011,11 @@ ul) {
13948
14011
  max-width: var(--pf-v6-c-expandable-section__content--MaxWidth);
13949
14012
  padding-block-end: var(--pf-v6-c-expandable-section__content--PaddingBlockEnd, 0);
13950
14013
  padding-inline-start: var(--pf-v6-c-expandable-section__content--PaddingInlineStart, 0);
14014
+ opacity: var(--pf-v6-c-expandable-section__content--Opacity);
14015
+ transition-timing-function: var(--pf-v6-c-expandable-section__content--TransitionTimingFunction);
14016
+ transition-duration: var(--pf-v6-c-expandable-section__content--TransitionDuration--fade), var(--pf-v6-c-expandable-section__content--TransitionDuration--slide);
14017
+ transition-property: opacity, translate;
14018
+ translate: 0 var(--pf-v6-c-expandable-section__content--TranslateY);
13951
14019
  }
13952
14020
 
13953
14021
  .pf-v6-c-file-upload {
@@ -18247,16 +18315,20 @@ ul.pf-v6-c-list {
18247
18315
  flex-wrap: nowrap;
18248
18316
  }
18249
18317
 
18250
- .pf-v6-c-menu-toggle__icon {
18251
- flex-shrink: 0;
18252
- }
18253
18318
  .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
18254
18319
  .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
18255
- .pf-v6-c-menu-toggle__icon.pf-m-avatar svg {
18320
+ .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 {
18256
18321
  margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
18257
18322
  margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
18258
18323
  }
18259
18324
 
18325
+ .pf-v6-c-menu-toggle__icon {
18326
+ flex-shrink: 0;
18327
+ }
18328
+ .pf-v6-c-menu-toggle__icon :where(picture, img) {
18329
+ vertical-align: middle;
18330
+ }
18331
+
18260
18332
  .pf-v6-c-menu-toggle__controls {
18261
18333
  display: flex;
18262
18334
  gap: var(--pf-v6-c-menu-toggle__controls--Gap);
@@ -19346,8 +19418,9 @@ ul.pf-v6-c-list {
19346
19418
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
19347
19419
  --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
19348
19420
  --pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
19349
- --pf-v6-c-page__sidebar--Width: 18.125rem;
19350
- --pf-v6-c-page__sidebar--xl--Width: 18.125rem;
19421
+ --pf-v6-c-page__sidebar--Width--base: 18.125rem;
19422
+ --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--Width--base);
19423
+ --pf-v6-c-page__sidebar--xl--Width: var(--pf-v6-c-page__sidebar--Width--base);
19351
19424
  --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
19352
19425
  --pf-v6-c-page__sidebar--BoxShadow: none;
19353
19426
  --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
@@ -19775,7 +19848,7 @@ ul.pf-v6-c-list {
19775
19848
  -webkit-overflow-scrolling: touch;
19776
19849
  }
19777
19850
  @media screen and (min-width: 75rem) {
19778
- .pf-v6-c-masthead + .pf-v6-c-page__main-container, .pf-v6-c-page__sidebar.pf-m-collapsed + .pf-v6-c-page__main-container,
19851
+ .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,
19779
19852
  .pf-v6-c-masthead + .pf-v6-c-page__drawer,
19780
19853
  .pf-v6-c-page__sidebar.pf-m-collapsed + .pf-v6-c-page__drawer {
19781
19854
  --pf-v6-c-page__main-container--GridArea: var(--pf-v6-c-page--masthead--main-container--GridArea);
@@ -21927,8 +22000,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
21927
22000
  --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
21928
22001
  --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
21929
22002
  --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
21930
- --pf-v6-c-skeleton--after--TranslateX: -100%;
21931
- --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
22003
+ --pf-v6-c-skeleton--after--TranslateX: 0;
22004
+ --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading-reduced-motion;
21932
22005
  --pf-v6-c-skeleton--after--AnimationDuration: 3s;
21933
22006
  --pf-v6-c-skeleton--after--AnimationIterationCount: infinite;
21934
22007
  --pf-v6-c-skeleton--after--AnimationTimingFunction: linear;
@@ -21960,6 +22033,15 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
21960
22033
  --pf-v6-c-skeleton--m-height-75--Height: 75%;
21961
22034
  --pf-v6-c-skeleton--m-height-100--Height: 100%;
21962
22035
  }
22036
+ @media screen and (prefers-reduced-motion: no-preference) {
22037
+ .pf-v6-c-skeleton {
22038
+ --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
22039
+ --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
22040
+ --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
22041
+ --pf-v6-c-skeleton--after--TranslateX: -100%;
22042
+ --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
22043
+ }
22044
+ }
21963
22045
 
21964
22046
  .pf-v6-c-skeleton {
21965
22047
  position: relative;
@@ -22080,6 +22162,17 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
22080
22162
  transform: translateX(100%);
22081
22163
  }
22082
22164
  }
22165
+ @keyframes pf-v6-c-skeleton-loading-reduced-motion {
22166
+ 0% {
22167
+ opacity: 0.25;
22168
+ }
22169
+ 60% {
22170
+ opacity: 1;
22171
+ }
22172
+ 100% {
22173
+ opacity: 0.25;
22174
+ }
22175
+ }
22083
22176
  .pf-v6-c-skip-to-content {
22084
22177
  --pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
22085
22178
  --pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
@@ -25915,6 +26008,16 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25915
26008
  }
25916
26009
  }
25917
26010
 
26011
+ @property --pf-v6-c-tabs--link-accent--length {
26012
+ syntax: "<length>";
26013
+ inherits: true;
26014
+ initial-value: 0px;
26015
+ }
26016
+ @property --pf-v6-c-tabs--link-accent--start {
26017
+ syntax: "<length>";
26018
+ inherits: true;
26019
+ initial-value: 0px;
26020
+ }
25918
26021
  .pf-v6-c-tabs {
25919
26022
  --pf-v6-c-tabs--inset: 0;
25920
26023
  --pf-v6-c-tabs--Width: auto;
@@ -25976,6 +26079,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25976
26079
  --pf-v6-c-tabs--m-box--m-secondary__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
25977
26080
  --pf-v6-c-tabs--m-box--m-secondary__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
25978
26081
  --pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
26082
+ --pf-v6-c-tabs__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--short);
26083
+ --pf-v6-c-tabs__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
25979
26084
  --pf-v6-c-tabs__link--before--border-color--base: var(--pf-t--global--border--color--default);
25980
26085
  --pf-v6-c-tabs__link--before--border-width--base: var(--pf-t--global--border--width--regular);
25981
26086
  --pf-v6-c-tabs__link--before--BorderBlockStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
@@ -26000,6 +26105,26 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
26000
26105
  --pf-v6-c-tabs__link--after--BorderInlineStartWidth: 0;
26001
26106
  --pf-v6-c-tabs__item--m-current__link--after--BorderColor: var(--pf-t--global--border--color--clicked);
26002
26107
  --pf-v6-c-tabs__item--m-current__link--after--BorderWidth: var(--pf-t--global--border--width--extra-strong);
26108
+ --pf-v6-c-tabs--link-accent--start: 0;
26109
+ --pf-v6-c-tabs--link-accent--length: auto;
26110
+ --pf-v6-c-tabs--link-accent--color: var(--pf-v6-c-tabs__item--m-current__link--after--BorderColor);
26111
+ --pf-v6-c-tabs--link-accent--border-size: var(--pf-v6-c-tabs__item--m-current__link--after--BorderWidth);
26112
+ --pf-v6-c-tabs--link-accent--InsetBlockStart: auto;
26113
+ --pf-v6-c-tabs--link-accent--InsetBlockEnd: 0;
26114
+ --pf-v6-c-tabs--link-accent--InsetInlineStart: initial;
26115
+ --pf-v6-c-tabs--link-accent--Width: initial;
26116
+ --pf-v6-c-tabs--link-accent--Height: 0;
26117
+ --pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--link-accent--border-size);
26118
+ --pf-v6-c-tabs--link-accent--BorderInlineStartWidth: 0;
26119
+ --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart: initial;
26120
+ --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd: auto;
26121
+ --pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart: 0;
26122
+ --pf-v6-c-tabs--m-vertical--link-accent--Width: 0;
26123
+ --pf-v6-c-tabs--m-vertical--link-accent--Height: initial;
26124
+ --pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth: 0;
26125
+ --pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--link-accent--border-size);
26126
+ --pf-v6-c-tabs--link-accent--TransitionDuration: var(--pf-t--global--motion--duration--md);
26127
+ --pf-v6-c-tabs--link-accent--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
26003
26128
  --pf-v6-c-tabs__scroll-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
26004
26129
  --pf-v6-c-tabs__scroll-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
26005
26130
  --pf-v6-c-tabs__scroll-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -26157,6 +26282,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
26157
26282
  --pf-v6-c-tabs__link--after--InsetBlockEnd: 0;
26158
26283
  --pf-v6-c-tabs__link--after--InsetInlineEnd: auto;
26159
26284
  --pf-v6-c-tabs__list--ScrollSnapTypeAxis: var(--pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis);
26285
+ --pf-v6-c-tabs--link-accent--InsetBlockStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart);
26286
+ --pf-v6-c-tabs--link-accent--InsetBlockEnd: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd);
26287
+ --pf-v6-c-tabs--link-accent--InsetInlineStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart);
26288
+ --pf-v6-c-tabs--link-accent--Width: var(--pf-v6-c-tabs--m-vertical--link-accent--Width);
26289
+ --pf-v6-c-tabs--link-accent--Height: var(--pf-v6-c-tabs--m-vertical--link-accent--Height);
26290
+ --pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth);
26291
+ --pf-v6-c-tabs--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth);
26160
26292
  display: inline-flex;
26161
26293
  flex-direction: column;
26162
26294
  height: 100%;
@@ -26419,6 +26551,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
26419
26551
  text-decoration-line: none;
26420
26552
  background-color: var(--pf-v6-c-tabs__link--BackgroundColor);
26421
26553
  border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
26554
+ transition: background-color var(--pf-v6-c-tabs__link--TransitionDuration--background-color) var(--pf-v6-c-tabs__link--TransitionTimingFunction--background-color);
26422
26555
  }
26423
26556
  .pf-v6-c-tabs__item.pf-m-action, .pf-v6-c-tabs__link {
26424
26557
  --pf-v6-c-tabs__link--after--BorderBlockEndWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
@@ -26731,6 +26864,30 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
26731
26864
  }
26732
26865
  }
26733
26866
 
26867
+ @media (prefers-reduced-motion: no-preference) {
26868
+ .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__link::after,
26869
+ .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__item.pf-m-action::after {
26870
+ content: revert;
26871
+ }
26872
+ .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__list::after {
26873
+ position: absolute;
26874
+ inset-block-start: var(--pf-v6-c-tabs--link-accent--InsetBlockStart, var(--pf-v6-c-tabs--link-accent--start));
26875
+ inset-block-end: var(--pf-v6-c-tabs--link-accent--InsetBlockEnd);
26876
+ inset-inline-start: var(--pf-v6-c-tabs--link-accent--InsetInlineStart, var(--pf-v6-c-tabs--link-accent--start));
26877
+ width: var(--pf-v6-c-tabs--link-accent--Width, var(--pf-v6-c-tabs--link-accent--length));
26878
+ height: var(--pf-v6-c-tabs--link-accent--Height, var(--pf-v6-c-tabs--link-accent--length));
26879
+ content: "";
26880
+ border: 0 solid var(--pf-v6-c-tabs--link-accent--color);
26881
+ border-block-end-width: var(--pf-v6-c-tabs--link-accent--BorderBlockEndWidth);
26882
+ border-inline-start-width: var(--pf-v6-c-tabs--link-accent--BorderInlineStartWidth);
26883
+ transition-timing-function: var(--pf-v6-c-tabs--link-accent--TransitionTimingFunction);
26884
+ transition-duration: var(--pf-v6-c-tabs--link-accent--TransitionDuration);
26885
+ transition-property: --pf-v6-c-tabs--link-accent--length, --pf-v6-c-tabs--link-accent--start, width;
26886
+ }
26887
+ .pf-v6-c-tabs.pf-m-initializing-accent {
26888
+ --pf-v6-c-tabs--link-accent--TransitionDuration: 0;
26889
+ }
26890
+ }
26734
26891
  .pf-v6-c-text-input-group {
26735
26892
  --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
26736
26893
  --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
@@ -29342,6 +29499,11 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
29342
29499
  align-items: baseline;
29343
29500
  min-width: var(--pf-v6-c-truncate--MinWidth);
29344
29501
  }
29502
+ .pf-v6-c-truncate.pf-m-fixed {
29503
+ display: inline;
29504
+ align-items: revert;
29505
+ min-width: revert;
29506
+ }
29345
29507
 
29346
29508
  .pf-v6-c-truncate__start,
29347
29509
  .pf-v6-c-truncate__end {