@import “../sadui”;
// For responsive apps, .pretty-dropdown-menu will be disabled, allowing for // native option select UI. You’ll have to do this part manually.
.pretty-dropdown {
@include inline-block; @include user-select(none); position: relative; cursor: pointer; .pretty-dropdown-layer { width: 100%; padding: 0; position: relative; } .pretty-dropdown-menu { // reset &, ul, li { list-style-type: none; margin: 0; padding: 0; } position: absolute; width: 100%; left: 0; right: 0; overflow: hidden; > ul { height: 0; visibility: hidden; } > ul li { &.is-selected {} } } &.has-menu-visible .pretty-dropdown-menu > ul { height: inherit; visibility: visible; } .pretty-dropdown-label {} .pretty-dropdown-icon {} select { width: 100%; position: absolute; z-index: $zTemplate + 1; top: 0; right: 0; left: 0; @include opacity(0); background: $colorInactive;// for some reason gives layout height: 100%; line-height: 100%; background-color: transparent; } &.has-menu { select { visibility: hidden; } } .pretty-dropdown-icon-container { display: block; position: absolute; right: 0; top: 0; text-align: center; .pretty-dropdown-icon { @include hide-text; @include inline-block; margin: auto; vertical-align: middle; } } @include opacity(1); @include transition-property(opacity); @include transition-duration($transitionDurationBase / 4); @include transition-timing-function(ease-out); &.is-disabled {}
}