@patternfly/patternfly 6.6.0-prerelease.2 → 6.6.0-prerelease.4

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 (17) hide show
  1. package/base/patternfly-variables.css +2 -0
  2. package/base/tokens/tokens-felt-glass.scss +2 -1
  3. package/base/tokens/tokens-glass.scss +2 -1
  4. package/components/Compass/compass.css +5 -1
  5. package/components/Compass/compass.scss +5 -1
  6. package/components/Masthead/masthead.css +1 -1
  7. package/components/Masthead/masthead.scss +1 -1
  8. package/components/Page/page.css +23 -18
  9. package/components/Page/page.scss +27 -22
  10. package/components/_index.css +29 -20
  11. package/package.json +2 -2
  12. package/patternfly-base-no-globals.css +2 -0
  13. package/patternfly-base.css +2 -0
  14. package/patternfly-no-globals.css +31 -20
  15. package/patternfly.css +31 -20
  16. package/patternfly.min.css +1 -1
  17. package/patternfly.min.css.map +1 -1
package/patternfly-no-globals.css CHANGED
@@ -8086,6 +8086,7 @@
8086
8086
  --pf-t--global--border--color--glass--default: var(--pf-t--global--border--color--alt);
8087
8087
  --pf-t--global--border--radius--glass--default: var(--pf-t--global--border--radius--medium);
8088
8088
  --pf-t--global--border--width--glass--default: var(--pf-t--global--border--width--regular);
8089
+ --pf-t--global--spacer--inset--page-chrome: var(--pf-t--global--spacer--md);
8089
8090
  --pf-t--global--background--color--floating--secondary--default: var(--pf-t--global--background--color--floating--default);
8090
8091
  --pf-t--global--background--image--default: var(--pf-t--global--background--image--glass, url("./assets/images/PF-Bkg-Generic-Light.svg"));
8091
8092
  --pf-t--global--box-shadow--glass--default: var(--pf-t--global--box-shadow--md);
@@ -8239,6 +8240,7 @@
8239
8240
  --pf-t--global--color--brand--accent--clicked: var(--pf-t--global--color--brand--accent--200);
8240
8241
  --pf-t--global--color--brand--accent--default: var(--pf-t--global--color--brand--accent--100);
8241
8242
  --pf-t--global--color--brand--accent--hover: var(--pf-t--global--color--brand--accent--200);
8243
+ --pf-t--global--spacer--inset--page-chrome: var(--pf-t--global--spacer--md);
8242
8244
  --pf-t--global--background--color--floating--secondary--default: var(--pf-t--global--background--color--floating--default);
8243
8245
  --pf-t--global--background--image--default: var(--pf-t--global--background--image--felt--glass, url("./assets/images/Felt-Bkg-Generic-Light.svg"));
8244
8246
  }
@@ -13257,15 +13259,18 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
13257
13259
  inset-inline-start: 0;
13258
13260
  z-index: var(--pf-v6-c-compass__dock--ZIndex);
13259
13261
  display: flex;
13262
+ visibility: hidden;
13260
13263
  flex-direction: column;
13261
13264
  grid-area: dock;
13262
13265
  width: var(--pf-v6-c-compass__dock--Width);
13263
13266
  translate: -100% 0;
13264
- transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide);
13267
+ transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s var(--pf-v6-c-compass__dock--TransitionDuration--slide);
13265
13268
  }
13266
13269
  .pf-v6-c-compass__dock.pf-m-expanded {
13267
13270
  --pf-v6-c-compass__dock--TransitionDuration--slide: var(--pf-v6-c-compass__dock--m-expanded--TransitionDuration--slide);
13271
+ visibility: visible;
13268
13272
  translate: 0;
13273
+ transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s 0s;
13269
13274
  }
