tdesign-mobile-vue
Version:
tdesign-mobile-vue
51 lines (42 loc) • 920 B
text/less
@import '../../base.less';
@import './_var.less';
.@{dropdownMenu} {
position: relative;
display: flex;
background: @dropdown-menu-background;
.border(bottom);
&__item {
display: flex;
flex: 1;
align-items: center;
justify-content: center;
padding: @spacer-1 @spacer;
box-sizing: border-box;
position: relative;
overflow: hidden;
color: @dropdown-menu-color;
&--active {
color: @dropdown-menu-active-color;
}
&--disabled {
color: @dropdown-menu-disabled-color;
}
}
&__icon {
display: flex;
justify-content: center;
align-items: center;
font-size: @dropdown-menu-icon-size;
transition: transform 240ms ease;
margin-left: 4px;
&--active {
transform: rotate(180deg);
}
}
&__title {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font: @dropdown-menu-font;
}
}