pqselect/pqselect.dev.css

jQuery plugin to select multiple or single options with checkboxes, radio buttons, with support for search, grouping, disabled options and jQueryUI themeRoller ready.

/*!
 * ParamQuery Select v2.0.1
 *
 * Copyright (c) 2015-2022 Paramvir Dhindsa (http://paramquery.com)
 * Released under GNU General Public License v3
 * http://paramquery.com/license
 *
 */
div.pq-select-button{
    display:inline-block;
    min-height: 16px;
    min-width: 50px;
    line-height: 20px;
    text-align: left;
    padding: 1px 3px 0px;
    cursor: pointer;
    position:relative;
    box-sizing: border-box;
    box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.1);
}
.pq-select-button .pq-icon{
    float:right;
}
.pq-select-single .pq-select-text,.pq-select-single .pq-select-item-text{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
}
.pq-select-single .pq-select-item-text{
    display:inline-block;
}
.pq-select-popup-cont{
    position:absolute;
    z-index:10000;
    overflow: visible;
    display:none;
    box-sizing: border-box;
    outline:none;
}
.pq-select-popup-cont *{
    box-sizing: border-box;
}
.pq-select-popup{
    padding: 1px;
    overflow:visible;
    box-shadow: 0px 3px 5px 1px rgba(0,0,0,0.1);
    outline:none;
    max-height: 300px;
    box-sizing: content-box;
}
.pq-select-shadow-fix{
    height:8px;
    width:120%;
    margin-left:-10%;
    position: absolute;
}
.pq-select-popup *{
    outline: none;
}
.pq-select-all{
    position: relative;
    margin-bottom: 1px;
    display:block;
    cursor: pointer;
}
.pq-select-all > .ui-icon-close{
    float:right;
}
.pq-select-search-div{
    position:relative;
    padding-left:2px;
    border:1px solid #ccc;
    margin-bottom: 1px;
}
.pq-select-search-div1{
    overflow:hidden;
}
.pq-select-search-input{
    padding: 1px 2px;
    border-width:0px;
    box-sizing: border-box;
    width: 100%;
    font-size:inherit;
}
.pq-select-search-div > .ui-icon{
    float:right;
    margin-top:2px;
}
.pq-select-search-highlight{
    text-decoration:underline;margin:0;padding:0;
}
.pq-select-menu{
    position: relative;
    -webkit-overflow-scrolling:touch;
    overflow-y: auto;
    overflow-x: hidden;
}
div.pq-select-menu .pq-select-option, div.pq-select-menu .pq-select-optgroup{
    display:block;
    min-height: 18px;
    border:1px solid transparent;
    position: relative;
}
.pq-select-option > span, .pq-select-optgroup > span{
    margin-left: 2px;
    display: inline-block;
    position: relative;
    top:50%;
    transform: translateY(-50%);
    white-space:nowrap;overflow:hidden;
}
.pq-select-optgroup > span{
    font-weight: bold;
}
.pq-select-option > input + span{
    margin-left: 20px;
}
.pq-select-search-div .glyphicon{
    margin: 2px;
}
.pq-select-option > span.pq-left-group{
    margin-left: 13px;
}
.pq-select-all > input{
    position:relative;
    top:1px;
    margin:2px 5px 0px 2px;
}
.pq-select-option > input{
    margin:0;padding:0;
    position: absolute;
    left: 2px;
    top:50%;
    transform: translateY(-50%);
}
.pq-select-search-input{
    padding: 1px 2px;
    border-width:0px;
}
.pq-select-text > .pq-select-item{
    padding:2px 0px 2px 3px;
    margin: 1px;
    line-height: 16px;
    display:inline-block;
    font-size: 100%;
    font-weight: normal;
}
.pq-select-item > .ui-icon-close{
    float: right;
}
.pq-select-popup label.pq-state-hover{
    border:1px dotted darkblue;
}
.pq-select-popup label{
    font-weight: normal;
    margin-bottom: 0;
    text-align: left;
    vertical-align: middle;
    font-size:inherit;
    white-space:normal;
}