13270
13275
  @media (min-width: 62rem) {
13271
13276
  .pf-v6-c-compass__dock {
@@ -13273,6 +13278,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
13273
13278
  --pf-v6-c-compass__dock-main--BorderInlineEndColor: var(--pf-v6-c-compass__dock-main--desktop--BorderInlineEndColor);
13274
13279
  position: revert;
13275
13280
  inset: revert;
13281
+ visibility: revert;
13276
13282
  width: auto;
13277
13283
  translate: 0;
13278
13284
  }
@@ -19922,7 +19928,7 @@ ul.pf-v6-c-list {
19922
19928
  --pf-v6-c-masthead--ColumnGap: var(--pf-t--global--spacer--gutter--default);
19923
19929
  --pf-v6-c-masthead--BorderWidth: var(--pf-t--global--border--width--divider--default);
19924
19930
  --pf-v6-c-masthead--PaddingBlock: var(--pf-t--global--spacer--md);
19925
- --pf-v6-c-masthead--PaddingInline: var(--pf-t--global--spacer--lg);
19931
+ --pf-v6-c-masthead--PaddingInline: var(--pf-t--global--spacer--inset--page-chrome);
19926
19932
  --pf-v6-c-masthead--BorderColor: var(--pf-t--global--border--color--default);
19927
19933
  --pf-v6-c-masthead--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
19928
19934
  --pf-v6-c-masthead__main--ColumnGap: var(--pf-t--global--spacer--md);
@@ -22948,11 +22954,6 @@ ul.pf-v6-c-list {
22948
22954
  .pf-v6-c-page {
22949
22955
  --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
22950
22956
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
22951
- --pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg) * 2);
22952
- --pf-v6-c-page--m-dock__main-container--MarginBlockStart: 0;
22953
- --pf-v6-c-page--m-dock__main-container--desktop--MarginBlockStart: var(--pf-t--global--spacer--lg);
22954
- --pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
22955
- --pf-v6-c-page--m-dock--c-masthead--m-display-inline--GridTemplateColumns: min-content 1fr;
22956
22957
  --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
22957
22958
  --pf-v6-c-page__dock--Width: 15.625rem;
22958
22959
  --pf-v6-c-page__dock--desktop--Width: auto;
@@ -22971,6 +22972,11 @@ ul.pf-v6-c-list {
22971
22972
  --pf-v6-c-page__dock-main--desktop--BorderInlineEndColor: var(--pf-t--global--border--color--glass--default, transparent);
22972
22973
  --pf-v6-c-page__dock--m-expanded__dock-main--BorderInlineEndWidth: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--regular));
22973
22974
  --pf-v6-c-page__dock--m-expanded__dock-main--BorderInlineEndColor: var(--pf-t--global--border--color--glass--default, var(--pf-t--global--border--color--subtle));
22975
+ --pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--inset--page-chrome) * 2);
22976
+ --pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-t--global--spacer--inset--page-chrome);
22977
+ --pf-v6-c-page--m-dock__main-container--desktop--MarginBlockStart: var(--pf-t--global--spacer--inset--page-chrome);
22978
+ --pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
22979
+ --pf-v6-c-page--m-dock--c-masthead--m-display-inline--GridTemplateColumns: min-content 1fr;
22974
22980
  --pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
22975
22981
  --pf-v6-c-page__sidebar--Width--base: 18.125rem;
22976
22982
  --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--Width--base);
@@ -23141,20 +23147,17 @@ ul.pf-v6-c-list {
23141
23147
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
23142
23148
  --pf-v6-c-page__drawer--c-drawer--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
23143
23149
  --pf-v6-c-page__drawer--c-drawer--BorderBlockStartColor: var(--pf-t--global--border--color--high-contrast);
23144
- --pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg) * 2);
23145
- --pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-t--global--spacer--lg);
23146
- --pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
23147
23150
  --pf-v6-c-page--BackgroundColor--glass: transparent;
23148
23151
  --pf-v6-c-page__sidebar--Width--base--glass: calc(18.125rem + var(--pf-t--global--spacer--inset--page-chrome) * 2);
23149
- --pf-v6-c-page__sidebar--MarginBlockStart--glass: var(--pf-t--global--spacer--inset--page-chrome);
23150
- --pf-v6-c-page__sidebar-body--PaddingInlineStart--glass: var(--pf-t--global--spacer--lg);
23151
- --pf-v6-c-page__sidebar-body--PaddingInlineEnd--glass: var(--pf-t--global--spacer--lg);
23152
+ --pf-v6-c-page__sidebar--MarginBlockStart--glass: var(--pf-t--global--spacer--gutter--default);
23153
+ --pf-v6-c-page__sidebar-body--PaddingInlineStart--glass: var(--pf-t--global--spacer--md);
23154
+ --pf-v6-c-page__sidebar-body--PaddingInlineEnd--glass: var(--pf-t--global--spacer--md);
23152
23155
  --pf-v6-c-page__sidebar-main--PaddingBlockEnd--glass: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
