@patternfly/patternfly 6.5.0-prerelease.60 → 6.5.0-prerelease.62

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 (13) hide show
  1. package/assets/images/glass-brand-dark.jpg +0 -0
  2. package/components/CodeEditor/code-editor.css +1 -1
  3. package/components/CodeEditor/code-editor.scss +1 -1
  4. package/components/Drawer/drawer.css +107 -17
  5. package/components/Drawer/drawer.scss +109 -17
  6. package/components/Page/page.css +3 -0
  7. package/components/Page/page.scss +4 -0
  8. package/components/_index.css +111 -18
  9. package/package.json +2 -2
  10. package/patternfly-no-globals.css +111 -18
  11. package/patternfly.css +111 -18
  12. package/patternfly.min.css +1 -1
  13. package/patternfly.min.css.map +1 -1
package/components/_index.css CHANGED
@@ -3449,7 +3449,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
3449
3449
  --pf-v6-c-code-editor__header--BorderStartStartRadius: var(--pf-t--global--border--radius--medium);
3450
3450
  --pf-v6-c-code-editor__header--BorderStartEndRadius: var(--pf-t--global--border--radius--medium);
3451
3451
  --pf-v6-c-code-editor__header-content--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
3452
- --pf-v6-c-code-editor__header-content--m-plain--BackgroundColor: var(--pf-t--global--background--color--primary--default);
3452
+ --pf-v6-c-code-editor__header-content--m-plain--BackgroundColor: transparent;
3453
3453
  --pf-v6-c-code-editor__header-content--PaddingBlockStart: var(--pf-t--global--spacer--xs);
3454
3454
  --pf-v6-c-code-editor__header-content--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
3455
3455
  --pf-v6-c-code-editor__header-content--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -6344,45 +6344,85 @@ ul) {
6344
6344
  --pf-v6-c-drawer__body--m-padding--PaddingInlineEnd: var(--pf-t--global--spacer--md);
6345
6345
  --pf-v6-c-drawer__body--m-padding--PaddingBlockEnd: var(--pf-t--global--spacer--md);
6346
6346
  --pf-v6-c-drawer__body--m-padding--PaddingInlineStart: var(--pf-t--global--spacer--md);
6347
- --pf-v6-c-drawer__splitter--Height: 0.5625rem;
6347
+ --pf-v6-c-drawer__splitter--Height: 0.75rem;
6348
6348
  --pf-v6-c-drawer__splitter--Width: 100%;
6349
- --pf-v6-c-drawer__splitter--BackgroundColor: var(--pf-t--global--background--color--primary--default);
6349
+ --pf-v6-c-drawer__splitter--BackgroundColor: transparent;
6350
6350
  --pf-v6-c-drawer__splitter--Cursor: row-resize;
6351
6351
  --pf-v6-c-drawer__splitter--m-vertical--Height: 100%;
6352
- --pf-v6-c-drawer__splitter--m-vertical--Width: 0.5625rem;
6352
+ --pf-v6-c-drawer__splitter--m-vertical--Width: 0.75rem;
6353
6353
  --pf-v6-c-drawer__splitter--m-vertical--Cursor: col-resize;
6354
+ --pf-v6-c-drawer__splitter--focus--OutlineOffset: -0.0625rem;
6354
6355
  --pf-v6-c-drawer--m-inline__splitter--focus--OutlineOffset: -0.0625rem;
6355
6356
  --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-t--global--border--color--default);
6357
+ --pf-v6-c-drawer__splitter--hover--after--BorderColor: var(--pf-t--global--border--color--default);
6358
+ --pf-v6-c-drawer__splitter--focus--after--BorderColor: var(--pf-t--global--border--color--default);
6359
+ --pf-v6-c-drawer__splitter--active--after--BorderColor: var(--pf-t--global--border--color--default);
6356
6360
  --pf-v6-c-drawer__splitter--after--border-width--base: var(--pf-t--global--border--width--divider--default);
6357
6361
  --pf-v6-c-drawer__splitter--after--BorderBlockStartWidth: 0;
6358
6362
  --pf-v6-c-drawer__splitter--after--BorderInlineEndWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
6359
6363
  --pf-v6-c-drawer__splitter--after--BorderBlockEndWidth: 0;
6360
6364
  --pf-v6-c-drawer__splitter--after--BorderInlineStartWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
6365
+ --pf-v6-c-drawer__splitter--after--InsetBlockStart: 0;
6366
+ --pf-v6-c-drawer__splitter--after--InsetBlockEnd: 0;
6367
+ --pf-v6-c-drawer__splitter--after--InsetInlineStart: 0;
6368
+ --pf-v6-c-drawer__splitter--after--InsetInlineEnd: 0;
6369
+ --pf-v6-c-drawer__splitter--after--Width: auto;
6370
+ --pf-v6-c-drawer__splitter--after--Height: auto;
6361
6371
  --pf-v6-c-drawer--m-panel-bottom__splitter--after--BorderBlockStartWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
6362
6372
  --pf-v6-c-drawer--m-panel-bottom__splitter--after--BorderBlockEndWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
