owntone-server/web-src/src/components/ControlPlayerLyrics.vue
2025-02-04 22:00:48 +01:00

40 lines
666 B
Vue

<template>
<a :class="{ 'is-info': is_active }" @click="toggle">
<mdicon
class="icon"
:name="icon"
:size="16"
:title="$t('player.button.toggle-lyrics')"
/>
</a>
</template>
<script>
import { useLyricsStore } from '@/stores/lyrics'
export default {
name: 'ControlPlayerLyrics',
setup() {
return {
lyricsStore: useLyricsStore()
}
},
computed: {
icon() {
return this.is_active ? 'script-text-play' : 'script-text-outline'
},
is_active() {
return this.lyricsStore.pane
}
},
methods: {
toggle() {
this.lyricsStore.pane = !this.lyricsStore.pane
}
}
}
</script>