woocommerce/packages/js/components/src/ellipsis-menu/style.scss

75 lines
1.3 KiB
SCSS

.woocommerce-ellipsis-menu {
text-align: center;
.woocommerce-ellipsis-menu__toggle {
justify-content: center;
vertical-align: middle;
width: 24px;
padding: 0;
.gridicon {
transform: rotate(90deg);
}
}
}
.woocommerce-ellipsis-menu__popover {
text-align: left;
&:not(.is-mobile)::before,
&:not(.is-mobile)::after {
margin-left: -16px;
}
.components-popover__content {
width: 182px;
padding: 2px;
}
.woocommerce-ellipsis-menu__content {
width: 100%;
.components-button {
justify-content: center;
width: 100%;
}
}
.woocommerce-ellipsis-menu__title,
.woocommerce-ellipsis-menu__item {
padding: 4px 12px;
}
.woocommerce-ellipsis-menu__item {
cursor: pointer;
color: $gray-700;
&:focus {
box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px $studio-white;
outline: 2px solid transparent;
outline-offset: -2px;
}
.components-form-toggle {
margin-right: $gap-smaller;
}
}
.components-base-control__label,
.woocommerce-ellipsis-menu__title {
color: $gray-900;
padding-top: $gap-smaller;
padding-bottom: $gap-smaller;
@include font-size( 15 );
margin-bottom: $gap-smallest;
}
.components-toggle-control .components-base-control__field {
margin: $gap-smallest 0;
}
.components-base-control {
margin: 0;
}
}