forked from platypush/platypush
63 lines
1.2 KiB
SCSS
63 lines
1.2 KiB
SCSS
@import 'common/mixins';
|
|
|
|
.slider {
|
|
@include appearance(none);
|
|
@include transition(opacity .2s);
|
|
width: 100%;
|
|
height: 15px;
|
|
border-radius: 5px;
|
|
background: $slider-bg;
|
|
outline: none;
|
|
|
|
// Cursed be thy name Chrome for forcing designers to this hysterical redundancy
|
|
&::-webkit-slider-thumb {
|
|
@include appearance(none);
|
|
width: 25px;
|
|
height: 25px;
|
|
border-radius: 50%;
|
|
border: 0;
|
|
background: $slider-thumb-bg;
|
|
cursor: pointer;
|
|
}
|
|
|
|
&::-moz-range-thumb {
|
|
@include appearance(none);
|
|
width: 25px;
|
|
height: 25px;
|
|
border-radius: 50%;
|
|
border: 0;
|
|
background: $slider-thumb-bg;
|
|
cursor: pointer;
|
|
}
|
|
|
|
&[disabled]::-webkit-slider-thumb {
|
|
display: none;
|
|
width: 0;
|
|
}
|
|
|
|
&[disabled]::-moz-range-thumb {
|
|
display: none;
|
|
width: 0;
|
|
}
|
|
|
|
&.disabled { opacity: 0.3; }
|
|
|
|
&::-moz-range-track {
|
|
@include appearance(none);
|
|
}
|
|
|
|
&::-moz-range-progress {
|
|
background: $slider-progress-bg;
|
|
height: 15px;
|
|
}
|
|
|
|
&[disabled]::-webkit-progress-value {
|
|
background: none;
|
|
}
|
|
|
|
&[disabled]::-moz-range-progress {
|
|
background: none;
|
|
}
|
|
}
|
|
|