Readd AdapatativeList
This commit is contained in:
parent
1eeb718a88
commit
eb680fc932
22
src/components/Atoms/AdaptativeList.vue
Normal file
22
src/components/Atoms/AdaptativeList.vue
Normal file
@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<ul :class="episode ? 'margin' : ''">
|
||||
<slot />
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'AdaptativeList',
|
||||
computed: {
|
||||
episode() {
|
||||
return this.$store.state.player.episode
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.margin {
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
</style>
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<Loading v-if="loading" />
|
||||
<ul v-if="!loading">
|
||||
<AdaptativeList v-if="!loading">
|
||||
<NcListItem v-for="feed in feeds"
|
||||
:key="feed.link"
|
||||
:details="moment(feed.fetchedAtUnix*1000).fromNow()"
|
||||
@ -16,12 +16,13 @@
|
||||
{{ feed.author }}
|
||||
</template>
|
||||
</NcListItem>
|
||||
</ul>
|
||||
</AdaptativeList>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { NcAvatar, NcListItem } from '@nextcloud/vue'
|
||||
import AdaptativeList from '../Atoms/AdaptativeList.vue'
|
||||
import Loading from '../Atoms/Loading.vue'
|
||||
import axios from '@nextcloud/axios'
|
||||
import { debounce } from '../../utils/debounce.js'
|
||||
@ -32,6 +33,7 @@ import { showError } from '@nextcloud/dialogs'
|
||||
export default {
|
||||
name: 'Search',
|
||||
components: {
|
||||
AdaptativeList,
|
||||
Loading,
|
||||
NcAvatar,
|
||||
NcListItem,
|
||||
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div :class="currentEpisode ? 'margin' : ''">
|
||||
<div>
|
||||
<Loading v-if="loading" />
|
||||
<ul v-if="!loading">
|
||||
<AdaptativeList v-if="!loading">
|
||||
<NcListItem v-for="episode in episodes"
|
||||
:key="episode.episodeGuid"
|
||||
:active="isCurrentEpisode(episode)"
|
||||
@ -33,12 +33,13 @@
|
||||
</NcActionButton>
|
||||
</template>
|
||||
</NcListItem>
|
||||
</ul>
|
||||
</AdaptativeList>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { NcActionButton, NcAvatar, NcListItem } from '@nextcloud/vue'
|
||||
import AdaptativeList from '../Atoms/AdaptativeList.vue'
|
||||
import Loading from '../Atoms/Loading.vue'
|
||||
import PlayButton from 'vue-material-design-icons/Play.vue'
|
||||
import StopButton from 'vue-material-design-icons/Stop.vue'
|
||||
@ -51,6 +52,7 @@ import { showError } from '@nextcloud/dialogs'
|
||||
export default {
|
||||
name: 'Episodes',
|
||||
components: {
|
||||
AdaptativeList,
|
||||
Loading,
|
||||
NcActionButton,
|
||||
NcAvatar,
|
||||
@ -101,8 +103,4 @@ export default {
|
||||
.ended {
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.margin {
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
</style>
|
||||
|
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<NcAppNavigation :class="currentEpisode ? 'margin' : ''">
|
||||
<NcAppNavigation>
|
||||
<NcAppContentList>
|
||||
<router-link to="/">
|
||||
<NcAppNavigationNew :text="t('Add a podcast')">
|
||||
@ -9,17 +9,18 @@
|
||||
</NcAppNavigationNew>
|
||||
</router-link>
|
||||
<Loading v-if="loading" />
|
||||
<ul v-if="!loading">
|
||||
<AdaptativeList v-if="!loading">
|
||||
<Item v-for="subscriptionUrl of subscriptions"
|
||||
:key="subscriptionUrl"
|
||||
:url="subscriptionUrl" />
|
||||
</ul>
|
||||
</AdaptativeList>
|
||||
</NcAppContentList>
|
||||
</NcAppNavigation>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { NcAppContentList, NcAppNavigation, NcAppNavigationNew } from '@nextcloud/vue'
|
||||
import AdaptativeList from '../Atoms/AdaptativeList.vue'
|
||||
import Item from './Item.vue'
|
||||
import Loading from '../Atoms/Loading.vue'
|
||||
import Plus from 'vue-material-design-icons/Plus.vue'
|
||||
@ -28,6 +29,7 @@ import { showError } from '@nextcloud/dialogs'
|
||||
export default {
|
||||
name: 'Subscriptions',
|
||||
components: {
|
||||
AdaptativeList,
|
||||
Item,
|
||||
Loading,
|
||||
NcAppContentList,
|
||||
@ -60,9 +62,3 @@ export default {
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.margin {
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user