6363
- --pf-v6-c-drawer--m-inline__splitter--m-vertical--Width: 0.625rem;
6373
+ --pf-v6-c-drawer--m-pill__splitter--m-vertical--Width: 0.625rem;
6374
+ --pf-v6-c-drawer--m-pill__splitter--m-vertical--Height: calc(100% - (2 * var(--pf-v6-c-drawer--m-pill__panel--BorderRadius)));
6375
+ --pf-v6-c-drawer--m-pill__splitter--m-vertical--MarginBlockStart: var(--pf-v6-c-drawer--m-pill__panel--BorderRadius);
6376
+ --pf-v6-c-drawer--m-pill__splitter--after--BorderColor: transparent;
6377
+ --pf-v6-c-drawer--m-pill__splitter--after--BorderInlineEndWidth: 0;
6378
+ --pf-v6-c-drawer--m-pill__splitter--hover--after--BorderColor: var(--pf-t--global--border--color--hover);
6379
+ --pf-v6-c-drawer--m-pill__splitter--focus--after--BorderColor: var(--pf-t--global--border--color--clicked);
6380
+ --pf-v6-c-drawer--m-pill__splitter--active--after--BorderColor: var(--pf-t--global--border--color--clicked);
6381
+ --pf-v6-c-drawer--m-pill__splitter--after--Width: 0.0625rem;
6382
+ --pf-v6-c-drawer--m-pill__splitter--after--Height: auto;
6383
+ --pf-v6-c-drawer--m-pill__splitter--after--InsetInlineStart: 50%;
6384
+ --pf-v6-c-drawer--m-pill__splitter--after--InsetInlineEnd: auto;
6385
+ --pf-v6-c-drawer--m-pill__splitter--after--TranslateX: -50%;
6386
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--Height: 0.5rem;
6387
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--Width: calc(100% - (2 * var(--pf-v6-c-drawer--m-pill__panel--BorderRadius)));
6388
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--MarginInlineStart: var(--pf-v6-c-drawer--m-pill__panel--BorderRadius);
6389
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--Width: auto;
6390
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--Height: 0.0625rem;
6391
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockStartWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
6392
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockEndWidth: 0;
6393
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetBlockStart: 50%;
6394
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetBlockEnd: auto;
6395
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetInlineStart: 0;
6396
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetInlineEnd: 0;
6397
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--TranslateY: -50%;
6398
+ --pf-v6-c-drawer--m-inline__splitter--m-vertical--Width: 0.75rem;
6364
6399
  --pf-v6-c-drawer--m-inline__splitter-handle--InsetInlineStart: 50%;
6365
- --pf-v6-c-drawer--m-inline--m-panel-bottom__splitter--Height: 0.625rem;
6400
+ --pf-v6-c-drawer--m-inline--m-panel-bottom__splitter--Height: 0.75rem;
6366
6401
  --pf-v6-c-drawer--m-inline--m-panel-bottom__splitter-handle--InsetBlockStart: 50%;
6367
6402
  --pf-v6-c-drawer--m-inline--m-panel-bottom__splitter--after--BorderBlockStartWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
6368
6403
  --pf-v6-c-drawer__splitter-handle--InsetBlockStart: 50%;
6369
- --pf-v6-c-drawer__splitter-handle--InsetInlineStart: calc(50% - var(--pf-v6-c-drawer__splitter--after--border-width--base));
6404
+ --pf-v6-c-drawer__splitter-handle--InsetInlineStart: 50%;
6370
6405
  --pf-v6-c-drawer--m-panel-left__splitter-handle--InsetInlineStart: 50%;
6371
- --pf-v6-c-drawer--m-panel-bottom__splitter-handle--InsetBlockStart: calc(50% - var(--pf-v6-c-drawer__splitter--after--border-width--base));
6372
- --pf-v6-c-drawer__splitter-handle--after--BorderColor: var(--pf-t--global--border--color--default);
6406
+ --pf-v6-c-drawer--m-panel-bottom__splitter-handle--InsetBlockStart: 50%;
6407
+ --pf-v6-c-drawer__splitter-handle--after--BackgroundColor: var(--pf-t--global--border--color--control--default);
6408
+ --pf-v6-c-drawer__splitter-handle--hover--after--BackgroundColor: var(--pf-t--global--border--color--hover);
6409
+ --pf-v6-c-drawer__splitter-handle--focus--after--BackgroundColor: var(--pf-t--global--border--color--clicked);
6410
+ --pf-v6-c-drawer__splitter-handle--active--after--BackgroundColor: var(--pf-t--global--border--color--clicked);
6411
+ --pf-v6-c-drawer__splitter-handle--after--BorderColor: var(--pf-t--global--border--color--high-contrast);
6373
6412
  --pf-v6-c-drawer__splitter-handle--after--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
6374
6413
  --pf-v6-c-drawer__splitter-handle--after--BorderInlineEndWidth: 0;
6375
6414
  --pf-v6-c-drawer__splitter-handle--after--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
6376
6415
  --pf-v6-c-drawer__splitter-handle--after--BorderInlineStartWidth: 0;
6377
- --pf-v6-c-drawer__splitter--hover__splitter-handle--after--BorderColor: var(--pf-t--global--border--color--hover);
6416
+ --pf-v6-c-drawer__splitter-handle--after--BorderRadius: var(--pf-t--global--border--radius--pill);
6417
+ --pf-v6-c-drawer__splitter--hover__splitter-handle--after--BorderColor: var(--pf-t--global--color--brand--hover);
6378
6418
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderBlockStartWidth: 0;
6379
6419
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
6380
6420
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderBlockEndWidth: 0;
6381
6421
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
6382
- --pf-v6-c-drawer__splitter-handle--after--Width: 0.75rem;
6422
+ --pf-v6-c-drawer__splitter-handle--after--Width: 2.1875rem;
6383
6423
  --pf-v6-c-drawer__splitter-handle--after--Height: 0.25rem;
6384
6424
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--Width: 0.25rem;
6385
- --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--Height: 0.75rem;
6425
+ --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--Height: 2.1875rem;
6386
6426
  }
