MirrorMirror
/
funkwhale
mirror of https://dev.funkwhale.audio/funkwhale/funkwhale.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(front): display multi artist credits in one line in player and in queue

This commit is contained in:
ArneBo 2025-03-24 15:04:29 +01:00
parent b0d3179f18
commit f502cd25eb
2 changed files with 32 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
front/src/components/Queue.vue
View File

@ -296,30 +296,32 @@ if (!isWebGLSupported) {
</template> </template>
</h2> </h2>
<span> <span>
<template <Layout flex gap-8>
v-for="ac in currentTrack.artistCredit" <template
:key="ac.artist.id" v-for="ac in currentTrack.artistCredit"
> :key="ac.artist.id"
<router-link
:to="{name: 'library.artists.detail', params: {id: ac.artist.id }}"
@click.stop.prevent=""
> >
<Pill> <router-link
<template #image> :to="{name: 'library.artists.detail', params: {id: ac.artist.id }}"
<img @click.stop.prevent=""
v-if="ac.artist.cover" >
v-lazy="ac.artist.cover?.urls.small_square_crop" <Pill>
> <template #image>
<i <img
v-else v-if="ac.artist.cover"
class="bi bi-person-circle" v-lazy="ac.artist.cover?.urls.small_square_crop"
/> >
</template> <i
{{ ac.credit ?? t('components.Queue.meta.unknownArtist') }} v-else
</Pill> class="bi bi-person-circle"
</router-link> />
<span>{{ ac.joinphrase }}</span> </template>
</template> {{ ac.credit ?? t('components.Queue.meta.unknownArtist') }}
</Pill>
</router-link>
<span>{{ ac.joinphrase }}</span>
</template>
</Layout>
</span> </span>
<div <div
v-if="currentTrack && errored" v-if="currentTrack && errored"

9
front/src/components/audio/Player.vue
View File

@ -15,6 +15,7 @@ import TrackFavoriteIcon from '~/components/favorites/TrackFavoriteIcon.vue'
import TrackPlaylistIcon from '~/components/playlists/TrackPlaylistIcon.vue' import TrackPlaylistIcon from '~/components/playlists/TrackPlaylistIcon.vue'
import PlayerControls from './PlayerControls.vue' import PlayerControls from './PlayerControls.vue'
import VolumeControl from './VolumeControl.vue' import VolumeControl from './VolumeControl.vue'
import Layout from '~/components/ui/Layout.vue'
import Button from '~/components/ui/Button.vue' import Button from '~/components/ui/Button.vue'
const { const {
@ -230,7 +231,11 @@ const hideArtist = () => {
<strong> <strong>
{{ currentTrack.title }} {{ currentTrack.title }}
</strong> </strong>
<div class="meta"> <Layout
flex
no-gap
class="meta"
>
<div <div
v-for="ac in currentTrack.artistCredit" v-for="ac in currentTrack.artistCredit"
:key="ac.artist.id" :key="ac.artist.id"
@ -242,7 +247,7 @@ const hideArtist = () => {
<span class="middle slash symbol" /> <span class="middle slash symbol" />
{{ currentTrack.albumTitle ?? t('components.audio.Player.meta.unknownAlbum') }} {{ currentTrack.albumTitle ?? t('components.audio.Player.meta.unknownAlbum') }}
</template> </template>
</div> </Layout>
</div> </div>
</div> </div>
<div <div