Showing in album when teaser is shown as animated image.

This commit is contained in:
DebaucheryLibrarian 2025-03-05 05:04:24 +01:00
parent 20eb79bafa
commit 65edafad54
1 changed files with 11 additions and 5 deletions

View File

@ -18,7 +18,7 @@
<div <div
v-if="release.teaser?.mime?.type === 'image'" v-if="release.teaser?.mime?.type === 'image'"
class="poster-container" class="trailer"
> >
<div class="poster-link"> <div class="poster-link">
<img <img
@ -49,7 +49,7 @@
</div> </div>
<div <div
v-if="release.poster && !release.trailer && (!release.teaser || release.teaser.mime?.type === 'image')" v-else-if="release.poster"
class="poster-container" class="poster-container"
> >
<div class="poster-link"> <div class="poster-link">
@ -64,12 +64,18 @@
</div> </div>
<div <div
v-if="release.photos.length > 0 || release.caps.length > 0 || release.chapters?.some((chapter) => chapter.poster) || coversInAlbum" v-if="release.photos.length > 0 || release.caps.length > 0 || release.chapters?.some((chapter) => chapter.poster) || coversInAlbum || release.teaser?.mime.type === 'image'"
class="album" class="album"
:class="{ single: (release.photos.length + release.caps.length + (release.chapters?.filter((chapter) => chapter.poster).length || 0)) === 1 }" :class="{ single: (release.photos.length + release.caps.length + (release.chapters?.filter((chapter) => chapter.poster).length || 0)) === 1 }"
> >
<div <div
v-for="photo in [...(coversInAlbum ? release.covers : []), ...release.photos, ...release.caps, ...(release.chapters?.map((chapter) => chapter.poster).filter(Boolean) || [])]" v-for="photo in [
...(coversInAlbum ? release.covers : []),
...release.photos,
...release.caps,
...(release.chapters?.map((chapter) => chapter.poster).filter(Boolean) || []),
...(release.teaser?.mime.type === 'image' ? [release.poster] : []),
]"
:key="`photo-${photo.id}`" :key="`photo-${photo.id}`"
class="photo-container" class="photo-container"
> >
@ -206,7 +212,7 @@ const coversInAlbum = props.release.covers?.length > 0 && props.release.trailer;
height: auto; height: auto;
flex-grow: 1; flex-grow: 1;
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
gap: .25rem; gap: .25rem;
box-sizing: border-box; box-sizing: border-box;
padding: .5rem; padding: .5rem;