6387
6427
  @media screen and (min-width: 75rem) {
6388
6428
  .pf-v6-c-drawer {
@@ -6494,6 +6534,19 @@ ul) {
6494
6534
  --pf-v6-c-drawer__panel--BorderRadius: var(--pf-v6-c-drawer--m-pill__panel--BorderRadius);
6495
6535
  --pf-v6-c-drawer--m-expanded__panel--inset: var(--pf-v6-c-drawer--m-pill--m-expanded__panel--inset);
6496
6536
  --pf-v6-c-drawer__panel--MarginBlock: var(--pf-v6-c-drawer--m-pill--m-expanded__panel--inset);
6537
+ --pf-v6-c-drawer__splitter--m-vertical--Width: var(--pf-v6-c-drawer--m-pill__splitter--m-vertical--Width);
6538
+ --pf-v6-c-drawer__splitter--m-vertical--Height: var(--pf-v6-c-drawer--m-pill__splitter--m-vertical--Height);
6539
+ --pf-v6-c-drawer__splitter--MarginBlockStart: var(--pf-v6-c-drawer--m-pill__splitter--m-vertical--MarginBlockStart);
6540
+ --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-v6-c-drawer--m-pill__splitter--after--BorderColor);
6541
+ --pf-v6-c-drawer__splitter--after--BorderInlineEndWidth: var(--pf-v6-c-drawer--m-pill__splitter--after--BorderInlineEndWidth);
6542
+ --pf-v6-c-drawer__splitter--hover--after--BorderColor: var(--pf-v6-c-drawer--m-pill__splitter--hover--after--BorderColor);
6543
+ --pf-v6-c-drawer__splitter--focus--after--BorderColor: var(--pf-v6-c-drawer--m-pill__splitter--focus--after--BorderColor);
6544
+ --pf-v6-c-drawer__splitter--active--after--BorderColor: var(--pf-v6-c-drawer--m-pill__splitter--active--after--BorderColor);
6545
+ --pf-v6-c-drawer__splitter--after--Width: var(--pf-v6-c-drawer--m-pill__splitter--after--Width);
6546
+ --pf-v6-c-drawer__splitter--after--Height: var(--pf-v6-c-drawer--m-pill__splitter--after--Height);
6547
+ --pf-v6-c-drawer__splitter--after--InsetInlineStart: var(--pf-v6-c-drawer--m-pill__splitter--after--InsetInlineStart);
6548
+ --pf-v6-c-drawer__splitter--after--InsetInlineEnd: var(--pf-v6-c-drawer--m-pill__splitter--after--InsetInlineEnd);
6549
+ --pf-v6-c-drawer__splitter--after--TranslateX: var(--pf-v6-c-drawer--m-pill__splitter--after--TranslateX);
6497
6550
  }
6498
6551
  .pf-v6-c-drawer.pf-m-pill > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
6499
6552
  border-block-start-width: var(--pf-v6-c-drawer--m-pill__panel--BorderBlockStartWidth);
@@ -6502,6 +6555,25 @@ ul) {
6502
6555
  border-inline-end-width: var(--pf-v6-c-drawer--m-pill__panel--BorderInlineEndWidth);
6503
6556
  }
6504
6557
  }
6558
+ @media screen and (min-width: 48rem) {
6559
+ .pf-v6-c-drawer.pf-m-pill.pf-m-panel-bottom {
6560
+ --pf-v6-c-drawer__splitter--Height: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--Height);
6561
+ --pf-v6-c-drawer__splitter--Width: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--Width);
6562
+ --pf-v6-c-drawer__splitter--MarginBlockStart: 0;
6563
+ --pf-v6-c-drawer__splitter--MarginInlineStart: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--MarginInlineStart);
6564
+ --pf-v6-c-drawer__splitter--after--Width: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--Width);
6565
+ --pf-v6-c-drawer__splitter--after--Height: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--Height);
6566
+ --pf-v6-c-drawer__splitter--after--BorderBlockStartWidth: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockStartWidth);
6567
+ --pf-v6-c-drawer--m-panel-bottom__splitter--after--BorderBlockEndWidth: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockEndWidth);
6568
+ --pf-v6-c-drawer__splitter--after--BorderBlockEndWidth: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockEndWidth);
6569
+ --pf-v6-c-drawer__splitter--after--InsetBlockStart: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetBlockStart);
6570
+ --pf-v6-c-drawer__splitter--after--InsetBlockEnd: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetBlockEnd);
6571
+ --pf-v6-c-drawer__splitter--after--TranslateX: initial;
6572
+ --pf-v6-c-drawer__splitter--after--TranslateY: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--TranslateY);
6573
+ --pf-v6-c-drawer__splitter--after--InsetInlineStart: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetInlineStart);
6574
+ --pf-v6-c-drawer__splitter--after--InsetInlineEnd: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetInlineEnd);
6575
+ }
6576
+ }
6505
6577
 
6506
6578
  .pf-v6-c-drawer__section {
6507
6579
  flex-grow: 0;
@@ -6666,8 +6738,11 @@ ul) {
6666
6738
  display: none;
6667
6739
  width: var(--pf-v6-c-drawer__splitter--Width);
6668
6740
  height: var(--pf-v6-c-drawer__splitter--Height);
6741
+ margin-block-start: var(--pf-v6-c-drawer__splitter--MarginBlockStart, 0);
6742
+ margin-inline-start: var(--pf-v6-c-drawer__splitter--MarginInlineStart, 0);
6669
6743
  cursor: var(--pf-v6-c-drawer__splitter--Cursor);
6670
6744
  background-color: var(--pf-v6-c-drawer__splitter--BackgroundColor);
6745
+ outline-offset: var(--pf-v6-c-drawer__splitter--focus--OutlineOffset);
6671
6746
  }
