react-finderselect
Version:
A nice and cute select which will let the user to search inside the select options writing what he want to find
79 lines (68 loc) • 1.29 kB
CSS
/* add css module styles here (optional) */
._31K9T {
width: 100%;
}
._3xO4j {
position: relative;
width: 100%;
display: flex;
}
._17Xct {
position: relative;
width: 100%;
}
._2zRUX {
width: inherit;
position: absolute;
background-color: #f2f2f2;
z-index: 100;
padding: 0;
max-height: 300px;
overflow-y: auto;
margin-top: 0px
}
@media only screen and (max-height: 650px) {
._2zRUX {
max-height: 150px
}
}
._3jVCS {
list-style: none;
font-size: 15px;
font-weight: 600;
padding: 5px 5px 5px 15px;
cursor: copy;
overflow: hidden
}
._DN2qA {
background: #e8e8e8
}
._3jVCS:hover {
background-color: #c2c2c2;
}
._1h4ZN {
float: right;
margin: 0px 5px 0px 0px;
font-size: 15px;
color: #8b949e;
font-weight: 400;
pointer-events: none;
}
._2Yv_u {
border-top-right-radius: 0px ;
border-bottom-right-radius: 0px ;
width: 100%
}
._3j53b {
width: 1.3rem;
border-top-left-radius: 0px ;
border-bottom-left-radius: 0px ;
border-top-right-radius: 7px;
border-bottom-right-radius: 7px;
border: 1px solid;
border-color: #00000050;
background: #e8e8e8
}
._3j53b:active {
background: #c2c2c2
}