diff --git a/CHANGELOG b/CHANGELOG index 0a6e27daf..a35f15932 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -5,6 +5,7 @@ Changelog ---------------- - Front: Fixed broken ajax call on radio builder (#69) +- Front: volume slider should now have the same style everywhere (#72) 0.5 (2018-02-24) ---------------- diff --git a/front/src/components/audio/Player.vue b/front/src/components/audio/Player.vue index 5e9965158..a6cd80523 100644 --- a/front/src/components/audio/Player.vue +++ b/front/src/components/audio/Player.vue @@ -310,6 +310,54 @@ export default { cursor: pointer; display: none; } + input[type=range] { + -webkit-appearance: none; + } + input[type=range]:focus { + outline: none; + } + input[type=range]::-webkit-slider-runnable-track { + cursor: pointer; + background: white; + } + input[type=range]::-webkit-slider-thumb { + background: white; + cursor: pointer; + -webkit-appearance: none; + } + input[type=range]:focus::-webkit-slider-runnable-track { + background: #white; + } + input[type=range]::-moz-range-track { + cursor: pointer; + background: white; + } + input[type=range]::-moz-range-thumb { + background: white; + cursor: pointer; + } + input[type=range]::-ms-track { + cursor: pointer; + background: transparent; + border-color: transparent; + color: transparent; + } + input[type=range]::-ms-fill-lower { + background: white; + } + input[type=range]::-ms-fill-upper { + background: white; + } + input[type=range]::-ms-thumb { + background: white; + cursor: pointer; + } + input[type=range]:focus::-ms-fill-lower { + background: white; + } + input[type=range]:focus::-ms-fill-upper { + background: #white; + } &:hover { [type="range"] { display: block;