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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
|
@use '../../sass-utilities' as *;
@include pf-root($overflow-menu) {
--#{$overflow-menu}--ColumnGap: var(--pf-t--global--spacer--md);
// * Overflow menu group
--#{$overflow-menu}__group--ColumnGap: var(--pf-t--global--spacer--md);
// * Overflow menu button group
--#{$overflow-menu}__group--m-button-group--ColumnGap: var(--pf-t--global--spacer--sm);
// * Overflow menu icon button group
--#{$overflow-menu}__group--m-icon-button-group--ColumnGap: var(--pf-t--global--spacer--xs);
}
// - Overflow menu
.#{$overflow-menu} {
display: inline-flex;
column-gap: var(--#{$overflow-menu}--ColumnGap);
}
// - Overflow menu content - Overflow menu group
.#{$overflow-menu}__content,
.#{$overflow-menu}__group {
display: flex;
align-items: start;
}
// - Overflow menu group
.#{$overflow-menu}__group {
column-gap: var(--#{$overflow-menu}__group--ColumnGap);
// - Overflow menu button group
&.pf-m-button-group {
column-gap: var(--#{$overflow-menu}__group--m-button-group--ColumnGap);
}
// - Overflow menu icon button group
&.pf-m-icon-button-group {
column-gap: var(--#{$overflow-menu}__group--m-icon-button-group--ColumnGap);
}
}
// - Oveflow menu item
.#{$overflow-menu}__item {
column-gap: var(--#{$overflow-menu}__item--ColumnGap, var(--#{$overflow-menu}--ColumnGap));
}
// - Overflow menu content - Overflow menu control
.#{$overflow-menu}__content,
.#{$overflow-menu}__control {
column-gap: var(--#{$overflow-menu}--ColumnGap);
}
|
