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