6672
6747
  .pf-v6-c-drawer__splitter.pf-m-vertical {
6673
6748
  --pf-v6-c-drawer__splitter--Height: var(--pf-v6-c-drawer__splitter--m-vertical--Height);
@@ -6680,21 +6755,34 @@ ul) {
6680
6755
  --pf-v6-c-drawer__splitter-handle--after--BorderBlockEndWidth: var(--pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderBlockEndWidth);
6681
6756
  --pf-v6-c-drawer__splitter-handle--after--BorderInlineStartWidth: var(--pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderInlineStartWidth);
6682
6757
  }
6683
- .pf-v6-c-drawer__splitter:hover, .pf-v6-c-drawer__splitter:focus {
6684
- --pf-v6-c-drawer__splitter-handle--after--BorderColor: var(--pf-v6-c-drawer__splitter--hover__splitter-handle--after--BorderColor);
6758
+ .pf-v6-c-drawer__splitter:hover {
6759
+ --pf-v6-c-drawer__splitter-handle--after--BackgroundColor: var(--pf-v6-c-drawer__splitter-handle--hover--after--BackgroundColor);
6760
+ --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-v6-c-drawer__splitter--hover--after--BorderColor);
6761
+ }
6762
+ .pf-v6-c-drawer__splitter:focus {
6763
+ --pf-v6-c-drawer__splitter-handle--after--BackgroundColor: var(--pf-v6-c-drawer__splitter-handle--focus--after--BackgroundColor);
6764
+ --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-v6-c-drawer__splitter--focus--after--BorderColor);
6765
+ }
6766
+ .pf-v6-c-drawer__splitter:active {
6767
+ --pf-v6-c-drawer__splitter-handle--after--BackgroundColor: var(--pf-v6-c-drawer__splitter-handle--active--after--BackgroundColor);
6768
+ --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-v6-c-drawer__splitter--active--after--BorderColor);
6685
6769
  }
6686
6770
  .pf-v6-c-drawer__splitter::after {
6687
6771
  position: absolute;
6688
- inset-block-start: 0;
6689
- inset-block-end: 0;
6690
- inset-inline-start: 0;
6691
- inset-inline-end: 0;
6772
+ inset-block-start: var(--pf-v6-c-drawer__splitter--after--InsetBlockStart);
6773
+ inset-block-end: var(--pf-v6-c-drawer__splitter--after--InsetBlockEnd);
6774
+ inset-inline-start: var(--pf-v6-c-drawer__splitter--after--InsetInlineStart);
6775
+ inset-inline-end: var(--pf-v6-c-drawer__splitter--after--InsetInlineEnd);
6776
+ z-index: -1;
6777
+ width: var(--pf-v6-c-drawer__splitter--after--Width);
6778
+ height: var(--pf-v6-c-drawer__splitter--after--Height);
6692
6779
  content: "";
6693
6780
  border: solid var(--pf-v6-c-drawer__splitter--after--BorderColor);
6694
6781
  border-block-start-width: var(--pf-v6-c-drawer__splitter--after--BorderBlockStartWidth);
6695
6782
  border-block-end-width: var(--pf-v6-c-drawer__splitter--after--BorderBlockEndWidth);
6696
6783
  border-inline-start-width: var(--pf-v6-c-drawer__splitter--after--BorderInlineStartWidth);
6697
6784
  border-inline-end-width: var(--pf-v6-c-drawer__splitter--after--BorderInlineEndWidth);
6785
+ translate: var(--pf-v6-c-drawer__splitter--after--TranslateX, 0) var(--pf-v6-c-drawer__splitter--after--TranslateY, 0);
6698
6786
  }
6699
6787
 
6700
6788
  .pf-v6-c-drawer__splitter-handle {
@@ -6712,12 +6800,14 @@ ul) {
6712
6800
  width: var(--pf-v6-c-drawer__splitter-handle--after--Width);
6713
6801
  height: var(--pf-v6-c-drawer__splitter-handle--after--Height);
6714
6802
  content: "";
6803
+ background-color: var(--pf-v6-c-drawer__splitter-handle--after--BackgroundColor);
6715
6804
  border-color: var(--pf-v6-c-drawer__splitter-handle--after--BorderColor);
6716
6805
  border-style: solid;
6717
6806
  border-block-start-width: var(--pf-v6-c-drawer__splitter-handle--after--BorderBlockStartWidth);
6718
6807
  border-block-end-width: var(--pf-v6-c-drawer__splitter-handle--after--BorderBlockEndWidth);
6719
6808
  border-inline-start-width: var(--pf-v6-c-drawer__splitter-handle--after--BorderInlineStartWidth);
6720
6809
  border-inline-end-width: var(--pf-v6-c-drawer__splitter-handle--after--BorderInlineEndWidth);
6810
+ border-radius: var(--pf-v6-c-drawer__splitter-handle--after--BorderRadius);
6721
6811
  }
6722
6812
 