23153
23156
  --pf-v6-c-page__sidebar-main--PaddingInlineStart--glass: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
23154
23157
  --pf-v6-c-page__sidebar-main--PaddingInlineEnd--glass: var(--pf-v6-c-page__sidebar--PaddingInlineEnd);
23155
- --pf-v6-c-page__sidebar-main--MarginBlockStart--glass: calc(var(--pf-t--global--spacer--sm) * -1);
23156
- --pf-v6-c-page__sidebar-main--MarginBlockEnd--glass: var(--pf-t--global--spacer--md);
23157
- --pf-v6-c-page__sidebar-main--MarginInlineStart--glass: var(--pf-t--global--spacer--md);
23158
+ --pf-v6-c-page__sidebar-main--MarginBlockStart--glass: calc(var(--pf-t--global--spacer--xs) * -1);
23159
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd--glass: calc(var(--pf-t--global--spacer--inset--page-chrome) - var(--pf-t--global--spacer--xs));
23160
+ --pf-v6-c-page__sidebar-main--MarginInlineStart--glass: calc(var(--pf-t--global--spacer--inset--page-chrome) - var(--pf-t--global--spacer--xs));
23158
23161
  --pf-v6-c-page__sidebar-main--MarginInlineEnd--glass: var(--pf-t--global--spacer--md);
23159
23162
  --pf-v6-c-page__sidebar-main--BackgroundColor--glass: var(--pf-v6-c-page__sidebar--BackgroundColor);
23160
23163
  --pf-v6-c-page__sidebar-main--BackdropFilter--glass: var(--pf-v6-c-page__sidebar--BackdropFilter);
@@ -23165,9 +23168,11 @@ ul.pf-v6-c-list {
23165
23168
  --pf-v6-c-page__sidebar-main--xl--MarginBlockStart--glass: 0;
23166
23169
  --pf-v6-c-page__sidebar-main--xl--MarginBlockEnd--glass: var(--pf-t--global--spacer--inset--page-chrome);
23167
23170
  --pf-v6-c-page__sidebar-main--xl--MarginInlineStart--glass: var(--pf-t--global--spacer--inset--page-chrome);
23168
- --pf-v6-c-page__sidebar-main--xl--MarginInlineEnd--glass: var(--pf-t--global--spacer--inset--page-chrome);
23169
- --pf-v6-c-page__main-container--MarginBlockStart--glass: var(--pf-t--global--spacer--inset--page-chrome);
23170
- --pf-v6-c-page__main-container--MaxHeight--glass: calc(100% - var(--pf-t--global--spacer--inset--page-chrome) * 2);
23171
+ --pf-v6-c-page__sidebar-main--xl--MarginInlineEnd--glass: var(--pf-t--global--spacer--gutter--default);
23172
+ --pf-v6-c-page__main-container--MarginBlockStart--glass: var(--pf-t--global--spacer--gutter--default);
23173
+ --pf-v6-c-page__main-container--MaxHeight--glass: calc(100% - var(--pf-t--global--spacer--inset--page-chrome) - var(--pf-t--global--spacer--gutter--default));
23174
+ --pf-v6-c-page--m-dock__main-container--MaxHeight--glass: calc(100% - var(--pf-t--global--spacer--inset--page-chrome) - var(--pf-t--global--spacer--gutter--default));
23175
+ --pf-v6-c-page--m-dock__main-container--MarginBlockStart--glass: var(--pf-t--global--spacer--gutter--default);
23171
23176
  }
