Move content selections in its own component

This commit is contained in:
Chocobozzz 2019-09-23 12:07:59 +02:00
parent ddeae6bd26
commit ed0a5e5613
No known key found for this signature in database
GPG key ID: 583A612D890159BE
2 changed files with 55 additions and 33 deletions

View file

@ -0,0 +1,52 @@
<template>
<div class="root">
<div class="content-selection" v-for="contentSelection in contentSelections">
<content-selection :type="contentSelection.type" :title="contentSelection.title"
:thumbnail-url="contentSelection.thumbnailUrl" :url="contentSelection.url" :tags="contentSelection.tags"
:description="contentSelection.description"
>
</content-selection>
</div>
</div>
</template>
<style lang="scss" scoped>
@import '../scss/_variables';
.content-selections {
.content-selection {
margin-bottom: 80px;
}
.discover-instances {
display: flex;
justify-content: flex-end;
}
}
</style>
<script>
import ContentSelection from './ContentSelection'
export default {
props: {
},
components: {
ContentSelection
},
data: () => ({
contentSelections: [
{
type: 'video',
title: 'Nothing to hide',
thumbnailUrl: 'https://peertube2.cpy.re/static/thumbnails/d2a5ec78-5f85-4090-8ec5-dc1102e022ea.jpg',
url: 'https://peertube2.cpy.re/videos/watch/d2a5ec78-5f85-4090-8ec5-dc1102e022ea',
tags: ['tag', 'tag2', 'tag3'],
description: 'Nothing to Hide (2017) est un film documentaire franco-allemand de Marc Meillassoux et Mihaela Gladovic, qui s\'intéresse aux effets de la surveillance de masse sur les individus et la société. Proposant un regard critique à propos des lois sur le renseignement mises en place par de nombreux États ces dernières années, le film nous rappelle à quel point le débat sur lusage des données personnelles est actuel et questionne les fondements de nos démocraties.'
}
]
}),
}
</script>

View file

@ -34,13 +34,7 @@
<div class="border-title"></div> <div class="border-title"></div>
</div> </div>
<div class="content-selection" v-for="contentSelection in contentSelections"> <content-selections></content-selections>
<content-selection :type="contentSelection.type" :title="contentSelection.title"
:thumbnail-url="contentSelection.thumbnailUrl" :url="contentSelection.url" :tags="contentSelection.tags"
:description="contentSelection.description"
>
</content-selection>
</div>
<div class="bottom-link-wrapper"> <div class="bottom-link-wrapper">
<router-link :to="{ path: '/instances', hash: 'instances-list' }" class="bottom-link"> <router-link :to="{ path: '/instances', hash: 'instances-list' }" class="bottom-link">
@ -360,17 +354,6 @@
} }
} }
.content-selections {
.content-selection {
margin-bottom: 80px;
}
.discover-instances {
display: flex;
justify-content: flex-end;
}
}
#what-is-peertube { #what-is-peertube {
.ambition { .ambition {
display: flex; display: flex;
@ -421,29 +404,16 @@
<script> <script>
import IconInstance from '../components/icons/IconInstance.vue' import IconInstance from '../components/icons/IconInstance.vue'
import ContentSelection from '../components/ContentSelection.vue'
import IconRight from '../components/icons/IconRight.vue' import IconRight from '../components/icons/IconRight.vue'
import ContentSelections from '../components/ContentSelections'
export default { export default {
components: { components: {
ContentSelection, ContentSelections,
IconInstance, IconInstance,
IconRight IconRight
}, },
data: () => ({
contentSelections: [
{
type: 'video',
title: 'Nothing to hide',
thumbnailUrl: 'https://peertube2.cpy.re/static/thumbnails/d2a5ec78-5f85-4090-8ec5-dc1102e022ea.jpg',
url: 'https://peertube2.cpy.re/videos/watch/d2a5ec78-5f85-4090-8ec5-dc1102e022ea',
tags: ['tag', 'tag2', 'tag3'],
description: 'Nothing to Hide (2017) est un film documentaire franco-allemand de Marc Meillassoux et Mihaela Gladovic, qui s\'intéresse aux effets de la surveillance de masse sur les individus et la société. Proposant un regard critique à propos des lois sur le renseignement mises en place par de nombreux États ces dernières années, le film nous rappelle à quel point le débat sur lusage des données personnelles est actuel et questionne les fondements de nos démocraties.'
}
]
}),
metaInfo: { metaInfo: {
title: 'JoinPeerTube', title: 'JoinPeerTube',
titleTemplate: null titleTemplate: null