woocommerce/plugins/woocommerce-admin/client/components/dropdown-button/style.scss

74 lines
1.2 KiB
SCSS

/** @format */
.woocommerce-dropdown-button {
background-color: $white;
position: relative;
border: 1px solid $core-grey-light-500;
color: $core-grey-dark-500;
border-radius: 5px;
padding: 0 40px 0 0;
width: 100%;
&::after {
content: '';
position: absolute;
right: 14px;
top: 50%;
transform: translateY(-50%);
width: 0;
height: 0;
border-style: solid;
border-width: 6px 6px 0 6px;
border-color: $core-grey-dark-500 transparent transparent transparent;
}
&:hover,
&:active,
&.is-open {
background-color: $core-grey-light-100;
}
&.is-multi-line .woocommerce-dropdown-button__labels {
flex-direction: column;
}
}
.woocommerce-dropdown-button__labels {
text-align: left;
padding: 5px 10px;
min-height: 52px;
display: flex;
align-items: center;
width: 100%;
@include breakpoint( '<400px' ) {
min-height: 46px;
}
p {
width: 100%;
text-align: left;
&:last-child {
@include font-size( 12 );
margin: 0;
}
&:first-child {
margin: 0 0 3px 0;
@include font-size( 14 );
font-weight: 500;
}
@include breakpoint( '<400px' ) {
&:last-child {
@include font-size( 10 );
}
&:first-child {
@include font-size( 12 );
}
}
}
}