6723
6813
  @media screen and (min-width: 48rem) {
@@ -13622,6 +13712,9 @@ ul.pf-v6-c-list {
13622
13712
  max-height: 100%;
13623
13713
  background-color: var(--pf-v6-c-page--BackgroundColor);
13624
13714
  }
13715
+ :where(:root.pf-v6-theme-glass) .pf-v6-c-page {
13716
+ background-color: transparent;
13717
+ }
13625
13718
  @media (min-width: 75rem) {
13626
13719
  .pf-v6-c-page {
13627
13720
  --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--xl--Width);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.5.0-prerelease.60",
4
+ "version": "6.5.0-prerelease.62",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -49,7 +49,7 @@
49
49
  "@commitlint/config-conventional": "^19.1.0",
50
50
  "@fortawesome/fontawesome": "^1.1.8",
51
51
  "@octokit/rest": "^20.1.0",
52
- "@patternfly/documentation-framework": "6.36.7",
52
+ "@patternfly/documentation-framework": "6.36.8",
53
53
  "@patternfly/patternfly-a11y": "5.1.0",
54
54
  "@patternfly/react-code-editor": "6.4.1",
55
55
  "@patternfly/react-core": "6.4.1",
package/patternfly-no-globals.css CHANGED
@@ -12590,7 +12590,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
12590
12590
  --pf-v6-c-code-editor__header--BorderStartStartRadius: var(--pf-t--global--border--radius--medium);
12591
12591
  --pf-v6-c-code-editor__header--BorderStartEndRadius: var(--pf-t--global--border--radius--medium);
12592
12592
  --pf-v6-c-code-editor__header-content--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
12593
- --pf-v6-c-code-editor__header-content--m-plain--BackgroundColor: var(--pf-t--global--background--color--primary--default);
12593
+ --pf-v6-c-code-editor__header-content--m-plain--BackgroundColor: transparent;
12594
12594
  --pf-v6-c-code-editor__header-content--PaddingBlockStart: var(--pf-t--global--spacer--xs);
12595
12595
  --pf-v6-c-code-editor__header-content--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
12596
12596
  --pf-v6-c-code-editor__header-content--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -15485,45 +15485,85 @@ ul) {
15485
15485
  --pf-v6-c-drawer__body--m-padding--PaddingInlineEnd: var(--pf-t--global--spacer--md);
15486
15486
  --pf-v6-c-drawer__body--m-padding--PaddingBlockEnd: var(--pf-t--global--spacer--md);
15487
15487
  --pf-v6-c-drawer__body--m-padding--PaddingInlineStart: var(--pf-t--global--spacer--md);
15488
- --pf-v6-c-drawer__splitter--Height: 0.5625rem;
15488
+ --pf-v6-c-drawer__splitter--Height: 0.75rem;
15489
15489
  --pf-v6-c-drawer__splitter--Width: 100%;
15490
- --pf-v6-c-drawer__splitter--BackgroundColor: var(--pf-t--global--background--color--primary--default);
15490
+ --pf-v6-c-drawer__splitter--BackgroundColor: transparent;
15491
15491
  --pf-v6-c-drawer__splitter--Cursor: row-resize;
15492
15492
  --pf-v6-c-drawer__splitter--m-vertical--Height: 100%;
15493
- --pf-v6-c-drawer__splitter--m-vertical--Width: 0.5625rem;
15493
+ --pf-v6-c-drawer__splitter--m-vertical--Width: 0.75rem;
15494
15494
  --pf-v6-c-drawer__splitter--m-vertical--Cursor: col-resize;
15495
+ --pf-v6-c-drawer__splitter--focus--OutlineOffset: -0.0625rem;
15495
15496
  --pf-v6-c-drawer--m-inline__splitter--focus--OutlineOffset: -0.0625rem;
15496
15497
  --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-t--global--border--color--default);
15498
+ --pf-v6-c-drawer__splitter--hover--after--BorderColor: var(--pf-t--global--border--color--default);
15499
+ --pf-v6-c-drawer__splitter--focus--after--BorderColor: var(--pf-t--global--border--color--default);
15500
+ --pf-v6-c-drawer__splitter--active--after--BorderColor: var(--pf-t--global--border--color--default);
15497
15501
  --pf-v6-c-drawer__splitter--after--border-width--base: var(--pf-t--global--border--width--divider--default);
15498
15502
  --pf-v6-c-drawer__splitter--after--BorderBlockStartWidth: 0;
15499
15503
  --pf-v6-c-drawer__splitter--after--BorderInlineEndWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
15500
15504
  --pf-v6-c-drawer__splitter--after--BorderBlockEndWidth: 0;
15501
15505
  --pf-v6-c-drawer__splitter--after--BorderInlineStartWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
15506
+ --pf-v6-c-drawer__splitter--after--InsetBlockStart: 0;
15507
+ --pf-v6-c-drawer__splitter--after--InsetBlockEnd: 0;
15508
+ --pf-v6-c-drawer__splitter--after--InsetInlineStart: 0;
15509
+ --pf-v6-c-drawer__splitter--after--InsetInlineEnd: 0;
15510
+ --pf-v6-c-drawer__splitter--after--Width: auto;
15511
+ --pf-v6-c-drawer__splitter--after--Height: auto;
15502
15512
  --pf-v6-c-drawer--m-panel-bottom__splitter--after--BorderBlockStartWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
15503
15513
  --pf-v6-c-drawer--m-panel-bottom__splitter--after--BorderBlockEndWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
15504
- --pf-v6-c-drawer--m-inline__splitter--m-vertical--Width: 0.625rem;
15514
+ --pf-v6-c-drawer--m-pill__splitter--m-vertical--Width: 0.625rem;
15515
+ --pf-v6-c-drawer--m-pill__splitter--m-vertical--Height: calc(100% - (2 * var(--pf-v6-c-drawer--m-pill__panel--BorderRadius)));
15516
+ --pf-v6-c-drawer--m-pill__splitter--m-vertical--MarginBlockStart: var(--pf-v6-c-drawer--m-pill__panel--BorderRadius);
15517
+ --pf-v6-c-drawer--m-pill__splitter--after--BorderColor: transparent;
15518
+ --pf-v6-c-drawer--m-pill__splitter--after--BorderInlineEndWidth: 0;
15519
+ --pf-v6-c-drawer--m-pill__splitter--hover--after--BorderColor: var(--pf-t--global--border--color--hover);
15520
+ --pf-v6-c-drawer--m-pill__splitter--focus--after--BorderColor: var(--pf-t--global--border--color--clicked);
15521
+ --pf-v6-c-drawer--m-pill__splitter--active--after--BorderColor: var(--pf-t--global--border--color--clicked);
15522
+ --pf-v6-c-drawer--m-pill__splitter--after--Width: 0.0625rem;
15523
+ --pf-v6-c-drawer--m-pill__splitter--after--Height: auto;
15524
+ --pf-v6-c-drawer--m-pill__splitter--after--InsetInlineStart: 50%;
15525
+ --pf-v6-c-drawer--m-pill__splitter--after--InsetInlineEnd: auto;
15526
+ --pf-v6-c-drawer--m-pill__splitter--after--TranslateX: -50%;
15527
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--Height: 0.5rem;
15528
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--Width: calc(100% - (2 * var(--pf-v6-c-drawer--m-pill__panel--BorderRadius)));
15529
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--MarginInlineStart: var(--pf-v6-c-drawer--m-pill__panel--BorderRadius);
15530
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--Width: auto;
15531
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--Height: 0.0625rem;
15532
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockStartWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
15533
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockEndWidth: 0;
15534
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetBlockStart: 50%;
15535
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetBlockEnd: auto;
15536
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetInlineStart: 0;
15537
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetInlineEnd: 0;
15538
+ --pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--TranslateY: -50%;
15539
+ --pf-v6-c-drawer--m-inline__splitter--m-vertical--Width: 0.75rem;
15505
15540
  --pf-v6-c-drawer--m-inline__splitter-handle--InsetInlineStart: 50%;
15506
- --pf-v6-c-drawer--m-inline--m-panel-bottom__splitter--Height: 0.625rem;
15541
+ --pf-v6-c-drawer--m-inline--m-panel-bottom__splitter--Height: 0.75rem;
15507
15542
  --pf-v6-c-drawer--m-inline--m-panel-bottom__splitter-handle--InsetBlockStart: 50%;
15508
15543
  --pf-v6-c-drawer--m-inline--m-panel-bottom__splitter--after--BorderBlockStartWidth: var(--pf-v6-c-drawer__splitter--after--border-width--base);
15509
15544
  --pf-v6-c-drawer__splitter-handle--InsetBlockStart: 50%;
15510
- --pf-v6-c-drawer__splitter-handle--InsetInlineStart: calc(50% - var(--pf-v6-c-drawer__splitter--after--border-width--base));
15545
+ --pf-v6-c-drawer__splitter-handle--InsetInlineStart: 50%;
15511
15546
  --pf-v6-c-drawer--m-panel-left__splitter-handle--InsetInlineStart: 50%;
15512
- --pf-v6-c-drawer--m-panel-bottom__splitter-handle--InsetBlockStart: calc(50% - var(--pf-v6-c-drawer__splitter--after--border-width--base));
15513
- --pf-v6-c-drawer__splitter-handle--after--BorderColor: var(--pf-t--global--border--color--default);
15547
+ --pf-v6-c-drawer--m-panel-bottom__splitter-handle--InsetBlockStart: 50%;
15548
+ --pf-v6-c-drawer__splitter-handle--after--BackgroundColor: var(--pf-t--global--border--color--control--default);
15549
+ --pf-v6-c-drawer__splitter-handle--hover--after--BackgroundColor: var(--pf-t--global--border--color--hover);
15550
+ --pf-v6-c-drawer__splitter-handle--focus--after--BackgroundColor: var(--pf-t--global--border--color--clicked);
15551
+ --pf-v6-c-drawer__splitter-handle--active--after--BackgroundColor: var(--pf-t--global--border--color--clicked);
15552
+ --pf-v6-c-drawer__splitter-handle--after--BorderColor: var(--pf-t--global--border--color--high-contrast);
15514
15553
  --pf-v6-c-drawer__splitter-handle--after--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
15515
15554
  --pf-v6-c-drawer__splitter-handle--after--BorderInlineEndWidth: 0;
15516
15555
  --pf-v6-c-drawer__splitter-handle--after--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
15517
15556
  --pf-v6-c-drawer__splitter-handle--after--BorderInlineStartWidth: 0;
15518
- --pf-v6-c-drawer__splitter--hover__splitter-handle--after--BorderColor: var(--pf-t--global--border--color--hover);
15557
+ --pf-v6-c-drawer__splitter-handle--after--BorderRadius: var(--pf-t--global--border--radius--pill);
15558
+ --pf-v6-c-drawer__splitter--hover__splitter-handle--after--BorderColor: var(--pf-t--global--color--brand--hover);
15519
15559
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderBlockStartWidth: 0;
15520
15560
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
15521
15561
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderBlockEndWidth: 0;
15522
15562
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
15523
- --pf-v6-c-drawer__splitter-handle--after--Width: 0.75rem;
15563
+ --pf-v6-c-drawer__splitter-handle--after--Width: 2.1875rem;
15524
15564
  --pf-v6-c-drawer__splitter-handle--after--Height: 0.25rem;
15525
15565
  --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--Width: 0.25rem;
15526
- --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--Height: 0.75rem;
15566
+ --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--Height: 2.1875rem;
15527
15567
  }