23172
23177
  :where(.pf-v6-theme-glass) .pf-v6-c-page {
23173
23178
  --pf-v6-c-page--BackgroundColor: var(--pf-v6-c-page--BackgroundColor--glass);
@@ -23190,6 +23195,8 @@ ul.pf-v6-c-list {
23190
23195
  --pf-v6-c-page__sidebar-main--BoxShadow: var(--pf-v6-c-page__sidebar-main--BoxShadow--glass);
23191
23196
  --pf-v6-c-page__main-container--MarginBlockStart: var(--pf-v6-c-page__main-container--MarginBlockStart--glass);
23192
23197
  --pf-v6-c-page__main-container--MaxHeight: var(--pf-v6-c-page__main-container--MaxHeight--glass);
23198
+ --pf-v6-c-page--m-dock__main-container--MaxHeight: var(--pf-v6-c-page--m-dock__main-container--MaxHeight--glass);
23199
+ --pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-v6-c-page--m-dock__main-container--MarginBlockStart--glass);
23193
23200
  }
23194
23201
  @media (min-width: 75rem) {
23195
23202
  .pf-v6-c-page {
@@ -23341,10 +23348,11 @@ ul.pf-v6-c-list {
23341
23348
  inset-inline-start: 0;
23342
23349
  z-index: var(--pf-v6-c-page__dock--ZIndex);
23343
23350
  display: flex;
23351
+ visibility: hidden;
23344
23352
  flex-direction: column;
23345
23353
  grid-area: dock;
23346
23354
  width: var(--pf-v6-c-page__dock--Width);
23347
- transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide);
23355
+ transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide), visibility 0s var(--pf-v6-c-page__dock--TransitionDuration--slide);
23348
23356
  translate: -100% 0;
23349
23357
  }
23350
23358
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-page__dock {
@@ -23353,7 +23361,9 @@ ul.pf-v6-c-list {
23353
23361
 
23354
23362
  .pf-v6-c-page__dock.pf-m-expanded {
23355
23363
  --pf-v6-c-page__dock--TransitionDuration--slide: var(--pf-v6-c-page__dock--m-expanded--TransitionDuration--slide);
23364
+ visibility: visible;
23356
23365
  translate: 0;
23366
+ transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide), visibility 0s 0s;
23357
23367
  }
23358
23368
  @media (min-width: 62rem) {
23359
23369
  .pf-v6-c-page__dock {
@@ -23361,6 +23371,7 @@ ul.pf-v6-c-list {
23361
23371
  --pf-v6-c-page__dock-main--BorderInlineEndColor: var(--pf-v6-c-page__dock-main--desktop--BorderInlineEndColor);
23362
23372
  position: revert;
23363
23373
  inset: revert;
23374
+ visibility: revert;
23364
23375
  width: auto;
23365
23376
  translate: 0;
23366
23377
  }
package/patternfly.css CHANGED
@@ -8241,6 +8241,7 @@ button) {
8241
8241
  --pf-t--global--border--color--glass--default: var(--pf-t--global--border--color--alt);
8242
8242
  --pf-t--global--border--radius--glass--default: var(--pf-t--global--border--radius--medium);
8243
8243
  --pf-t--global--border--width--glass--default: var(--pf-t--global--border--width--regular);
8244
+ --pf-t--global--spacer--inset--page-chrome: var(--pf-t--global--spacer--md);
8244
8245
  --pf-t--global--background--color--floating--secondary--default: var(--pf-t--global--background--color--floating--default);
8245
8246
  --pf-t--global--background--image--default: var(--pf-t--global--background--image--glass, url("./assets/images/PF-Bkg-Generic-Light.svg"));
8246
8247
  --pf-t--global--box-shadow--glass--default: var(--pf-t--global--box-shadow--md);
@@ -8394,6 +8395,7 @@ button) {
8394
8395
  --pf-t--global--color--brand--accent--clicked: var(--pf-t--global--color--brand--accent--200);
8395
8396
  --pf-t--global--color--brand--accent--default: var(--pf-t--global--color--brand--accent--100);
8396
8397
  --pf-t--global--color--brand--accent--hover: var(--pf-t--global--color--brand--accent--200);
8398
+ --pf-t--global--spacer--inset--page-chrome: var(--pf-t--global--spacer--md);
8397
8399
  --pf-t--global--background--color--floating--secondary--default: var(--pf-t--global--background--color--floating--default);
8398
8400
  --pf-t--global--background--image--default: var(--pf-t--global--background--image--felt--glass, url("./assets/images/Felt-Bkg-Generic-Light.svg"));
8399
8401
  }
@@ -13412,15 +13414,18 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
13412
13414
  inset-inline-start: 0;
13413
13415
  z-index: var(--pf-v6-c-compass__dock--ZIndex);
13414
13416
  display: flex;
13417
+ visibility: hidden;
13415
13418
  flex-direction: column;
13416
13419
  grid-area: dock;
13417
13420
  width: var(--pf-v6-c-compass__dock--Width);
13418
13421
  translate: -100% 0;
13419
- transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide);
13422
+ transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s var(--pf-v6-c-compass__dock--TransitionDuration--slide);
13420
13423
  }
