@ohu-mobile/core
Version:
95 lines • 2.03 kB
CSS
.ohu-dropmenu {
position: relative;
}
.ohu-dropmenu__inner {
background: #fff;
display: flex;
flex-flow: row nowrap;
}
.ohu-dropmenu__inner .ohu-divider::before {
top: 0.32rem;
bottom: 0.32rem;
}
.ohu-dropmenu-item {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
cursor: pointer;
-webkit-appearance: none;
-webkit-tap-highlight-color: transparent;
outline: none;
box-sizing: border-box;
flex: 1;
text-align: center;
font-size: 0.37333rem;
line-height: 1.2857142857em;
color: #333;
padding: 0.4rem;
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
background: #fff;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ohu-dropmenu-item:active {
opacity: 0.7;
}
.ohu-dropmenu-item.is-active > * {
color: #2d7eff;
}
.ohu-dropmenu-item.is-disabled {
opacity: 0.3;
}
.ohu-dropmenu-item.is-disabled .dropMenuPrefix-item:active {
opacity: 0.3;
}
.ohu-dropmenu-item__text {
line-height: 1.2;
}
.ohu-dropmenu-item__icon {
font-size: 1.2em;
color: #ccc;
margin-left: 0.32rem;
transition: transform 300ms ease;
}
.ohu-dropmenu-item__icon.is-up {
transform: rotate(180deg);
}
.ohu-dropmenu-item-options {
width: 100%;
background: #fff;
box-shadow: 0px 0.02667rem 0.10667rem 0px rgba(153, 153, 153, 0.2);
}
.ohu-dropmenu-item-option {
padding: 0.4rem;
font-size: 0.37333rem;
color: #333;
line-height: 1.2857142857em;
display: flex;
flex-flow: nowrap;
justify-content: space-between;
align-items: center;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
cursor: pointer;
-webkit-appearance: none;
-webkit-tap-highlight-color: transparent;
outline: none;
}
.ohu-dropmenu-item-option:active {
background: #F5F5F5;
}
.ohu-dropmenu-item-option.is-active {
color: #2d7eff;
}
.ohu-dropmenu-item-option.is-disabled {
opacity: 0.3;
}
.ohu-dropmenu-item-option.is-disabled:active {
background: #fff;
color: #333;
}