15528
15568
  @media screen and (min-width: 75rem) {
15529
15569
  .pf-v6-c-drawer {
@@ -15635,6 +15675,19 @@ ul) {
15635
15675
  --pf-v6-c-drawer__panel--BorderRadius: var(--pf-v6-c-drawer--m-pill__panel--BorderRadius);
15636
15676
  --pf-v6-c-drawer--m-expanded__panel--inset: var(--pf-v6-c-drawer--m-pill--m-expanded__panel--inset);
15637
15677
  --pf-v6-c-drawer__panel--MarginBlock: var(--pf-v6-c-drawer--m-pill--m-expanded__panel--inset);
15678
+ --pf-v6-c-drawer__splitter--m-vertical--Width: var(--pf-v6-c-drawer--m-pill__splitter--m-vertical--Width);
15679
+ --pf-v6-c-drawer__splitter--m-vertical--Height: var(--pf-v6-c-drawer--m-pill__splitter--m-vertical--Height);
15680
+ --pf-v6-c-drawer__splitter--MarginBlockStart: var(--pf-v6-c-drawer--m-pill__splitter--m-vertical--MarginBlockStart);
15681
+ --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-v6-c-drawer--m-pill__splitter--after--BorderColor);
15682
+ --pf-v6-c-drawer__splitter--after--BorderInlineEndWidth: var(--pf-v6-c-drawer--m-pill__splitter--after--BorderInlineEndWidth);
15683
+ --pf-v6-c-drawer__splitter--hover--after--BorderColor: var(--pf-v6-c-drawer--m-pill__splitter--hover--after--BorderColor);
15684
+ --pf-v6-c-drawer__splitter--focus--after--BorderColor: var(--pf-v6-c-drawer--m-pill__splitter--focus--after--BorderColor);
15685
+ --pf-v6-c-drawer__splitter--active--after--BorderColor: var(--pf-v6-c-drawer--m-pill__splitter--active--after--BorderColor);
15686
+ --pf-v6-c-drawer__splitter--after--Width: var(--pf-v6-c-drawer--m-pill__splitter--after--Width);
15687
+ --pf-v6-c-drawer__splitter--after--Height: var(--pf-v6-c-drawer--m-pill__splitter--after--Height);
15688
+ --pf-v6-c-drawer__splitter--after--InsetInlineStart: var(--pf-v6-c-drawer--m-pill__splitter--after--InsetInlineStart);
15689
+ --pf-v6-c-drawer__splitter--after--InsetInlineEnd: var(--pf-v6-c-drawer--m-pill__splitter--after--InsetInlineEnd);
15690
+ --pf-v6-c-drawer__splitter--after--TranslateX: var(--pf-v6-c-drawer--m-pill__splitter--after--TranslateX);
15638
15691
  }