13421
13424
  .pf-v6-c-compass__dock.pf-m-expanded {
13422
13425
  --pf-v6-c-compass__dock--TransitionDuration--slide: var(--pf-v6-c-compass__dock--m-expanded--TransitionDuration--slide);
13426
+ visibility: visible;
13423
13427
  translate: 0;
13428
+ transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s 0s;
13424
13429
  }
13425
13430
  @media (min-width: 62rem) {
13426
13431
  .pf-v6-c-compass__dock {
@@ -13428,6 +13433,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
13428
13433
  --pf-v6-c-compass__dock-main--BorderInlineEndColor: var(--pf-v6-c-compass__dock-main--desktop--BorderInlineEndColor);
13429
13434
  position: revert;
13430
13435
  inset: revert;
13436
+ visibility: revert;
13431
13437
  width: auto;
13432
13438
  translate: 0;
13433
13439
  }
@@ -20077,7 +20083,7 @@ ul.pf-v6-c-list {
20077
20083
  --pf-v6-c-masthead--ColumnGap: var(--pf-t--global--spacer--gutter--default);
20078
20084
  --pf-v6-c-masthead--BorderWidth: var(--pf-t--global--border--width--divider--default);
20079
20085
  --pf-v6-c-masthead--PaddingBlock: var(--pf-t--global--spacer--md);
20080
- --pf-v6-c-masthead--PaddingInline: var(--pf-t--global--spacer--lg);
20086
+ --pf-v6-c-masthead--PaddingInline: var(--pf-t--global--spacer--inset--page-chrome);
20081
20087
  --pf-v6-c-masthead--BorderColor: var(--pf-t--global--border--color--default);
20082
20088
  --pf-v6-c-masthead--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
20083
20089
  --pf-v6-c-masthead__main--ColumnGap: var(--pf-t--global--spacer--md);
@@ -23103,11 +23109,6 @@ ul.pf-v6-c-list {
23103
23109
  .pf-v6-c-page {
23104
23110
  --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
23105
23111
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
23106
- --pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg) * 2);
23107
- --pf-v6-c-page--m-dock__main-container--MarginBlockStart: 0;
23108
- --pf-v6-c-page--m-dock__main-container--desktop--MarginBlockStart: var(--pf-t--global--spacer--lg);
23109
- --pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
23110
- --pf-v6-c-page--m-dock--c-masthead--m-display-inline--GridTemplateColumns: min-content 1fr;
23111
23112
  --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
23112
23113
  --pf-v6-c-page__dock--Width: 15.625rem;
23113
23114
  --pf-v6-c-page__dock--desktop--Width: auto;
@@ -23126,6 +23127,11 @@ ul.pf-v6-c-list {
23126
23127
  --pf-v6-c-page__dock-main--desktop--BorderInlineEndColor: var(--pf-t--global--border--color--glass--default, transparent);
23127
23128
  --pf-v6-c-page__dock--m-expanded__dock-main--BorderInlineEndWidth: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--regular));
23128
23129
  --pf-v6-c-page__dock--m-expanded__dock-main--BorderInlineEndColor: var(--pf-t--global--border--color--glass--default, var(--pf-t--global--border--color--subtle));
23130
+ --pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--inset--page-chrome) * 2);
23131
+ --pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-t--global--spacer--inset--page-chrome);
23132
+ --pf-v6-c-page--m-dock__main-container--desktop--MarginBlockStart: var(--pf-t--global--spacer--inset--page-chrome);
23133
+ --pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
23134
+ --pf-v6-c-page--m-dock--c-masthead--m-display-inline--GridTemplateColumns: min-content 1fr;
23129
23135
  --pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
