@patternfly/patternfly 4.156.2 → 4.158.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/patternfly.css CHANGED
@@ -9927,6 +9927,9 @@ label.pf-c-check, .pf-c-check__label,
9927
9927
  overflow-anchor: none;
9928
9928
  }
9929
9929
 
9930
+ .pf-c-dual-list-selector__list-item:focus {
9931
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
9932
+ }
9930
9933
  .pf-c-dual-list-selector__list-item.pf-m-expandable {
9931
9934
  --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__item--m-expandable--PaddingLeft);
9932
9935
  }
@@ -9947,9 +9950,6 @@ label.pf-c-check, .pf-c-check__label,
9947
9950
  .pf-c-dual-list-selector__list-item-row:hover {
9948
9951
  --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--hover--BackgroundColor);
9949
9952
  }
9950
- .pf-c-dual-list-selector__list-item-row:focus-within {
9951
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
9952
- }
9953
9953
  .pf-c-dual-list-selector__list-item-row.pf-m-selected {
9954
9954
  --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
9955
9955
  }
@@ -9993,9 +9993,7 @@ label.pf-c-check, .pf-c-check__label,
9993
9993
  position: relative;
9994
9994
  width: 100%;
9995
9995
  padding: var(--pf-c-dual-list-selector__item--PaddingTop) var(--pf-c-dual-list-selector__item--PaddingRight) var(--pf-c-dual-list-selector__item--PaddingBottom) var(--pf-c-dual-list-selector__item--PaddingLeft);
9996
- text-align: left;
9997
9996
  cursor: pointer;
9998
- border: 0;
9999
9997
  }
10000
9998
 
10001
9999
  .pf-c-dual-list-selector__item-count {
@@ -12279,10 +12277,10 @@ label.pf-c-check, .pf-c-check__label,
12279
12277
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--200);
12280
12278
  --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-global--BorderColor--300);
12281
12279
  --pf-c-dropdown__toggle--hover--before--BorderBottomColor: var(--pf-global--active-color--100);
12282
- --pf-c-dropdown__toggle--active--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
12283
- --pf-c-dropdown__toggle--active--before--BorderBottomColor: var(--pf-global--active-color--100);
12284
12280
  --pf-c-dropdown__toggle--focus--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
12285
12281
  --pf-c-dropdown__toggle--focus--before--BorderBottomColor: var(--pf-global--active-color--100);
12282
+ --pf-c-dropdown__toggle--active--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
12283
+ --pf-c-dropdown__toggle--active--before--BorderBottomColor: var(--pf-global--active-color--100);
12286
12284
  --pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
12287
12285
  --pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor: var(--pf-global--active-color--100);
12288
12286
  --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
@@ -12296,9 +12294,22 @@ label.pf-c-check, .pf-c-check__label,
12296
12294
  --pf-c-dropdown__toggle--m-primary--BorderRadius: var(--pf-global--BorderRadius--sm);
12297
12295
  --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--100);
12298
12296
  --pf-c-dropdown__toggle--m-primary--hover--BackgroundColor: var(--pf-global--primary-color--200);
12299
- --pf-c-dropdown__toggle--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
12300
12297
  --pf-c-dropdown__toggle--m-primary--focus--BackgroundColor: var(--pf-global--primary-color--200);
12298
+ --pf-c-dropdown__toggle--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
12301
12299
  --pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--200);
12300
+ --pf-c-dropdown__toggle--m-secondary--Color: var(--pf-global--primary-color--100);
12301
+ --pf-c-dropdown__toggle--m-secondary--BorderRadius: var(--pf-global--BorderRadius--sm);
12302
+ --pf-c-dropdown__toggle--m-secondary--BackgroundColor: transparent;
12303
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--sm);
12304
+ --pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth: var(--pf-global--BorderWidth--md);
12305
+ --pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth: var(--pf-global--BorderWidth--md);
12306
+ --pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth: var(--pf-global--BorderWidth--md);
12307
+ --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
12308
+ --pf-c-dropdown__toggle--m-secondary--hover--before--BorderColor: var(--pf-global--primary-color--100);
12309
+ --pf-c-dropdown__toggle--m-secondary--focus--before--BorderColor: var(--pf-global--primary-color--100);
12310
+ --pf-c-dropdown__toggle--m-secondary--active--before--BorderColor: var(--pf-global--primary-color--100);
12311
+ --pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--md);
12312
+ --pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
12302
12313
  --pf-c-dropdown__toggle-button--Color: var(--pf-global--Color--100);
12303
12314
  --pf-c-dropdown__toggle--m-split-button--child--PaddingTop: var(--pf-global--spacer--form-element);
12304
12315
  --pf-c-dropdown__toggle--m-split-button--child--PaddingRight: var(--pf-global--spacer--xs);
@@ -12312,6 +12323,14 @@ label.pf-c-check, .pf-c-check__label,
12312
12323
  --pf-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: calc(-1 * var(--pf-global--BorderWidth--sm));
12313
12324
  --pf-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY: -0.0625rem;
12314
12325
  --pf-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft: var(--pf-global--spacer--sm);
12326
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius: var(--pf-global--BorderRadius--sm);
12327
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-global--primary-color--100);
12328
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-global--primary-color--200);
12329
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor: var(--pf-global--primary-color--200);
12330
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--active--BackgroundColor: var(--pf-global--primary-color--200);
12331
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--m-expanded--BackgroundColor: var(--pf-global--primary-color--200);
12332
+ --pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftColor: var(--pf-global--primary-color--200);
12333
+ --pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
12315
12334
  --pf-c-dropdown__toggle-icon--LineHeight: var(--pf-global--LineHeight--md);
12316
12335
  --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-global--spacer--sm);
12317
12336
  --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-global--spacer--md);
