Contact Us
.slider{
background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/e/e3/test.svg.png");
.knob {
border-radius: 100%;
background-color: yellow;
div { display: none; }
}
.before{
background-color: blue;
}
background-color: red;
}Complete Fader SCSS example
.slider {
background: linear-gradient(red, red, yellow, green);
.before{
padding: 0px;
div{
background-color: red;
opacity: 0.5;
}
}
.knob{
align-items: center;
justify-content: center;
background-color: gray;
div{
border-radius: 100%;
width: 20px;
height: 20px;
flex-grow: 0;
background-color: green;
z-index: 1;
}
}
.after{
background-color: black;
padding: 0px;
div{
background-color: blue;
opacity: 0.5
}
}
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
}
.button{
border-top-left-radius: 0px;
border-top-right-radius: 0px;
background-color: pink;
}