23130
23136
  --pf-v6-c-page__sidebar--Width--base: 18.125rem;
23131
23137
  --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--Width--base);
@@ -23296,20 +23302,17 @@ ul.pf-v6-c-list {
23296
23302
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
23297
23303
  --pf-v6-c-page__drawer--c-drawer--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
23298
23304
  --pf-v6-c-page__drawer--c-drawer--BorderBlockStartColor: var(--pf-t--global--border--color--high-contrast);
23299
- --pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg) * 2);
23300
- --pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-t--global--spacer--lg);
23301
- --pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
23302
23305
  --pf-v6-c-page--BackgroundColor--glass: transparent;
23303
23306
  --pf-v6-c-page__sidebar--Width--base--glass: calc(18.125rem + var(--pf-t--global--spacer--inset--page-chrome) * 2);
23304
- --pf-v6-c-page__sidebar--MarginBlockStart--glass: var(--pf-t--global--spacer--inset--page-chrome);
23305
- --pf-v6-c-page__sidebar-body--PaddingInlineStart--glass: var(--pf-t--global--spacer--lg);
23306
- --pf-v6-c-page__sidebar-body--PaddingInlineEnd--glass: var(--pf-t--global--spacer--lg);
23307
+ --pf-v6-c-page__sidebar--MarginBlockStart--glass: var(--pf-t--global--spacer--gutter--default);
23308
+ --pf-v6-c-page__sidebar-body--PaddingInlineStart--glass: var(--pf-t--global--spacer--md);
23309
+ --pf-v6-c-page__sidebar-body--PaddingInlineEnd--glass: var(--pf-t--global--spacer--md);
23307
23310
  --pf-v6-c-page__sidebar-main--PaddingBlockEnd--glass: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
23308
23311
  --pf-v6-c-page__sidebar-main--PaddingInlineStart--glass: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
23309
23312
  --pf-v6-c-page__sidebar-main--PaddingInlineEnd--glass: var(--pf-v6-c-page__sidebar--PaddingInlineEnd);
23310
- --pf-v6-c-page__sidebar-main--MarginBlockStart--glass: calc(var(--pf-t--global--spacer--sm) * -1);
23311
- --pf-v6-c-page__sidebar-main--MarginBlockEnd--glass: var(--pf-t--global--spacer--md);
23312
- --pf-v6-c-page__sidebar-main--MarginInlineStart--glass: var(--pf-t--global--spacer--md);
23313
+ --pf-v6-c-page__sidebar-main--MarginBlockStart--glass: calc(var(--pf-t--global--spacer--xs) * -1);
23314
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd--glass: calc(var(--pf-t--global--spacer--inset--page-chrome) - var(--pf-t--global--spacer--xs));
23315
+ --pf-v6-c-page__sidebar-main--MarginInlineStart--glass: calc(var(--pf-t--global--spacer--inset--page-chrome) - var(--pf-t--global--spacer--xs));
23313
23316
  --pf-v6-c-page__sidebar-main--MarginInlineEnd--glass: var(--pf-t--global--spacer--md);
23314
23317
  --pf-v6-c-page__sidebar-main--BackgroundColor--glass: var(--pf-v6-c-page__sidebar--BackgroundColor);
23315
23318
  --pf-v6-c-page__sidebar-main--BackdropFilter--glass: var(--pf-v6-c-page__sidebar--BackdropFilter);
@@ -23320,9 +23323,11 @@ ul.pf-v6-c-list {
23320
23323
  --pf-v6-c-page__sidebar-main--xl--MarginBlockStart--glass: 0;
23321
23324
  --pf-v6-c-page__sidebar-main--xl--MarginBlockEnd--glass: var(--pf-t--global--spacer--inset--page-chrome);
23322
23325
  --pf-v6-c-page__sidebar-main--xl--MarginInlineStart--glass: var(--pf-t--global--spacer--inset--page-chrome);
23323
- --pf-v6-c-page__sidebar-main--xl--MarginInlineEnd--glass: var(--pf-t--global--spacer--inset--page-chrome);
23324
- --pf-v6-c-page__main-container--MarginBlockStart--glass: var(--pf-t--global--spacer--inset--page-chrome);
23325
- --pf-v6-c-page__main-container--MaxHeight--glass: calc(100% - var(--pf-t--global--spacer--inset--page-chrome) * 2);
23326
+ --pf-v6-c-page__sidebar-main--xl--MarginInlineEnd--glass: var(--pf-t--global--spacer--gutter--default);
23327
+ --pf-v6-c-page__main-container--MarginBlockStart--glass: var(--pf-t--global--spacer--gutter--default);
23328
+ --pf-v6-c-page__main-container--MaxHeight--glass: calc(100% - var(--pf-t--global--spacer--inset--page-chrome) - var(--pf-t--global--spacer--gutter--default));
23329
+ --pf-v6-c-page--m-dock__main-container--MaxHeight--glass: calc(100% - var(--pf-t--global--spacer--inset--page-chrome) - var(--pf-t--global--spacer--gutter--default));
23330
+ --pf-v6-c-page--m-dock__main-container--MarginBlockStart--glass: var(--pf-t--global--spacer--gutter--default);
23326
23331
  }
23327
23332
  :where(.pf-v6-theme-glass) .pf-v6-c-page {
23328
23333
  --pf-v6-c-page--BackgroundColor: var(--pf-v6-c-page--BackgroundColor--glass);
@@ -23345,6 +23350,8 @@ ul.pf-v6-c-list {
23345
23350
  --pf-v6-c-page__sidebar-main--BoxShadow: var(--pf-v6-c-page__sidebar-main--BoxShadow--glass);
23346
23351
  --pf-v6-c-page__main-container--MarginBlockStart: var(--pf-v6-c-page__main-container--MarginBlockStart--glass);
23347
23352
  --pf-v6-c-page__main-container--MaxHeight: var(--pf-v6-c-page__main-container--MaxHeight--glass);
23353
+ --pf-v6-c-page--m-dock__main-container--MaxHeight: var(--pf-v6-c-page--m-dock__main-container--MaxHeight--glass);
23354
+ --pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-v6-c-page--m-dock__main-container--MarginBlockStart--glass);
23348
23355
  }
23349
23356
  @media (min-width: 75rem) {
23350
23357
  .pf-v6-c-page {
@@ -23496,10 +23503,11 @@ ul.pf-v6-c-list {
23496
23503
  inset-inline-start: 0;
23497
23504
  z-index: var(--pf-v6-c-page__dock--ZIndex);
23498
23505
  display: flex;
23506
+ visibility: hidden;
23499
23507
  flex-direction: column;
23500
23508
  grid-area: dock;
23501
23509
  width: var(--pf-v6-c-page__dock--Width);
23502
- transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide);
23510
+ transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide), visibility 0s var(--pf-v6-c-page__dock--TransitionDuration--slide);
23503
23511
  translate: -100% 0;
23504
23512
  }
23505
23513
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-page__dock {
@@ -23508,7 +23516,9 @@ ul.pf-v6-c-list {
23508
23516
 
23509
23517
  .pf-v6-c-page__dock.pf-m-expanded {
23510
23518
  --pf-v6-c-page__dock--TransitionDuration--slide: var(--pf-v6-c-page__dock--m-expanded--TransitionDuration--slide);
23519
+ visibility: visible;
23511
23520
  translate: 0;
23521
+ transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide), visibility 0s 0s;
23512
23522
  }
23513
23523
  @media (min-width: 62rem) {
23514
23524
  .pf-v6-c-page__dock {
@@ -23516,6 +23526,7 @@ ul.pf-v6-c-list {
23516
23526
  --pf-v6-c-page__dock-main--BorderInlineEndColor: var(--pf-v6-c-page__dock-main--desktop--BorderInlineEndColor);
23517
23527
  position: revert;
23518
23528
  inset: revert;
23529
+ visibility: revert;
23519
23530
  width: auto;
23520
23531
  translate: 0;
23521
23532
  }