@@ -12404,6 +12423,9 @@ label.pf-c-check, .pf-c-check__label,
12404
12423
  .pf-c-dropdown.pf-m-full-height:hover .pf-c-dropdown__toggle::before {
12405
12424
  border-bottom-width: var(--pf-c-dropdown--m-full-height__toggle--hover--before--BorderBottomWidth);
12406
12425
  }
12426
+ .pf-c-dropdown.pf-m-expanded {
12427
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--m-expanded--BackgroundColor);
12428
+ }
12407
12429
 
12408
12430
  .pf-c-dropdown__toggle {
12409
12431
  position: relative;
@@ -12469,6 +12491,9 @@ label.pf-c-check, .pf-c-check__label,
12469
12491
  .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action .pf-c-dropdown__toggle-button:last-child {
12470
12492
  --pf-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: 0;
12471
12493
  }
12494
+ .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action.pf-m-primary > :not(:first-child) {
12495
+ border-left: var(--pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftWidth) solid var(--pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftColor);
12496
+ }
12472
12497
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check {
12473
12498
  display: flex;
12474
12499
  align-items: center;
@@ -12486,18 +12511,43 @@ label.pf-c-check, .pf-c-check__label,
12486
12511
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-text {
12487
12512
  margin-left: var(--pf-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft);
12488
12513
  }
12489
- .pf-c-dropdown__toggle:not(.pf-m-action):hover::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:hover::before {
12514
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) {
12515
+ --pf-c-dropdown__toggle--before--BorderWidth: 0;
12516
+ --pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth: 0;
12517
+ }
12518
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > * {
12519
+ background-color: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor);
12520
+ border: 0;
12521
+ }
12522
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
12523
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--hover--BackgroundColor);
12524
+ }
12525
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
12526
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
12527
+ }
12528
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *.pf-m-active {
12529
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
12530
+ }
12531
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :first-child {
12532
+ border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
12533
+ border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
12534
+ }
12535
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :last-child {
12536
+ border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
12537
+ border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
12538
+ }
12539
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):hover::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:hover::before {
12490
12540
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--hover--before--BorderBottomColor);
12491
12541
  }
12492
- .pf-c-dropdown__toggle:not(.pf-m-action):active::before, .pf-c-dropdown__toggle:not(.pf-m-action).pf-m-active::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:active::before {
12542
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):active::before, .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary).pf-m-active::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:active::before {
12493
12543
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--active--before--BorderBottomColor);
12494
12544
  border-bottom-width: var(--pf-c-dropdown__toggle--active--before--BorderBottomWidth);
12495
12545
  }
12496
- .pf-c-dropdown__toggle:not(.pf-m-action):focus::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:focus::before {
12546
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):focus::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:focus::before {
12497
12547
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--focus--before--BorderBottomColor);
12498
12548
  border-bottom-width: var(--pf-c-dropdown__toggle--focus--before--BorderBottomWidth);
12499
12549
  }
12500
- .pf-m-expanded > .pf-c-dropdown__toggle:not(.pf-m-action)::before, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
12550
+ .pf-m-expanded > .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary)::before, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
12501
12551
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
12502
12552
  border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
12503
12553
  }
@@ -12513,32 +12563,57 @@ label.pf-c-check, .pf-c-check__label,
12513
12563
  .pf-c-dropdown__toggle.pf-m-plain::before {
12514
12564
  border: 0;
12515
12565
  }
12516
- .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
12566
+ .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
12517
12567
  --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
12518
12568
  }
12519
12569
  .pf-c-dropdown__toggle.pf-m-plain.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-plain:disabled {
12520
12570
  --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--disabled--Color);
12521
12571
  }
12522
12572
  .pf-c-dropdown__toggle.pf-m-primary {
12523
- --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
12524
12573
  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--BackgroundColor);
12574
+ --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
12525
12575
  border-radius: var(--pf-c-dropdown__toggle--m-primary--BorderRadius);
12526
12576
  }
12577
+ .pf-c-dropdown__toggle.pf-m-primary:not(.pf-m-disabled) {
12578
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
12579
+ }
12527
12580
  .pf-c-dropdown__toggle.pf-m-primary::before {
12528
12581
  border: 0;
12529
12582
  }
12530
12583
  .pf-c-dropdown__toggle.pf-m-primary:hover {
12531
12584
  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--hover--BackgroundColor);
12532
12585
  }
12533
- .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
12534
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
12535
- }
12536
12586
  .pf-c-dropdown__toggle.pf-m-primary:focus {
12537
12587
  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--focus--BackgroundColor);
12538
12588
  }
12589
+ .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
12590
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
12591
+ }
12539
12592
  .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-primary {
12540
12593
  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor);
12541
12594
  }
12595
+ .pf-c-dropdown__toggle.pf-m-secondary {
12596
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-secondary--Color);
12597
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-secondary--BackgroundColor);
12598
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
12599
+ }
12600
+ .pf-c-dropdown__toggle.pf-m-secondary::before {
12601
+ border: var(--pf-c-dropdown__toggle--m-secondary--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--before--BorderColor);
12602
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
12603
+ }
12604
+ .pf-c-dropdown__toggle.pf-m-secondary:hover {
12605
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth);
12606
+ }
12607
+ .pf-c-dropdown__toggle.pf-m-secondary:focus {
12608
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth);
12609
+ }
12610
+ .pf-c-dropdown__toggle.pf-m-secondary:active, .pf-c-dropdown__toggle.pf-m-secondary.pf-m-active {
12611
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth);
12612
+ }
12613
+ .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-secondary {
12614
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth);
12615
+ --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor);
12616
+ }
12542
12617
  .pf-c-dropdown__toggle > .pf-c-badge {
12543
12618
  --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft);
12544
12619
  --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginRight);
@@ -15842,6 +15917,8 @@ ul.pf-c-list {
15842
15917
  --pf-c-menu--Width: auto;
15843
15918
  --pf-c-menu--ZIndex: var(--pf-global--ZIndex--sm);
15844
15919
  --pf-c-menu--m-flyout__menu--Top: calc(var(--pf-c-menu__list--PaddingTop) * -1 + var(--pf-c-menu--m-flyout__menu--top-offset));
15920
+ --pf-c-menu--m-flyout__menu--Right: auto;
15921
+ --pf-c-menu--m-flyout__menu--Bottom: auto;
15845
15922
  --pf-c-menu--m-flyout__menu--Left: calc(100% + var(--pf-c-menu--m-flyout__menu--left-offset));
15846
15923
  --pf-c-menu--m-flyout__menu--m-top--Bottom: calc(var(--pf-c-menu__list--PaddingTop) * -1);
15847
15924
  --pf-c-menu--m-flyout__menu--m-left--Right: calc(100% + var(--pf-c-menu--m-flyout__menu--m-left--right-offset));
@@ -15961,9 +16038,6 @@ ul.pf-c-list {
15961
16038
  background-color: var(--pf-c-menu--BackgroundColor);
15962
16039
  box-shadow: var(--pf-c-menu--BoxShadow);
15963
16040
  }
15964
- .pf-c-menu .pf-c-menu__content {
15965
- overflow-y: auto;
15966
- }
15967
16041
  .pf-c-menu .pf-c-menu__content .pf-c-menu .pf-c-menu__content {
15968
16042
  overflow: visible;
15969
16043
  }
@@ -15971,28 +16045,23 @@ ul.pf-c-list {
15971
16045
  margin-top: var(--pf-c-menu--c-divider--MarginTop);
15972
16046
  margin-bottom: var(--pf-c-menu--c-divider--MarginBottom);
15973
16047
  }
15974
- .pf-c-menu.pf-m-flyout {
15975
- overflow: visible;
15976
- }
15977
- .pf-c-menu.pf-m-flyout .pf-c-menu {
16048
+ .pf-c-menu .pf-c-menu.pf-m-flyout, .pf-c-menu.pf-m-flyout .pf-c-menu {
15978
16049
  position: absolute;
15979
16050
  top: var(--pf-c-menu--m-flyout__menu--Top);
15980
- right: auto;
16051
+ right: var(--pf-c-menu--m-flyout__menu--Right);
16052
+ bottom: var(--pf-c-menu--m-flyout__menu--Bottom);
15981
16053
  left: var(--pf-c-menu--m-flyout__menu--Left);
15982
16054
  }
15983
- .pf-c-menu.pf-m-flyout .pf-c-menu.pf-m-top {
15984
- top: auto;
15985
- bottom: var(--pf-c-menu--m-flyout__menu--m-top--Bottom);
15986
- }
15987
- .pf-c-menu.pf-m-flyout .pf-c-menu.pf-m-left {
15988
- right: var(--pf-c-menu--m-flyout__menu--m-left--Right);
15989
- left: auto;
15990
- }
15991
- .pf-c-menu.pf-m-flyout .pf-c-menu__content {
16055
+ .pf-c-menu .pf-c-menu.pf-m-flyout .pf-c-menu__content, .pf-c-menu.pf-m-flyout .pf-c-menu .pf-c-menu__content {
15992
16056
  overflow-y: visible;
15993
16057
  }
15994
- .pf-c-menu.pf-m-flyout .pf-c-menu__list-item {
15995
- position: relative;
16058
+ .pf-c-menu.pf-m-top {
16059
+ --pf-c-menu--m-flyout__menu--Top: auto;
16060
+ --pf-c-menu--m-flyout__menu--Bottom: var(--pf-c-menu--m-flyout__menu--m-top--Bottom);
16061
+ }
16062
+ .pf-c-menu.pf-m-left {
16063
+ --pf-c-menu--m-flyout__menu--Right: var(--pf-c-menu--m-flyout__menu--m-left--Right);
16064
+ --pf-c-menu--m-flyout__menu--Left: auto;
15996
16065
  }
15997
16066
  .pf-c-menu.pf-m-drilldown {
15998
16067
  display: flex;
@@ -16026,6 +16095,10 @@ ul.pf-c-list {
16026
16095
  overflow: hidden;
16027
16096
  transition: var(--pf-c-menu--m-drilldown__list--Transition);
16028
16097
  }
16098
+ .pf-c-menu.pf-m-drilldown .pf-c-menu__list .pf-c-menu__list {
16099
+ --pf-c-menu__list--PaddingTop: 0;
16100
+ --pf-c-menu__list--PaddingBottom: 0;
16101
+ }
16029
16102
  .pf-c-menu.pf-m-drilldown .pf-c-menu__list-item.pf-m-current-path .pf-c-menu {
16030
16103
  z-index: var(--pf-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex);
16031
16104
  }
@@ -16060,6 +16133,9 @@ ul.pf-c-list {
16060
16133
  --pf-c-menu__footer--after--BorderTopWidth: var(--pf-c-menu--m-scrollable__footer--after--BorderTopWidth);
16061
16134
  --pf-c-menu__footer--after--BorderBottomWidth: var(--pf-c-menu--m-scrollable__footer--after--BorderBottomWidth);
16062
16135
  }
16136
+ .pf-c-menu.pf-m-scrollable .pf-c-menu__content {
16137
+ overflow-y: auto;
16138
+ }
16063
16139
 
16064
16140
  .pf-c-menu__breadcrumb {
16065
16141
  display: flex;
@@ -16126,6 +16202,7 @@ ul.pf-c-list {
16126
16202
 
16127
16203
  .pf-c-menu__list-item {
16128
16204
  --pf-hidden-visible--visible--Display: var(--pf-c-menu__list-item--Display);
16205
+ position: relative;
16129
16206
  color: var(--pf-c-menu__list-item--Color);
16130
16207
  background-color: var(--pf-c-menu__list-item--BackgroundColor);
16131
16208
  }
@@ -16329,14 +16406,28 @@ ul.pf-c-list {
16329
16406
  --pf-c-menu-toggle--m-expanded--after--BorderBottomColor: var(--pf-global--active-color--100);
16330
16407
  --pf-c-menu-toggle--disabled--Color: var(--pf-global--disabled-color--100);
16331
16408
  --pf-c-menu-toggle--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
16332
- --pf-c-menu-toggle--m-primary--BorderRadius: var(--pf-global--BorderRadius--sm);
16333
16409
  --pf-c-menu-toggle--m-primary--Color: var(--pf-global--Color--light-100);
16410
+ --pf-c-menu-toggle--m-primary--BorderRadius: var(--pf-global--BorderRadius--sm);
16334
16411
  --pf-c-menu-toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--100);
16335
16412
  --pf-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-global--primary-color--200);
16336
16413
  --pf-c-menu-toggle--m-primary--focus--BackgroundColor: var(--pf-global--primary-color--200);
16337
16414
  --pf-c-menu-toggle--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
16338
16415
  --pf-c-menu-toggle--m-primary--m-expanded--BackgroundColor: var(--pf-global--primary-color--200);
16339
16416
  --pf-c-menu-toggle--m-primary--m-expanded--Color: var(--pf-global--Color--light-100);
16417
+ --pf-c-menu-toggle--m-secondary--Color: var(--pf-global--primary-color--100);
16418
+ --pf-c-menu-toggle--m-secondary--BorderRadius: var(--pf-global--BorderRadius--sm);
16419
+ --pf-c-menu-toggle--m-secondary--BackgroundColor: transparent;
16420
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--sm);
16421
+ --pf-c-menu-toggle--m-secondary--hover--before--BorderWidth: var(--pf-global--BorderWidth--md);
16422
+ --pf-c-menu-toggle--m-secondary--focus--before--BorderWidth: var(--pf-global--BorderWidth--md);
16423
+ --pf-c-menu-toggle--m-secondary--active--before--BorderWidth: var(--pf-global--BorderWidth--md);
16424
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
16425
+ --pf-c-menu-toggle--m-secondary--hover--before--BorderColor: var(--pf-global--primary-color--100);
16426
+ --pf-c-menu-toggle--m-secondary--focus--before--BorderColor: var(--pf-global--primary-color--100);
16427
+ --pf-c-menu-toggle--m-secondary--active--before--BorderColor: var(--pf-global--primary-color--100);
16428
+ --pf-c-menu-toggle--m-secondary--m-expanded--Color: var(--pf-global--primary-color--100);
16429
+ --pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
16430
+ --pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--md);
16340
16431
  --pf-c-menu-toggle--m-plain--Color: var(--pf-global--Color--200);
16341
16432
  --pf-c-menu-toggle--m-plain--PaddingRight: var(--pf-global--spacer--md);
16342
16433
  --pf-c-menu-toggle--m-plain--PaddingLeft: var(--pf-global--spacer--md);
@@ -16396,6 +16487,39 @@ ul.pf-c-list {
16396
16487
  --pf-c-menu-toggle--m-expanded--Color: var(--pf-c-menu-toggle--m-primary--m-expanded--Color);
16397
16488
  --pf-c-menu-toggle--m-expanded--BackgroundColor: var(--pf-c-menu-toggle--m-primary--m-expanded--BackgroundColor);
16398
16489
  }
16490
+ .pf-c-menu-toggle.pf-m-primary, .pf-c-menu-toggle.pf-m-primary::before {
16491
+ border-radius: var(--pf-c-menu-toggle--m-primary--BorderRadius);
16492
+ }
16493
+ .pf-c-menu-toggle.pf-m-secondary {
16494
+ --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-secondary--Color);
16495
+ --pf-c-menu-toggle--m-expanded--Color: var(--pf-c-menu-toggle--m-secondary--m-expanded--Color);
16496
+ }
16497
+ .pf-c-menu-toggle.pf-m-secondary, .pf-c-menu-toggle.pf-m-secondary::before {
16498
+ border-radius: var(--pf-c-menu-toggle--m-secondary--BorderRadius);
16499
+ }
16500
+ .pf-c-menu-toggle.pf-m-secondary::before {
16501
+ border-color: var(--pf-c-menu-toggle--m-secondary--before--BorderColor);
16502
+ border-width: var(--pf-c-menu-toggle--m-secondary--before--BorderWidth);
16503
+ }
16504
+ .pf-c-menu-toggle.pf-m-secondary::after {
16505
+ border: 0;
16506
+ }
16507
+ .pf-c-menu-toggle.pf-m-secondary:hover {
16508
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-secondary--hover--before--BorderColor);
16509
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-secondary--hover--before--BorderWidth);
16510
+ }
16511
+ .pf-c-menu-toggle.pf-m-secondary:focus {
16512
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-secondary--focus--before--BorderColor);
16513
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-secondary--focus--before--BorderWidth);
16514
+ }
16515
+ .pf-c-menu-toggle.pf-m-secondary:active {
16516
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-secondary--active--before--BorderColor);
16517
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-secondary--active--before--BorderWidth);
16518
+ }
16519
+ .pf-c-menu-toggle.pf-m-secondary.pf-m-expanded {
16520
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderColor);
16521
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderWidth);
16522
+ }
16399
16523
  .pf-c-menu-toggle.pf-m-plain:not(.pf-m-text) {
16400
16524
  --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-plain--Color);
16401
16525
  --pf-c-menu-toggle--hover--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
@@ -16896,7 +17020,6 @@ ul.pf-c-list {
16896
17020
  --pf-c-nav__item--m-flyout--focus__link--before--BorderWidth: 0;
16897
17021
  --pf-c-nav__item--m-flyout--active__link--before--BorderWidth: 0;
16898
17022
  --pf-c-nav__item--m-flyout__item--last-child__link--before--BorderBottomWidth: 0;
16899
- --pf-c-nav__item--m-flyout--c-menu--BoxShadow: var(--pf-global--BoxShadow--lg);
16900
17023
  --pf-c-nav__item--m-flyout--c-menu--Top: calc(0px + var(--pf-c-nav__item--m-flyout--c-menu--top-offset));
16901
17024
  --pf-c-nav__item--m-flyout--c-menu--c-menu--Top: calc(var(--pf-c-nav__item--m-flyout--c-menu--Top) - var(--pf-c-nav__item--before--BorderWidth));
16902
17025
  --pf-c-nav__item--m-flyout--c-menu__list-item--first-child--c-menu--Top: 0;
@@ -16905,11 +17028,10 @@ ul.pf-c-list {
16905
17028
  --pf-c-nav__item--m-flyout--c-menu--m-top--Bottom: calc(0 + var(--pf-c-nav__item--m-flyout--c-menu--m-top--bottom-offset));
16906
17029
  --pf-c-nav__item--m-flyout--c-menu--BackgroundColor: var(--pf-global--BackgroundColor--dark-300);
16907
17030
  --pf-c-nav__item--m-flyout--c-menu__item--Color: var(--pf-c-nav__link--Color);
17031
+ --pf-c-nav__item--m-flyout--c-menu__item--PaddingTop: var(--pf-global--spacer--sm);
16908
17032
  --pf-c-nav__item--m-flyout--c-menu__item--PaddingRight: var(--pf-global--spacer--lg);
17033
+ --pf-c-nav__item--m-flyout--c-menu__item--PaddingBottom: var(--pf-global--spacer--sm);
16909
17034
  --pf-c-nav__item--m-flyout--c-menu__item--PaddingLeft: var(--pf-global--spacer--lg);
16910
- --pf-c-nav__item--m-flyout--c-menu__list-item--hover--BackgroundColor: var(--pf-c-nav__link--hover--BackgroundColor);
16911
- --pf-c-nav__item--m-flyout--c-menu__list-item--focus-within--BackgroundColor: var(--pf-c-nav__link--focus--BackgroundColor);
16912
- --pf-c-nav__item--m-flyout--c-menu__list-item--active--BackgroundColor: var(--pf-c-nav__link--active--BackgroundColor);
16913
17035
  --pf-c-nav__item--m-flyout--c-menu__item-description--Color: var(--pf-global--Color--light-200);
16914
17036
  --pf-c-nav__item--m-flyout--c-menu__item--FontSize: var(--pf-global--FontSize--sm);
16915
17037
  --pf-c-nav__item--m-flyout--c-menu__item--OutlineOffset: var(--pf-c-nav__link--OutlineOffset);
@@ -16918,17 +17040,52 @@ ul.pf-c-list {
16918
17040
  --pf-c-nav__item--m-flyout--c-menu__item--hover--after--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
16919
17041
  --pf-c-nav__item--m-flyout--c-menu__item--hover--after--BorderLeftColor: var(--pf-global--BorderColor--200);
16920
17042
  --pf-c-nav__item--m-flyout--c-menu__item--hover--after--Top: calc(-1 * var(--pf-c-nav__item--m-flyout--c-menu__item--before--BorderBottomWidth));
17043
+ --pf-c-nav__item--m-flyout--c-menu__list-item--hover--BackgroundColor: var(--pf-c-nav__link--hover--BackgroundColor);
17044
+ --pf-c-nav__item--m-flyout--c-menu__list-item--focus-within--BackgroundColor: var(--pf-c-nav__link--focus--BackgroundColor);
17045
+ --pf-c-nav__item--m-flyout--c-menu__list-item--active--BackgroundColor: var(--pf-c-nav__link--active--BackgroundColor);
16921
17046
  --pf-c-nav__item--m-flyout--c-menu__list-item--first-child__item--hover--after--Top: 0;
16922
- --pf-c-nav__item--m-drilldown__subnav--PaddingTop: 0;
16923
- --pf-c-nav__item--m-drilldown__subnav--PaddingLeft: 0;
16924
- --pf-c-nav__item--m-drilldown__subnav--PaddingBottom: 0;
16925
- --pf-c-nav__item--m-drilldown__subnav--BackgroundColor: var(--pf-global--BackgroundColor--dark-300);
16926
- --pf-c-nav__item--m-drilldown__subnav--ZIndex: var(--pf-global--ZIndex--xs);
16927
- --pf-c-nav__item--m-drilldown__link--PaddingTop: var(--pf-global--spacer--md);
16928
- --pf-c-nav__item--m-drilldown__link--PaddingBottom: var(--pf-global--spacer--md);
16929
- --pf-c-nav__item--m-drilldown__link--FontSize: var(--pf-global--FontSize--md);
16930
- --pf-c-nav__item--m-drilldown--m-expanded__toggle-icon--Rotate: 0;
16931
- --pf-c-nav__item--m-drilldown--m-expanded__subnav--ZIndex: var(--pf-global--ZIndex--xs);
17047
+ --pf-c-nav__item--m-flyout--c-menu--BoxShadow: var(--pf-global--BoxShadow--lg);
17048
+ --pf-c-nav--c-menu--BackgroundColor: var(--pf-global--BackgroundColor--dark-300);
17049
+ --pf-c-nav--c-menu__list--PaddingTop: 0;
17050
+ --pf-c-nav--c-menu__list--PaddingBottom: 0;
17051
+ --pf-c-nav--c-menu__list-item--Color: var(--pf-global--Color--light-100);
17052
+ --pf-c-nav--c-menu__list-item--hover--Color: var(--pf-global--Color--light-100);
17053
+ --pf-c-nav--c-menu__list-item--active--Color: var(--pf-global--Color--light-100);
17054
+ --pf-c-nav--c-menu__list-item--focus-within--Color: var(--pf-global--Color--light-100);
17055
+ --pf-c-nav--c-menu__list-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--dark-200);
17056
+ --pf-c-nav--c-menu__list-item--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--dark-200);
17057
+ --pf-c-nav--c-menu__item--PaddingTop: var(--pf-global--spacer--md);
17058
+ --pf-c-nav--c-menu__item--PaddingRight: var(--pf-global--spacer--md);
17059
+ --pf-c-nav--c-menu__item--PaddingBottom: var(--pf-global--spacer--md);
17060
+ --pf-c-nav--c-menu__item--PaddingLeft: var(--pf-global--spacer--md);
17061
+ --pf-c-nav--c-menu__item--xl--PaddingRight: var(--pf-global--spacer--lg);
17062
+ --pf-c-nav--c-menu__item--xl--PaddingLeft: var(--pf-global--spacer--lg);
17063
+ --pf-c-nav--c-menu__item--FontSize: var(--pf-global--FontSize--sm);
17064
+ --pf-c-nav--c-menu__item--OutlineOffset: calc(var(--pf-global--spacer--xs) * -1);
17065
+ --pf-c-nav--c-menu__item--before--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
17066
+ --pf-c-nav--c-menu__item--before--BorderBottomColor: var(--pf-global--BackgroundColor--dark-200);
17067
+ --pf-c-nav--c-menu__item--after--BorderLeftWidth: 0;
17068
+ --pf-c-nav--c-menu__item--after--BorderLeftColor: transparent;
17069
+ --pf-c-nav--c-menu__item--m-current--BackgroundColor: var(--pf-global--BackgroundColor--dark-400);
17070
+ --pf-c-nav--c-menu__item--m-current--after--BorderLeftWidth: var(--pf-global--BorderWidth--xl);
17071
+ --pf-c-nav--c-menu__item--m-current--after--BorderColor: var(--pf-global--active-color--400);
17072
+ --pf-c-nav--c-menu__item-description--Color: var(--pf-global--Color--400);
17073
+ --pf-c-nav--c-menu--m-flyout--left-offset: 0.25rem;
17074
+ --pf-c-nav--c-menu--m-flyout--m-left--right-offset: 0.25rem;
17075
+ --pf-c-nav--c-menu--m-flyout--Top: 0;
17076
+ --pf-c-nav--c-menu--m-flyout--c-menu--Top: calc(var(--pf-c-nav--c-menu--m-flyout--Top) * -1);
17077
+ --pf-c-nav--c-menu--m-flyout--c-menu--Right: auto;
17078
+ --pf-c-nav--c-menu--m-flyout--c-menu--Bottom: auto;
17079
+ --pf-c-nav--c-menu--m-flyout--c-menu--Left: calc(100% - var(--pf-c-nav--c-menu--m-flyout--left-offset));
17080
+ --pf-c-nav--c-menu--m-flyout--m-left--Right: calc(100% - var(--pf-c-nav--c-menu--m-flyout--m-left--right-offset));
17081
+ --pf-c-nav--c-menu--m-flyout--m-top--Bottom: 0;
17082
+ --pf-c-nav--c-menu--m-flyout--BoxShadow: var(--pf-global--BoxShadow--lg);
17083
+ --pf-c-nav--c-menu--m-flyout__item--PaddingTop: var(--pf-global--spacer--sm);
17084
+ --pf-c-nav--c-menu--m-flyout__item--PaddingRight: var(--pf-global--spacer--lg);
17085
+ --pf-c-nav--c-menu--m-flyout__item--PaddingBottom: var(--pf-global--spacer--sm);
17086
+ --pf-c-nav--c-menu--m-flyout__item--PaddingLeft: var(--pf-global--spacer--lg);
17087
+ --pf-c-nav--c-menu--m-flyout__item--hover--after--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
17088
+ --pf-c-nav--c-menu--m-flyout__item--hover--after--BorderLeftColor: var(--pf-global--BorderColor--200);
16932
17089
  --pf-c-nav__toggle--m-start--MarginRight: var(--pf-global--spacer--sm);
16933
17090
  position: relative;
16934
17091
  }
@@ -16945,8 +17102,86 @@ ul.pf-c-list {
16945
17102
  --pf-c-nav__section-title--PaddingRight: var(--pf-c-nav__section-title--xl--PaddingRight);
16946
17103
  --pf-c-nav__section-title--PaddingLeft: var(--pf-c-nav__section-title--xl--PaddingLeft);
16947
17104
  --pf-c-nav__subnav--PaddingLeft: var(--pf-c-nav__subnav--xl--PaddingLeft);
17105
+ --pf-c-nav--c-menu__item--PaddingRight: var(--pf-c-nav--c-menu__item--xl--PaddingRight);
17106
+ --pf-c-nav--c-menu__item--PaddingLeft: var(--pf-c-nav--c-menu__item--xl--PaddingLeft);
16948
17107
  }
16949
17108
  }
17109
+ .pf-c-nav .pf-c-menu {
17110
+ --pf-c-menu--MinWidth: 100%;
17111
+ --pf-c-menu--BackgroundColor: var(--pf-c-nav--c-menu--BackgroundColor);
17112
+ --pf-c-menu__list--PaddingTop: var(--pf-c-nav--c-menu__list--PaddingTop);
17113
+ --pf-c-menu__list--PaddingBottom: var(--pf-c-nav--c-menu__list--PaddingBottom);
17114
+ --pf-c-menu__item--PaddingTop: var(--pf-c-nav--c-menu__item--PaddingTop);
17115
+ --pf-c-menu__item--PaddingRight: var(--pf-c-nav--c-menu__item--PaddingRight);
17116
+ --pf-c-menu__item--PaddingBottom: var(--pf-c-nav--c-menu__item--PaddingBottom);
17117
+ --pf-c-menu__item--PaddingLeft: var(--pf-c-nav--c-menu__item--PaddingLeft);
17118
+ --pf-c-menu__list-item--Color: var(--pf-c-nav--c-menu__list-item--Color);
17119
+ --pf-c-menu__list-item--hover--Color: var(--pf-c-nav--c-menu__list-item--hover--Color);
17120
+ --pf-c-menu__list-item--active--Color: var(--pf-c-nav--c-menu__list-item--active--Color);
17121
+ --pf-c-menu__list-item--focus-within--Color: var(--pf-c-nav--c-menu__list-item--focus-within--Color);
17122
+ --pf-c-menu__list-item--hover--BackgroundColor: var(--pf-c-nav--c-menu__list-item--hover--BackgroundColor);
17123
+ --pf-c-menu__list-item--focus-within--BackgroundColor: var(--pf-c-nav--c-menu__list-item--focus-within--BackgroundColor);
17124
+ --pf-c-menu__item-description--Color: var(--pf-c-nav--c-menu__item-description--Color);
17125
+ }
17126
+ .pf-c-nav .pf-c-menu:first-child > .pf-c-menu__content {
17127
+ border-bottom: var(--pf-c-nav--c-menu__item--before--BorderBottomWidth) solid var(--pf-c-nav--c-menu__item--before--BorderBottomColor);
17128
+ }
17129
+ .pf-c-nav .pf-c-menu.pf-m-flyout, .pf-c-nav .pf-c-menu.pf-m-flyout .pf-c-menu {
17130
+ --pf-c-menu--BoxShadow: var(--pf-c-nav--c-menu--m-flyout--BoxShadow);
17131
+ --pf-c-menu__list--PaddingTop: 0;
17132
+ --pf-c-menu__list--PaddingBottom: 0;
17133
+ --pf-c-menu__item--FontSize: var(--pf-c-nav--c-menu__item--FontSize);
17134
+ --pf-c-menu__item--Color: var(--pf-c-nav--c-menu__item--Color);
17135
+ --pf-c-menu__item--PaddingTop: var(--pf-c-nav--c-menu--m-flyout__item--PaddingTop);
17136
+ --pf-c-menu__item--PaddingRight: var(--pf-c-nav--c-menu--m-flyout__item--PaddingRight);
17137
+ --pf-c-menu__item--PaddingBottom: var(--pf-c-nav--c-menu--m-flyout__item--PaddingBottom);
17138
+ --pf-c-menu__item--PaddingLeft: var(--pf-c-nav--c-menu--m-flyout__item--PaddingLeft);
17139
+ top: var(--pf-c-nav--c-menu--m-flyout--c-menu--Top);
17140
+ right: var(--pf-c-nav--c-menu--m-flyout--c-menu--Right);
17141
+ bottom: var(--pf-c-nav--c-menu--m-flyout--c-menu--Bottom);
17142
+ left: var(--pf-c-nav--c-menu--m-flyout--c-menu--Left);
17143
+ }
17144
+ .pf-c-nav .pf-c-menu.pf-m-flyout .pf-c-menu__item:hover {
17145
+ --pf-c-nav--c-menu__item--after--BorderLeftWidth: var(--pf-c-nav--c-menu--m-flyout__item--hover--after--BorderLeftWidth);
17146
+ --pf-c-nav--c-menu__item--after--BorderLeftColor: var(--pf-c-nav--c-menu--m-flyout__item--hover--after--BorderLeftColor);
17147
+ }
17148
+ .pf-c-nav .pf-c-menu.pf-m-top {
17149
+ --pf-c-nav--c-menu--m-flyout--c-menu--Top: auto;
17150
+ --pf-c-nav--c-menu--m-flyout--c-menu--Bottom: var(--pf-c-nav--c-menu--m-flyout--m-top--Bottom);
17151
+ }
17152
+ .pf-c-nav .pf-c-menu.pf-m-left {
17153
+ --pf-c-nav--c-menu--m-flyout--c-menu--Right: var(--pf-c-nav--c-menu--m-flyout--m-left--Right);
17154
+ --pf-c-nav--c-menu--m-flyout--c-menu--Left: auto;
17155
+ }
17156
+ .pf-c-nav .pf-c-menu .pf-c-divider {
17157
+ margin-top: 0;
17158
+ margin-bottom: 0;
17159
+ }
17160
+ .pf-c-nav .pf-c-menu__item {
17161
+ position: relative;
17162
+ outline-offset: var(--pf-c-nav--c-menu__item--OutlineOffset);
17163
+ }
17164
+ .pf-c-nav .pf-c-menu__item::before, .pf-c-nav .pf-c-menu__item::after {
17165
+ position: absolute;
17166
+ top: 0;
17167
+ content: "";
17168
+ }
17169
+ .pf-c-nav .pf-c-menu__item::before {
17170
+ right: 0;
17171
+ bottom: calc(var(--pf-c-nav--c-menu__item--before--BorderBottomWidth) * -1);
17172
+ left: 0;
17173
+ border-bottom: var(--pf-c-nav--c-menu__item--before--BorderBottomWidth) solid var(--pf-c-nav--c-menu__item--before--BorderBottomColor);
17174
+ }
17175
+ .pf-c-nav .pf-c-menu__item::after {
17176
+ bottom: 0;
17177
+ left: 0;
17178
+ border-left: var(--pf-c-nav--c-menu__item--after--BorderLeftWidth) solid var(--pf-c-nav--c-menu__item--after--BorderLeftColor);
17179
+ }
17180
+ .pf-c-nav .pf-c-menu__item.pf-m-current {
17181
+ --pf-c-nav--c-menu__item--after--BorderLeftWidth: var(--pf-c-nav--c-menu__item--m-current--after--BorderLeftWidth);
17182
+ --pf-c-nav--c-menu__item--after--BorderLeftColor: var(--pf-c-nav--c-menu__item--m-current--after--BorderColor);
17183
+ background-color: var(--pf-c-nav--c-menu__item--m-current--BackgroundColor);
17184
+ }
16950
17185
  .pf-c-nav.pf-m-horizontal .pf-c-nav__link::after, .pf-c-nav.pf-m-tertiary .pf-c-nav__link::after {
16951
17186
  content: none;
16952
17187
  }
