125 lines
2.8 KiB
CSS
125 lines
2.8 KiB
CSS
.form-select .dropdown-menu {
|
|
margin-top: 10px;
|
|
max-height: 274px;
|
|
overflow-x: hidden;
|
|
padding: 0.25rem 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.form-select .dropdown-menu-arrow {
|
|
width: 0;
|
|
height: 0;
|
|
border-width: 0 6px 6px;
|
|
border-style: solid;
|
|
border-color: transparent transparent rgba(0,0,0,.15);
|
|
position: absolute;
|
|
left: 20px;
|
|
margin-top: 4px;
|
|
z-index: 1001;
|
|
display: none;
|
|
}
|
|
|
|
.form-select .dropdown-menu-arrow:after {
|
|
content: " ";
|
|
width: 0;
|
|
height: 0;
|
|
border-width: 0 6px 6px;
|
|
border-style: solid;
|
|
border-color: transparent transparent #fff;
|
|
position: absolute;
|
|
top: 1px;
|
|
left: -6px;
|
|
}
|
|
|
|
.form-select .form-select-input[readonly] {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.form-select.show .dropdown-menu-arrow {
|
|
display: block;
|
|
}
|
|
|
|
.form-select.show .form-select-append i {
|
|
transform: rotate(0);
|
|
}
|
|
|
|
.form-select.is-disabled .form-select-input {
|
|
background-color: #f5f7fa;
|
|
border-color: #e4e7ed;
|
|
color: #c0c4cc;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.form-select-input {
|
|
color: #606266;
|
|
outline: none;
|
|
padding-right: 30px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.form-select-input:hover, .form-select-input:focus {
|
|
border-color: #c0c4cc;
|
|
}
|
|
|
|
.form-select-input:focus {
|
|
box-shadow: none;
|
|
}
|
|
|
|
.form-select-input.border-primary:hover {
|
|
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
|
|
}
|
|
|
|
.form-select-input.border-info:hover {
|
|
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(23, 162, 184, 0.5);
|
|
}
|
|
|
|
.form-select-input.border-success:hover {
|
|
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(40, 167, 69, 0.5);
|
|
}
|
|
|
|
.form-select-input.border-warning:hover {
|
|
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(255, 193, 7, 0.5);
|
|
}
|
|
|
|
.form-select-input.border-danger:hover {
|
|
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(220, 53, 69, 0.5);
|
|
}
|
|
|
|
.form-select-input.is-valid, .form-select-input.is-invalid {
|
|
background-image: none;
|
|
}
|
|
|
|
.form-select-input.is-invalid:hover {
|
|
border-color: #dc3545;
|
|
}
|
|
|
|
.form-select-input.is-invalid + .form-select-append {
|
|
color: #dc3545;
|
|
}
|
|
|
|
.form-select-input.is-valid:hover {
|
|
border-color: #28a745;
|
|
}
|
|
|
|
.form-select-input.is-valid + .form-select-append {
|
|
color: #28a745;
|
|
}
|
|
|
|
.form-select-append {
|
|
position: absolute;
|
|
height: 100%;
|
|
width: 30px;
|
|
right: 0;
|
|
top: 0;
|
|
color: #c0c4cc;
|
|
pointer-events: none;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.form-select-append i {
|
|
transition: all .3s;
|
|
transform: rotate(180deg);
|
|
}
|