61 lines
1.1 KiB
CSS
61 lines
1.1 KiB
CSS
input[type=range]{
|
|
-webkit-appearance: none;
|
|
background: none;
|
|
}
|
|
|
|
input[type=range]::-webkit-slider-runnable-track {
|
|
width: 100%;
|
|
height: 0px;
|
|
background: #ddd;
|
|
border: none;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
input[type=range]::-webkit-slider-thumb {
|
|
-webkit-appearance: none;
|
|
border: none;
|
|
height:2vh;
|
|
width: 2vh;
|
|
/* border: 5px solid #333; */
|
|
border-radius: 50%;
|
|
background: rgba(218, 218, 218, 1);
|
|
margin-top: -1vh;
|
|
}
|
|
|
|
input[type=range]:focus {
|
|
outline: none;
|
|
}
|
|
|
|
input[type=range]:focus::-webkit-slider-runnable-track {
|
|
background: #ccc;
|
|
}
|
|
/* input[type=range] {
|
|
-webkit-appearance: none;
|
|
width: 100%;
|
|
height: 25px;
|
|
background: #d3d3d3;
|
|
outline: none;
|
|
opacity: 0.7;
|
|
-webkit-transition: .2s;
|
|
transition: opacity .2s;
|
|
}
|
|
|
|
input[type=range]:hover {
|
|
opacity: 1;
|
|
}
|
|
|
|
input[type=range]::-webkit-slider-track {
|
|
-webkit-appearance: none;
|
|
width: 25px;
|
|
height: 25px;
|
|
background: rgb(212, 255, 214);
|
|
cursor: pointer;
|
|
}
|
|
|
|
input[type=range]::-webkit-slider-thumb {
|
|
-webkit-appearance: none;
|
|
width: 25px;
|
|
height: 25px;
|
|
background: #4CAF50;
|
|
cursor: pointer;
|
|
} */ |