Xefir/nextcloud-app-radio
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

change volume icon state

Browse Source
This commit is contained in:
Jonas Heinrich 2020-10-25 10:41:19 +01:00
parent 01271bb14d
commit a3835f4e3e
1 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/Player.vue
View File

@ -7,8 +7,9 @@
class="player" class="player"
:class="player.isPlaying ? 'pause' : 'play'" /> :class="player.isPlaying ? 'pause' : 'play'" />
</div> </div>
<div class="volumeIcon volumeFull <div
" /> class="volumeIcon"
:class="player.volume == 0 ? 'volumeMute' : 'volumeVolume'" />
<input <input
class="volume" class="volume"
type="range" type="range"
@ -106,6 +107,13 @@ export default {
mask-image: var(--icon-sound-000); mask-image: var(--icon-sound-000);
} }
.volumeMute {
background-color: #0082c9;
mask-repeat: no-repeat;
mask-size: 100%;
mask-image: var(--icon-sound-off-000);
}
.volume{ .volume{
width: 170px; width: 170px;
display: inline-block; display: inline-block;