Replace computed with watcher; move css class definitions to app.css

This commit is contained in:
Brandon A 2025-11-01 18:35:47 +00:00
parent 13845a43d6
commit e49e8ce8bc
2 changed files with 17 additions and 17 deletions

View File

@ -250,3 +250,12 @@ Bookshelf Label
.abs-btn:disabled::before {
background-color: rgba(0, 0, 0, 0.2);
}
/* Padding for toastification toasts on the bottom to not cover media player*/
.media-player .Vue-Toastification__toast.toast-mb-40 {
margin-bottom: calc(var(--spacing) * 40);
}
.media-player .Vue-Toastification__toast.toast-mb-48 {
margin-bottom: calc(var(--spacing) * 48);
}

View File

@ -7,7 +7,7 @@
<Nuxt :key="currentLang" />
</div>
<app-media-player-container ref="mediaPlayerContainer" :class="{ 'media-player': isShowingMediaPlayer }" />
<app-media-player-container ref="mediaPlayerContainer" />
<modals-item-edit-modal />
<modals-collections-add-create-modal />
@ -49,6 +49,13 @@ export default {
this.$store.commit('globals/resetSelectedMediaItems', [])
this.updateBodyClass()
},
'$store.state.streamLibraryItem'(newVal) {
if (newVal) {
document.body.classList.add('media-player')
} else {
document.body.classList.remove('media-player')
}
}
},
computed: {
@ -70,14 +77,6 @@ export default {
},
appContentMarginLeft() {
return this.isShowingSideRail ? 80 : 0
},
isShowingMediaPlayer() {
if (this.$store.state.streamLibraryItem) {
document.body.classList.add('media-player')
} else {
document.body.classList.remove('media-player')
}
return this.$store.state.streamLibraryItem
}
},
methods: {
@ -659,14 +658,6 @@ export default {
font-size: 14px;
}
.media-player .Vue-Toastification__toast.toast-mb-40 {
margin-bottom: calc(var(--spacing) * 40);
}
.media-player .Vue-Toastification__toast.toast-mb-48 {
margin-bottom: calc(var(--spacing) * 48);
}
#app-content {
width: 100%;
}