blob: 81778df3b6e300022b25d4b89fbdf09b0b557e1e (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
|
// FIXME: Remove this custom implementation once a component exists upstream.
// PF overrides to fake a multiselect widget (as one does not currently exist in PF4).
// A menu gives us the interaction we want, but the styling is a bit off.
// Therefore, we're changing the visuals here locally.
// PF4 upstream request for multi-select @ https://github.com/patternfly/patternfly/issues/4027
.ct-menu-select-widget.pf-v5-c-menu {
// Divider is silly between the widgets in this context
.pf-v5-c-divider {
display: none;
+ .pf-v5-c-menu__content {
// There should be minimal space between the widgets (replacing the divider)
margin-block-start: var(--pf-v5-global--spacer--sm);
}
}
.pf-v5-c-menu__content {
// An overflow multi-select widget needs an outline
border: 1px solid var(--pf-v5-global--BorderColor--100);
}
// Search should not be inset when there's no border containing it
.pf-v5-c-menu__search {
padding: 0;
}
// Keep the background on a selected item even when it doesn't have
// focus, allowing keyboard control to have the only background color
// when active but also keep the background color when the list loses
// focus (such as when the keyboard or mouse navigates outside,
// including initial rendering of the list.
.pf-v5-c-menu__list:not(:focus-within) .pf-m-selected {
background-color: var(--pf-v5-c-menu__list-item--hover--BackgroundColor);
}
}
|