style: 💄 use the new extra-actions on NcListItem
This commit is contained in:
parent
a6a0f0d4f8
commit
c97e927a15
@ -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,
|
||||||
|
Loading…
Reference in New Issue
Block a user