15639
15692
  .pf-v6-c-drawer.pf-m-pill > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
15640
15693
  border-block-start-width: var(--pf-v6-c-drawer--m-pill__panel--BorderBlockStartWidth);
@@ -15643,6 +15696,25 @@ ul) {
15643
15696
  border-inline-end-width: var(--pf-v6-c-drawer--m-pill__panel--BorderInlineEndWidth);
15644
15697
  }
15645
15698
  }
15699
+ @media screen and (min-width: 48rem) {
15700
+ .pf-v6-c-drawer.pf-m-pill.pf-m-panel-bottom {
15701
+ --pf-v6-c-drawer__splitter--Height: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--Height);
15702
+ --pf-v6-c-drawer__splitter--Width: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--Width);
15703
+ --pf-v6-c-drawer__splitter--MarginBlockStart: 0;
15704
+ --pf-v6-c-drawer__splitter--MarginInlineStart: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--MarginInlineStart);
15705
+ --pf-v6-c-drawer__splitter--after--Width: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--Width);
15706
+ --pf-v6-c-drawer__splitter--after--Height: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--Height);
15707
+ --pf-v6-c-drawer__splitter--after--BorderBlockStartWidth: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockStartWidth);
15708
+ --pf-v6-c-drawer--m-panel-bottom__splitter--after--BorderBlockEndWidth: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockEndWidth);
15709
+ --pf-v6-c-drawer__splitter--after--BorderBlockEndWidth: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--BorderBlockEndWidth);
15710
+ --pf-v6-c-drawer__splitter--after--InsetBlockStart: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetBlockStart);
15711
+ --pf-v6-c-drawer__splitter--after--InsetBlockEnd: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetBlockEnd);
15712
+ --pf-v6-c-drawer__splitter--after--TranslateX: initial;
15713
+ --pf-v6-c-drawer__splitter--after--TranslateY: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--TranslateY);
15714
+ --pf-v6-c-drawer__splitter--after--InsetInlineStart: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetInlineStart);
15715
+ --pf-v6-c-drawer__splitter--after--InsetInlineEnd: var(--pf-v6-c-drawer--m-pill--m-panel-bottom__splitter--after--InsetInlineEnd);
15716
+ }
15717
+ }
15646
15718
 
15647
15719
  .pf-v6-c-drawer__section {
15648
15720
  flex-grow: 0;
@@ -15807,8 +15879,11 @@ ul) {
15807
15879
  display: none;
15808
15880
  width: var(--pf-v6-c-drawer__splitter--Width);
15809
15881
  height: var(--pf-v6-c-drawer__splitter--Height);
15882
+ margin-block-start: var(--pf-v6-c-drawer__splitter--MarginBlockStart, 0);
15883
+ margin-inline-start: var(--pf-v6-c-drawer__splitter--MarginInlineStart, 0);
15810
15884
  cursor: var(--pf-v6-c-drawer__splitter--Cursor);
15811
15885
  background-color: var(--pf-v6-c-drawer__splitter--BackgroundColor);
15886
+ outline-offset: var(--pf-v6-c-drawer__splitter--focus--OutlineOffset);
15812
15887
  }
