diff --git a/changes/changelog.d/2460-fallbackimg b/changes/changelog.d/2460-fallbackimg new file mode 100644 index 000000000..6fe945298 --- /dev/null +++ b/changes/changelog.d/2460-fallbackimg @@ -0,0 +1 @@ +Small sized attachments now fallback to medium sized if small doesn't exist (#2460) diff --git a/front/src/components/audio/ArtistCreditLabel.vue b/front/src/components/audio/ArtistCreditLabel.vue index f33293054..6d391a0f8 100644 --- a/front/src/components/audio/ArtistCreditLabel.vue +++ b/front/src/components/audio/ArtistCreditLabel.vue @@ -48,6 +48,7 @@ const getRoute = (ac: ArtistCredit) => { v-if="ac.artist.cover && ac.artist.cover.urls.original" v-lazy="store.getters['instance/absoluteUrl'](ac.artist.cover.urls.small_square_crop)" :alt="ac.artist.name" + @error="(e) => { e.target && ac.artist.cover ? (e.target as HTMLImageElement).src = store.getters['instance/absoluteUrl'](ac.artist.cover.urls.medium_square_crop) : null }" > props.artist.channel v-lazy="store.getters['instance/absoluteUrl'](artist.cover.urls.small_square_crop)" alt="" :class="[{circular: artist.content_category != 'podcast'}]" + @error="(e) => { e.target && artist.cover ? (e.target as HTMLImageElement).src = store.getters['instance/absoluteUrl'](artist.cover.urls.medium_square_crop) : null }" > t('components.audio.podcast.MobileRow. v-lazy="store.getters['instance/absoluteUrl'](track.album.cover.urls.small_square_crop)" alt="" class="ui artist-track mini image" + @error="(e) => { e.target && track.album.cover ? (e.target as HTMLImageElement).src = store.getters['instance/absoluteUrl'](track.album.cover.urls.medium_square_crop) : null }" > t('components.audio.track.MobileRow.bu v-lazy="store.getters['instance/absoluteUrl'](track.cover.urls.small_square_crop)" alt="" class="ui artist-track mini image" + @error="(e) => { e.target && track.cover ? (e.target as HTMLImageElement).src = store.getters['instance/absoluteUrl'](track.cover.urls.medium_square_crop) : null }" > props.websocketHandlers.includes('Listen'), (to) => { v-if="object.track.album && object.track.album.cover" v-lazy="store.getters['instance/absoluteUrl'](object.track.album.cover.urls.small_square_crop)" alt="" + @error="(e) => { e.target && object.track.album.cover ? (e.target as HTMLImageElement).src = store.getters['instance/absoluteUrl'](object.track.album.cover.urls.medium_square_crop) : null }" > ({ backgroundColor: `#${userColor.valu v-lazy="store.getters['instance/absoluteUrl'](user.avatar.urls.small_square_crop)" class="ui avatar tiny circular image" alt="" + @error="(e) => { e.target && user.avatar ? (e.target as HTMLImageElement).src = store.getters['instance/absoluteUrl'](user.avatar.urls.medium_square_crop) : null }" > ({ alt="" :src="store.getters['instance/absoluteUrl'](store.state.auth.profile?.avatar.urls.small_square_crop)" class="avatar" + @error="(e) => { e.target && store.state.auth.profile?.avatar ? (e.target as HTMLImageElement).src = store.getters['instance/absoluteUrl'](store.state.auth.profile?.avatar.urls.medium_square_crop) : null }" >