mirror of
https://github.com/VueTubeApp/VueTube
synced 2024-11-25 04:35:17 +00:00
Community post placeholder
This commit is contained in:
parent
9fa841b6e7
commit
228c560386
6 changed files with 125 additions and 9 deletions
|
@ -22,12 +22,12 @@
|
|||
:render="render.content[Object.keys(render.content)[0]]"
|
||||
></component>
|
||||
</div>
|
||||
<!-- <div
|
||||
<div
|
||||
v-if="render.separator && render.separator.hasBottomSeparator"
|
||||
class="separator-bottom background"
|
||||
:class="$vuetify.theme.dark ? 'lighten-1' : 'darken-1'"
|
||||
:style="{ height: render.separator.height + 'px' }"
|
||||
></div> -->
|
||||
></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
|
@ -1,11 +1,23 @@
|
|||
<template>
|
||||
<div>
|
||||
<b>Description</b>
|
||||
<div class="pa-8">
|
||||
<h3 class="my-2">Description</h3>
|
||||
<p>{{ $store.state.channel.descriptionPreview }}</p>
|
||||
<br />
|
||||
<br />
|
||||
<b>Links</b>
|
||||
<h3 class="my-2">Links</h3>
|
||||
<div v-ripple class="py-2 d-flex flex-row">
|
||||
<v-avatar tile size="20" color="primary"> </v-avatar>
|
||||
<span class="ml-4 primary--text">Social Media</span>
|
||||
</div>
|
||||
<br />
|
||||
<b>More Info</b>
|
||||
<h3 class="my-2">More Info</h3>
|
||||
<div v-ripple class="py-2 d-flex flex-row">
|
||||
<v-icon size="24" color="primary">mdi-web</v-icon>
|
||||
<span class="ml-4">https://www.youtube.com/c/todo</span>
|
||||
</div>
|
||||
<div v-ripple class="py-2 d-flex flex-row">
|
||||
<v-icon size="24" color="primary">mdi-earth</v-icon>
|
||||
<span class="ml-4">United States</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="pt-4">
|
||||
<div>
|
||||
<v-list-item
|
||||
v-for="(channel, index) in $store.state.channel.featuredChannels"
|
||||
:key="index"
|
||||
|
|
|
@ -1,3 +1,89 @@
|
|||
<template>
|
||||
<div></div>
|
||||
<div>
|
||||
<!-- TODO: make this a community-post-renderer -->
|
||||
<v-card
|
||||
v-ripple
|
||||
flat
|
||||
class="background"
|
||||
:class="
|
||||
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak > 0
|
||||
? $vuetify.theme.dark
|
||||
? 'lighten-1'
|
||||
: 'darken-1'
|
||||
: ''
|
||||
"
|
||||
:style="{
|
||||
borderRadius: $store.state.tweaks.roundThumb
|
||||
? `${$store.state.tweaks.roundTweak / 2}rem`
|
||||
: '0',
|
||||
margin:
|
||||
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak > 0
|
||||
? '0 1rem 1rem 1rem'
|
||||
: '0 0 0.25rem 0',
|
||||
}"
|
||||
>
|
||||
<div class="d-flex flex-row pa-4">
|
||||
<v-avatar size="50" color="primary" />
|
||||
<div class="d-flex flex-column my-auto pl-4">
|
||||
<b>Work in progress</b>
|
||||
<div
|
||||
class="background--text"
|
||||
:class="$vuetify.theme.dark ? 'text--lighten-4' : 'text--darken-4'"
|
||||
>
|
||||
69 years ago
|
||||
</div>
|
||||
</div>
|
||||
<v-btn
|
||||
fab
|
||||
text
|
||||
elevation="0"
|
||||
style="width: 50px !important; height: 50px !important"
|
||||
@click.prevent=""
|
||||
>
|
||||
<v-icon>mdi-share-outline</v-icon>
|
||||
<div
|
||||
class="mt-2"
|
||||
style="font-size: 0.66rem"
|
||||
v-text="item.value || item.name"
|
||||
/>
|
||||
</v-btn>
|
||||
</div>
|
||||
<p class="px-4">Blurb Blurb Text Goes Here ...</p>
|
||||
<v-img
|
||||
contain
|
||||
class="background my-4"
|
||||
:class="$vuetify.theme.dark ? 'lighten-2' : 'darken-2'"
|
||||
style="max-height: 15rem"
|
||||
:style="{
|
||||
borderRadius: `${$store.state.tweaks.roundTweak / 4}rem`,
|
||||
marginLeft:
|
||||
!(
|
||||
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak
|
||||
) > 0
|
||||
? '1rem'
|
||||
: '0',
|
||||
marginRight:
|
||||
!(
|
||||
$store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak
|
||||
) > 0
|
||||
? '1rem'
|
||||
: '0',
|
||||
}"
|
||||
src="/dev.svg"
|
||||
/>
|
||||
<div class="d-flex flex-row px-4 pb-4">
|
||||
<v-icon>mdi-thumb-up-outline</v-icon>
|
||||
<b class="mx-2">123</b>
|
||||
<v-icon class="ml-2">mdi-thumb-down-outline</v-icon>
|
||||
</div>
|
||||
</v-card>
|
||||
<div
|
||||
v-if="
|
||||
!($store.state.tweaks.roundThumb && $store.state.tweaks.roundTweak > 0)
|
||||
"
|
||||
class="separator-bottom background"
|
||||
:class="$vuetify.theme.dark ? 'lighten-1' : 'darken-1'"
|
||||
style="height: 4px"
|
||||
></div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -1,3 +1,12 @@
|
|||
<template>
|
||||
<div></div>
|
||||
<div>
|
||||
<!-- <compact-video-renderer :video="$store.state.channel.videoExample" /> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CompactVideoRenderer from "../../components/CompactRenderers/compactVideoRenderer.vue";
|
||||
export default {
|
||||
components: { CompactVideoRenderer },
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -11,6 +11,7 @@ const getDefaultState = () => {
|
|||
subscribers: null,
|
||||
videosCount: null,
|
||||
featuredChannels: null,
|
||||
videoExample: null,
|
||||
};
|
||||
};
|
||||
export const state = () => {
|
||||
|
@ -55,6 +56,14 @@ export const actions = {
|
|||
);
|
||||
state.featuredChannels =
|
||||
featuredSection.shelfRenderer.content.horizontalListRenderer.items;
|
||||
console.log(
|
||||
channel.contents.singleColumnBrowseResultsRenderer.tabs[0].tabRenderer
|
||||
.content.sectionListRenderer.contents[0].shelfRenderer.content
|
||||
.verticalListRenderer.items[0].elementRenderer.newElement.type
|
||||
.componentType.model
|
||||
);
|
||||
state.videoExample =
|
||||
channel.contents.singleColumnBrowseResultsRenderer.tabs[0].tabRenderer.content.sectionListRenderer.contents[0].shelfRenderer.content.verticalListRenderer.items[0].elementRenderer.newElement.type.componentType.model.videoWithContextModel.videoWithContextData.videoData;
|
||||
})
|
||||
.catch((err) => {
|
||||
state.loading = false;
|
||||
|
|
Loading…
Reference in a new issue