fix(front): use card template sections on library card
This commit is contained in:
parent
f4607e0d02
commit
6ee0d81976
|
@ -154,13 +154,21 @@ const isOpen = ref(false)
|
|||
<template>
|
||||
<Card
|
||||
:title="library.name"
|
||||
:to="{name: 'library.detail', params: {id: library.uuid}}"
|
||||
>
|
||||
<div class="content">
|
||||
<h4 class="header">
|
||||
<router-link :to="{name: 'library.detail', params: {id: library.uuid}}">
|
||||
{{ library.name }}
|
||||
</router-link>
|
||||
|
||||
<template #topright>
|
||||
<span
|
||||
v-if="library.privacy_level === 'me'"
|
||||
:data-tooltip="labels.tooltips.me"
|
||||
>
|
||||
<i class="bi bi-lock-fill" />
|
||||
</span>
|
||||
<span
|
||||
v-else-if="library.privacy_level === 'everyone'"
|
||||
:data-tooltip="labels.tooltips.everyone"
|
||||
>
|
||||
<i class="bi bi-globe" />
|
||||
</span>
|
||||
<Popover v-model:open="isOpen">
|
||||
<template #default="{ toggleOpen }">
|
||||
<OptionsButton
|
||||
|
@ -177,35 +185,13 @@ const isOpen = ref(false)
|
|||
</PopoverItem>
|
||||
</template>
|
||||
</Popover>
|
||||
<span
|
||||
v-if="library.privacy_level === 'me'"
|
||||
class="right floated"
|
||||
:data-tooltip="labels.tooltips.me"
|
||||
>
|
||||
<i class="bi bi-lock" />
|
||||
</span>
|
||||
<span
|
||||
v-else-if="library.privacy_level === 'everyone'"
|
||||
class="right floated"
|
||||
:data-tooltip="labels.tooltips.everyone"
|
||||
>
|
||||
<i class="bi bi-globe" />
|
||||
</span>
|
||||
</h4>
|
||||
<div class="meta">
|
||||
<span>
|
||||
<i class="bi bi-clock" />
|
||||
<human-date :date="library.creation_date" />
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="content">
|
||||
<div class="description">
|
||||
{{ library.description }}
|
||||
</div>
|
||||
<Spacer :size="8" />
|
||||
<div class="meta">
|
||||
<i class="bi bi-music-note" />
|
||||
{{ t('views.content.remote.Card.meta.tracks', library.uploads_count) }}
|
||||
</div>
|
||||
<div
|
||||
v-if="displayScan && latestScan"
|
||||
class="meta"
|
||||
|
@ -289,6 +275,20 @@ const isOpen = ref(false)
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="meta">
|
||||
<span>
|
||||
<i class="bi bi-clock" />
|
||||
<human-date :date="library.creation_date" />
|
||||
</span>
|
||||
<span>
|
||||
<i class="bi bi-music-note-list" />
|
||||
{{ t('views.content.remote.Card.meta.tracks', library.uploads_count) }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #actions>
|
||||
<div
|
||||
v-if="displayFollow || radioPlayable"
|
||||
:class="['ui', {two: displayFollow && radioPlayable}, 'bottom', 'attached', 'buttons']"
|
||||
|
@ -347,5 +347,18 @@ const isOpen = ref(false)
|
|||
</template>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.meta {
|
||||
padding-left: 8px;
|
||||
> span {
|
||||
margin-right: 16px;
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue