@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/components/Dropdown/dropdown.css +89 -12
- package/components/Dropdown/dropdown.scss +122 -12
- package/components/DualListSelector/dual-list-selector.css +3 -5
- package/components/DualListSelector/dual-list-selector.scss +4 -6
- package/components/Menu/menu.css +21 -19
- package/components/Menu/menu.scss +29 -24
- package/components/MenuToggle/menu-toggle.css +48 -1
- package/components/MenuToggle/menu-toggle.scss +62 -1
- package/components/Nav/nav.css +129 -41
- package/components/Nav/nav.scss +164 -51
- package/docs/components/Dropdown/examples/Dropdown.css +4 -1
- package/docs/components/Dropdown/examples/Dropdown.md +251 -2
- package/docs/components/DualListSelector/examples/DualListSelector.md +359 -182
- package/docs/components/Menu/examples/Menu.css +2 -1
- package/docs/components/Menu/examples/Menu.md +123 -0
- package/docs/components/MenuToggle/examples/MenuToggle.md +79 -14
- package/docs/components/Nav/examples/Navigation.css +7 -6
- package/docs/components/Nav/examples/Navigation.md +1368 -12
- package/package.json +1 -1
- package/patternfly-no-reset.css +290 -78
- package/patternfly.css +290 -78
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
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
|
|
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:
|
|
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:
|
|
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-
|
|
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-
|
|
15995
|
-
|
|
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-
|
|
16923
|
-
--pf-c-
|
|
16924
|
-
--pf-c-
|
|
16925
|
-
--pf-c-
|
|
16926
|
-
--pf-c-
|
|
16927
|
-
--pf-c-
|
|
16928
|
-
--pf-c-
|
|
16929
|
-
--pf-c-
|
|
16930
|
-
--pf-c-
|
|
16931
|
-
--pf-c-
|
|
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);
|