15813
15888
  .pf-v6-c-drawer__splitter.pf-m-vertical {
15814
15889
  --pf-v6-c-drawer__splitter--Height: var(--pf-v6-c-drawer__splitter--m-vertical--Height);
@@ -15821,21 +15896,34 @@ ul) {
15821
15896
  --pf-v6-c-drawer__splitter-handle--after--BorderBlockEndWidth: var(--pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderBlockEndWidth);
15822
15897
  --pf-v6-c-drawer__splitter-handle--after--BorderInlineStartWidth: var(--pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--BorderInlineStartWidth);
15823
15898
  }
15824
- .pf-v6-c-drawer__splitter:hover, .pf-v6-c-drawer__splitter:focus {
15825
- --pf-v6-c-drawer__splitter-handle--after--BorderColor: var(--pf-v6-c-drawer__splitter--hover__splitter-handle--after--BorderColor);
15899
+ .pf-v6-c-drawer__splitter:hover {
15900
+ --pf-v6-c-drawer__splitter-handle--after--BackgroundColor: var(--pf-v6-c-drawer__splitter-handle--hover--after--BackgroundColor);
15901
+ --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-v6-c-drawer__splitter--hover--after--BorderColor);
15902
+ }
15903
+ .pf-v6-c-drawer__splitter:focus {
15904
+ --pf-v6-c-drawer__splitter-handle--after--BackgroundColor: var(--pf-v6-c-drawer__splitter-handle--focus--after--BackgroundColor);
15905
+ --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-v6-c-drawer__splitter--focus--after--BorderColor);
15906
+ }
15907
+ .pf-v6-c-drawer__splitter:active {
15908
+ --pf-v6-c-drawer__splitter-handle--after--BackgroundColor: var(--pf-v6-c-drawer__splitter-handle--active--after--BackgroundColor);
15909
+ --pf-v6-c-drawer__splitter--after--BorderColor: var(--pf-v6-c-drawer__splitter--active--after--BorderColor);
15826
15910
  }
15827
15911
  .pf-v6-c-drawer__splitter::after {
15828
15912
  position: absolute;
15829
- inset-block-start: 0;
15830
- inset-block-end: 0;
15831
- inset-inline-start: 0;
15832
- inset-inline-end: 0;
15913
+ inset-block-start: var(--pf-v6-c-drawer__splitter--after--InsetBlockStart);
15914
+ inset-block-end: var(--pf-v6-c-drawer__splitter--after--InsetBlockEnd);
15915
+ inset-inline-start: var(--pf-v6-c-drawer__splitter--after--InsetInlineStart);
15916
+ inset-inline-end: var(--pf-v6-c-drawer__splitter--after--InsetInlineEnd);
15917
+ z-index: -1;
15918
+ width: var(--pf-v6-c-drawer__splitter--after--Width);
15919
+ height: var(--pf-v6-c-drawer__splitter--after--Height);
15833
15920
  content: "";
15834
15921
  border: solid var(--pf-v6-c-drawer__splitter--after--BorderColor);
15835
15922
  border-block-start-width: var(--pf-v6-c-drawer__splitter--after--BorderBlockStartWidth);
15836
15923
  border-block-end-width: var(--pf-v6-c-drawer__splitter--after--BorderBlockEndWidth);
15837
15924
  border-inline-start-width: var(--pf-v6-c-drawer__splitter--after--BorderInlineStartWidth);
15838
15925
  border-inline-end-width: var(--pf-v6-c-drawer__splitter--after--BorderInlineEndWidth);
15926
+ translate: var(--pf-v6-c-drawer__splitter--after--TranslateX, 0) var(--pf-v6-c-drawer__splitter--after--TranslateY, 0);
15839
15927
  }
15840
15928
 
15841
15929
  .pf-v6-c-drawer__splitter-handle {
@@ -15853,12 +15941,14 @@ ul) {
15853
15941
  width: var(--pf-v6-c-drawer__splitter-handle--after--Width);
15854
15942
  height: var(--pf-v6-c-drawer__splitter-handle--after--Height);
15855
15943
  content: "";
15944
+ background-color: var(--pf-v6-c-drawer__splitter-handle--after--BackgroundColor);
15856
15945
  border-color: var(--pf-v6-c-drawer__splitter-handle--after--BorderColor);
15857
15946
  border-style: solid;
15858
15947
  border-block-start-width: var(--pf-v6-c-drawer__splitter-handle--after--BorderBlockStartWidth);
15859
15948
  border-block-end-width: var(--pf-v6-c-drawer__splitter-handle--after--BorderBlockEndWidth);
15860
15949
  border-inline-start-width: var(--pf-v6-c-drawer__splitter-handle--after--BorderInlineStartWidth);
15861
15950
  border-inline-end-width: var(--pf-v6-c-drawer__splitter-handle--after--BorderInlineEndWidth);
15951
+ border-radius: var(--pf-v6-c-drawer__splitter-handle--after--BorderRadius);
15862
15952
  }
15863
15953
 
15864
15954
  @media screen and (min-width: 48rem) {
@@ -22763,6 +22853,9 @@ ul.pf-v6-c-list {
22763
22853
  max-height: 100%;
22764
22854
  background-color: var(--pf-v6-c-page--BackgroundColor);
22765
22855
  }
22856
+ :where(:root.pf-v6-theme-glass) .pf-v6-c-page {
22857
+ background-color: transparent;
22858
+ }
22766
22859
  @media (min-width: 75rem) {
22767
22860
  .pf-v6-c-page {
22768
22861
  --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--xl--Width);