@@ -17198,9 +17433,13 @@ ul.pf-c-list {
17198
17433
  --pf-c-menu__list-item--active--BackgroundColor: var(--pf-c-nav__item--m-flyout--c-menu__list-item--active--BackgroundColor);
17199
17434
  --pf-c-menu__item--FontSize: var(--pf-c-nav__item--m-flyout--c-menu__item--FontSize);
17200
17435
  --pf-c-menu__item--Color: var(--pf-c-nav__item--m-flyout--c-menu__item--Color);
17436
+ --pf-c-menu__item--PaddingTop: var(--pf-c-nav__item--m-flyout--c-menu__item--PaddingTop);
17201
17437
  --pf-c-menu__item--PaddingRight: var(--pf-c-nav__item--m-flyout--c-menu__item--PaddingRight);
17438
+ --pf-c-menu__item--PaddingBottom: var(--pf-c-nav__item--m-flyout--c-menu__item--PaddingBottom);
17202
17439
  --pf-c-menu__item--PaddingLeft: var(--pf-c-nav__item--m-flyout--c-menu__item--PaddingLeft);
17203
17440
  --pf-c-menu__item-description--Color: var(--pf-c-nav__item--m-flyout--c-menu__item-description--Color);
17441
+ --pf-c-nav--c-menu--m-flyout--c-menu--Bottom: var(--pf-c-nav__item--m-flyout--c-menu--m-top--Bottom);
17442
+ --pf-c-nav--c-menu--m-flyout--c-menu--Right: var(--pf-c-nav__item--m-flyout--c-menu--m-left--Right);
17204
17443
  position: absolute;
17205
17444
  top: var(--pf-c-nav__item--m-flyout--c-menu--Top);
17206
17445
  left: var(--pf-c-nav__item--m-flyout--c-menu--Left);
@@ -17208,14 +17447,6 @@ ul.pf-c-list {
17208
17447
  .pf-c-nav__item.pf-m-flyout .pf-c-menu .pf-c-menu {
17209
17448
  top: var(--pf-c-nav__item--m-flyout--c-menu--c-menu--Top);
17210
17449
  }
17211
- .pf-c-nav__item.pf-m-flyout .pf-c-menu.pf-m-top {
17212
- top: auto;
17213
- bottom: var(--pf-c-nav__item--m-flyout--c-menu--m-top--Bottom);
17214
- }
17215
- .pf-c-nav__item.pf-m-flyout .pf-c-menu.pf-m-left {
17216
- right: var(--pf-c-nav__item--m-flyout--c-menu--m-left--Right);
17217
- left: auto;
17218
- }
17219
17450
  .pf-c-nav__item.pf-m-flyout .pf-c-menu .pf-c-menu__list-item:first-child {
17220
17451
  --pf-c-nav__item--m-flyout--c-menu--c-menu--Top: var(--pf-c-nav__item--m-flyout--c-menu__list-item--first-child--c-menu--Top);
17221
17452
  --pf-c-nav__item--m-flyout--c-menu__item--hover--after--Top: var(--pf-c-nav__item--m-flyout--c-menu__list-item--first-child__item--hover--after--Top);
@@ -17240,25 +17471,6 @@ ul.pf-c-list {
17240
17471
  content: "";
17241
17472
  border-left: var(--pf-c-nav__item--m-flyout--c-menu__item--hover--after--BorderLeftWidth) solid var(--pf-c-nav__item--m-flyout--c-menu__item--hover--after--BorderLeftColor);
17242
17473
  }
17243
- .pf-c-nav__item.pf-m-drilldown {
17244
- --pf-c-nav__subnav--PaddingTop: var(--pf-c-nav__item--m-drilldown__subnav--PaddingTop);
17245
- --pf-c-nav__subnav--PaddingBottom: var(--pf-c-nav__item--m-drilldown__subnav--PaddingBottom);
17246
- --pf-c-nav__subnav--PaddingLeft: var(--pf-c-nav__item--m-drilldown__subnav--PaddingLeft);
17247
- --pf-c-nav__item--m-expanded__toggle-icon--Rotate: var(--pf-c-nav__item--m-drilldown--m-expanded__toggle-icon--Rotate);
17248
- }
17249
- .pf-c-nav__item.pf-m-drilldown > .pf-c-nav__subnav {
17250
- --pf-c-nav__link--PaddingTop: var(--pf-c-nav__item--m-drilldown__link--PaddingTop);
17251
- --pf-c-nav__link--PaddingBottom: var(--pf-c-nav__item--m-drilldown__link--PaddingBottom);
17252
- --pf-c-nav__link--FontSize: var(--pf-c-nav__item--m-drilldown__link--FontSize);
17253
- --pf-c-nav__subnav--MaxHeight: 100%;
17254
- position: absolute;
17255
- top: 0;
17256
- left: 100%;
17257
- z-index: var(--pf-c-nav__item--m-drilldown__subnav--ZIndex);
17258
- width: 100%;
17259
- height: 100%;
17260
- background-color: var(--pf-c-nav__item--m-drilldown__subnav--BackgroundColor);
17261
- }
17262
17474
  .pf-c-nav__item.pf-m-drilldown.pf-m-expanded > .pf-c-nav__subnav {
17263
17475
  left: 0;
17264
17476
  z-index: var(--pf-c-nav__item--m-drilldown--m-expanded__subnav--ZIndex);