83 lines
1.7 KiB
Plaintext

@import '../common/style/var.less';
.van-dropdown-menu {
display: flex;
box-shadow: var(--dropdown-menu-box-shadow, @dropdown-menu-box-shadow);
user-select: none;
height: var(--dropdown-menu-height, @dropdown-menu-height);
background-color: var(
--dropdown-menu-background-color,
@dropdown-menu-background-color
);
&__item {
display: flex;
flex: 1;
align-items: center;
justify-content: center;
min-width: 0; // hack for flex ellipsis
&:active {
opacity: 0.7;
}
&--disabled {
&:active {
opacity: 1;
}
.van-dropdown-menu__title {
color: var(
--dropdown-menu-title-disabled-text-color,
@dropdown-menu-title-disabled-text-color
);
}
}
}
&__title {
position: relative;
box-sizing: border-box;
max-width: 100%;
padding: var(--dropdown-menu-title-padding, @dropdown-menu-title-padding);
color: var(
--dropdown-menu-title-text-color,
@dropdown-menu-title-text-color
);
font-size: var(
--dropdown-menu-title-font-size,
@dropdown-menu-title-font-size
);
line-height: var(
--dropdown-menu-title-line-height,
@dropdown-menu-title-line-height
);
&::after {
position: absolute;
top: 50%;
right: 11px;
margin-top: -5px;
border: 3px solid;
border-color: transparent transparent currentColor currentColor;
transform: rotate(-45deg);
opacity: 0.8;
content: '';
}
&--active {
color: var(
--dropdown-menu-title-active-text-color,
@dropdown-menu-title-active-text-color
);
}
&--down {
&::after {
margin-top: -1px;
transform: rotate(135deg);
}
}
}
}