painless-ui
Version:
2 lines (1 loc) • 2.99 kB
CSS
.ui-select-container{max-width:300px;width:100%;display:inline-block;outline:none}.ui-select-container .dropdown{width:100%;display:inline-block;background-color:#fff;border-radius:5px;box-shadow:0 0 2px #ccc;transition:all .5s ease;position:relative;font-size:14px;color:#474747;height:100%;text-align:left}.ui-select-container .dropdown .select{cursor:pointer;display:block;padding:10px}.ui-select-container .dropdown .select.disabled{color:#a7a7a7;cursor:not-allowed}.ui-select-container .dropdown .select.non-empty.multiple{padding:2px 7px 7px}.ui-select-container .dropdown .select.non-empty>i{display:inline;font-size:13px;color:#888;cursor:pointer;transition:all .3s ease-in-out;position:absolute;right:6px;top:33%;font-style:normal}.ui-select-container .dropdown .select>i{display:none}.ui-select-container .dropdown:hover{box-shadow:0 0 4px #ccc}.ui-select-container .dropdown:active{background-color:#f8f8f8}.ui-select-container .dropdown .dropdown-menu{position:absolute;padding:0;background-color:#fff;width:100%;left:0;margin-top:1px;border-radius:0 1px 5px 5px;overflow:hidden;visibility:hidden;max-height:300px;overflow-y:auto;z-index:9;transition:all 0.5s ease-in-out}.ui-select-container .dropdown .dropdown-menu:not(.closed){box-shadow:0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)}.ui-select-container .dropdown .dropdown-menu.toggle{overflow:hidden }.ui-select-container .dropdown .dropdown-menu ul{list-style:none;padding:0;margin:0px}.ui-select-container .dropdown .dropdown-menu ul li{padding:10px;transition:all .2s ease-in-out;cursor:pointer}.ui-select-container .dropdown .dropdown-menu ul li.selected{background-color:#e2e2e2}.ui-select-container .dropdown .dropdown-menu ul li:hover{background-color:#f2f2f2}.ui-select-container .dropdown.open:hover,.ui-select-container .dropdown.open{box-shadow:0 0 4px #ccc;border-radius:5px 5px 0 0;background-color:#f8f8f8}.ui-select-container .ui-select-label{display:block;margin-bottom:10px}.ui-select-container .ui-select-multiple-select-container{max-height:70px;overflow-y:auto}.ui-select-container .ui-multi-select-wrapper{background-color:#eeeeee;display:inline-block;margin-right:5px;margin-top:5px;cursor:text}.ui-select-container .ui-multi-select-wrapper .ui-multi-select-text{padding:5px;display:inline-block}.ui-select-container .ui-multi-select-wrapper .close-btn{padding:5px;border-left:1px solid #c5c5c5;cursor:pointer}.ui-select-container .ui-select-search{text-align:center;position:relative}.ui-select-container .ui-select-search input{width:94%;min-height:27px;padding:0px 5px;margin:5px 0;border:1px solid #c5c5c5;border-radius:7px}.ui-select-container .ui-select-search input:focus{outline-width:0}.ui-select-container .ui-select-search svg,.ui-select-container .ui-select-search .search-icon{position:absolute;right:9px;width:22px;top:7px;fill:#c5c5c5;color:#c5c5c5}.ui-select-container .ui-select-search .search-icon{cursor:pointer}