consul/ui/packages/consul-ui/app/components/more-popover-menu/index.scss

41 lines
999 B
SCSS

.more-popover-menu {
@extend %more-popover-menu;
}
%more-popover-menu {
@extend %popover-menu;
}
/* using the inut in the selector here means it won't */
/* take on the default :checked chevron icon */
%more-popover-menu .popover-menu > [type='checkbox'] + label {
@extend %more-popover-menu-trigger;
}
/* This gives the trigger a slightly larger invisible hit area */
%more-popover-menu-trigger {
padding: 7px;
}
%more-popover-menu-trigger > * {
background-color: $transparent;
border-radius: $decor-radius-100;
width: 30px;
height: 30px;
font-size: 0;
}
%more-popover-menu-trigger > *::after {
@extend %with-more-horizontal-mask, %as-pseudo;
background-color: $gray-900;
width: 16px;
height: 16px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -8px;
margin-left: -8px;
}
%more-popover-menu-trigger > *:active {
background-color: $gray-100;
}
%more-popover-menu-trigger > *:hover,
%more-popover-menu-trigger > *:focus {
background-color: $gray-050;
}