Skip to content

Instantly share code, notes, and snippets.

@dislokacia
Created October 24, 2022 11:03
Show Gist options
  • Save dislokacia/8a54d16101258432d21d979c46ea099f to your computer and use it in GitHub Desktop.
Save dislokacia/8a54d16101258432d21d979c46ea099f to your computer and use it in GitHub Desktop.
JetFB select2 as on the tutorial
.jet-form-builder .select2-container--default .select2-selection--single {
height: 50px!important;
padding: 10px!important;
}
.jet-form-builder .select2-container--default .select2-selection--single .select2-selection__arrow {
top: 25%;
}
.jet-form-builder .select2-container--default .select2-selection--single .select2-selection__arrow:after {
content: "";
position: absolute;
top: 50%;
right: 16px;
display: block;
width: 5px;
height: 1px;
transition: all 0.3s ease-out;
background-color: rgb(77, 93, 109);
transform: translate(3px, -50%) rotate(-45deg);
}
.jet-form-builder .select2-container--default .select2-selection--single .select2-selection__arrow:before {
content: "";
position: absolute;
top: 50%;
right: 13px;
display: block;
width: 5px;
height: 1px;
transition: all 0.3s ease-out;
background-color: rgb(77, 93, 109);
transform: translate(-3px, -50%) rotate(45deg);
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
visibility: hidden;
}
.select2-results__option {
padding-left: 20px!important;
margin-bottom: 0!important;
border-bottom: 1px solid #dddddd8c;
}
.select2-dropdown.select2-dropdown--below {
top: -18px!important;
border-top-left-radius: 6px!important;
border-top-right-radius: 6px!important;
border: none!important;
}
.select2-search--dropdown {
padding: 0!important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
color: inherit!important;
}
.select2-results__options::-webkit-scrollbar {
width: 6px;
}
/* Track */
.select2-results__options::-webkit-scrollbar-track {
background: #f1f1f1;
}
/* Handle */
.select2-results__options::-webkit-scrollbar-thumb {
background: #888;
border-radius: 5px;
}
/* Handle on hover */
.select2-results__options::-webkit-scrollbar-thumb:hover {
background: #555;
}
.select2-search--dropdown .select2-search__field {
padding-left: 20px!important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment