style: 💄 use the new extra-actions on NcListItem
All checks were successful
repod / xml (push) Successful in 33s
repod / php (push) Successful in 1m13s
repod / nodejs (push) Successful in 1m36s
repod / release (push) Has been skipped

This commit is contained in:
Michel Roux 2024-08-07 22:05:50 +02:00
parent a6a0f0d4f8
commit c97e927a15

View File

@ -12,73 +12,69 @@
:name="episode.name" :name="episode.name"
:title="episode.description" :title="episode.description"
@click="modalEpisode = episode"> @click="modalEpisode = episode">
<template #actions> <template #extra-actions>
<NcActionButton <NcButton
v-if="!isCurrentEpisode(episode)" v-if="!isCurrentEpisode(episode)"
:aria-label="t('repod', 'Play')" :aria-label="t('repod', 'Play')"
:name="t('repod', 'Play')"
:title="t('repod', 'Play')" :title="t('repod', 'Play')"
@click="load(episode)"> @click="load(episode)">
<template #icon> <template #icon>
<PlayIcon :size="20" /> <PlayIcon :size="20" />
</template> </template>
</NcActionButton> </NcButton>
<NcActionButton <NcButton
v-if="isCurrentEpisode(episode)" v-if="isCurrentEpisode(episode)"
:aria-label="t('repod', 'Stop')" :aria-label="t('repod', 'Stop')"
:name="t('repod', 'Stop')"
:title="t('repod', 'Stop')" :title="t('repod', 'Stop')"
@click="load(null)"> @click="load(null)">
<template #icon> <template #icon>
<StopIcon :size="20" /> <StopIcon :size="20" />
</template> </template>
</NcActionButton> </NcButton>
</template> </template>
<template #extra> <template #actions>
<NcActions> <NcActionButton
<NcActionButton v-if="episode.duration && !hasEnded(episode)"
v-if="episode.duration && !hasEnded(episode)" :aria-label="t('repod', 'Mark as read')"
:aria-label="t('repod', 'Mark as read')" :disabled="loadingAction"
:disabled="loadingAction" :name="t('repod', 'Mark as read')"
:name="t('repod', 'Mark as read')" :title="t('repod', 'Mark as read')"
:title="t('repod', 'Mark as read')" @click="markAs(episode, true)">
@click="markAs(episode, true)"> <template #icon>
<template #icon> <PlaylistPlayIcon :size="20" />
<PlaylistPlayIcon :size="20" /> </template>
</template> </NcActionButton>
</NcActionButton> <NcActionButton
<NcActionButton v-if="episode.duration && hasEnded(episode)"
v-if="episode.duration && hasEnded(episode)" :aria-label="t('repod', 'Mark as unread')"
:aria-label="t('repod', 'Mark as unread')" :disabled="loadingAction"
:disabled="loadingAction" :name="t('repod', 'Mark as unread')"
:name="t('repod', 'Mark as unread')" :title="t('repod', 'Mark as unread')"
:title="t('repod', 'Mark as unread')" @click="markAs(episode, false)">
@click="markAs(episode, false)"> <template #icon>
<template #icon> <PlaylistRemoveIcon :size="20" />
<PlaylistRemoveIcon :size="20" /> </template>
</template> </NcActionButton>
</NcActionButton> <NcActionLink
<NcActionLink v-if="episode.link"
v-if="episode.link" :href="episode.link"
:href="episode.link" :name="t('repod', 'Open website')"
:name="t('repod', 'Open website')" target="_blank"
target="_blank" :title="t('repod', 'Open website')">
:title="t('repod', 'Open website')"> <template #icon>
<template #icon> <OpenInNewIcon :size="20" />
<OpenInNewIcon :size="20" /> </template>
</template> </NcActionLink>
</NcActionLink> <NcActionLink
<NcActionLink v-if="episode.url"
v-if="episode.url" :href="episode.url"
:href="episode.url" :name="t('repod', 'Download')"
:name="t('repod', 'Download')" target="_blank"
target="_blank" :title="t('repod', 'Download')">
:title="t('repod', 'Download')"> <template #icon>
<template #icon> <DownloadIcon :size="20" />
<DownloadIcon :size="20" /> </template>
</template> </NcActionLink>
</NcActionLink>
</NcActions>
</template> </template>
<template #icon> <template #icon>
<NcAvatar <NcAvatar
@ -116,8 +112,8 @@
import { import {
NcActionButton, NcActionButton,
NcActionLink, NcActionLink,
NcActions,
NcAvatar, NcAvatar,
NcButton,
NcListItem, NcListItem,
NcModal, NcModal,
NcProgressBar, NcProgressBar,
@ -149,8 +145,8 @@ export default {
Modal, Modal,
NcActionButton, NcActionButton,
NcActionLink, NcActionLink,
NcActions,
NcAvatar, NcAvatar,
NcButton,
NcListItem, NcListItem,
NcModal, NcModal,
NcProgressBar, NcProgressBar,