From 8837c1c9fe6bf4ae981a05933c0d274f9168ca58 Mon Sep 17 00:00:00 2001 From: Dragos <86549690+dragos-efy@users.noreply.github.com> Date: Tue, 8 Nov 2022 18:52:28 +0200 Subject: [PATCH] Update WatchVideo.vue --- src/components/WatchVideo.vue | 27 +++++++++++++++------------ 1 file changed, 15 insertions(+), 12 deletions(-) diff --git a/src/components/WatchVideo.vue b/src/components/WatchVideo.vue index c71bad55..43b332f4 100644 --- a/src/components/WatchVideo.vue +++ b/src/components/WatchVideo.vue @@ -39,7 +39,7 @@ <div class="pp-video-title font-bold mt-2 text-2xl break-words" v-text="video.title" /> <div class="pp-bellow-video flex flex-wrap mt-3 mb-3"> <!-- views / date --> - <div class="flex flex-auto children:ml-2"> + <div class="flex flex-auto"> <span v-t="{ path: 'video.views', args: { views: addCommas(video.views) } }" /> <span> • </span> <span v-text="uploadDate" /> @@ -133,6 +133,8 @@ <div efy_select> <input id="showDesc" type="checkbox" v-model="showDesc" /> <label for="showDesc" v-t="'actions.show_description'" /> + <input id="showComments" type="checkbox" v-model="showComments" @click="toggleComments" /> + <label for="showComments" v-t="'actions.show_comments'" /> <input id="showRecs" type="checkbox" v-model="showRecs" /> <label for="showRecs" v-t="'actions.show_recommendations'" /> <input id="chkAutoLoop" v-model="selectedAutoLoop" type="checkbox" @change="onChange($event)" /> @@ -146,35 +148,36 @@ </div> <!-- eslint-disable-next-line vue/no-v-html --> - <div v-show="showDesc" class="break-words mb-2" v-html="purifyHTML(video.description)" /> + <div + v-show="showDesc" + class="break-words mb-2" + v-html="purifyHTML(video.description)" + style="border-top: var(--efy_border); margin: 15rem 0; padding: 15rem 0" + /> <div v-if="showDesc && sponsors && sponsors.segments" v-text="`${$t('video.sponsor_segments')}: ${sponsors.segments.length}`" /> </div> + <hr /> + <div class="grid pp-rec-vids"> - <div class="xl:col-span-4 sm:col-span-3"> - <button - class="btn mb-2" - @click="toggleComments" - v-t="`actions.${showComments ? 'minimize_comments' : 'show_comments'}`" - /> - </div> <div v-if="!showComments" class="w-full"></div> - <div v-else-if="!comments" class=""> + <div v-if="!comments" class=""> <p class="text-center mt-8" v-t="'comment.loading'"></p> </div> <div v-else-if="comments.disabled" class=""> <p class="text-center mt-8" v-t="'comment.disabled'"></p> </div> - <div v-else ref="comments" v-show="showComments" class=""> + <div v-else ref="comments" v-show="showComments" class="pp-comments"> <CommentItem v-for="comment in comments.comments" :key="comment.commentId" :comment="comment" :uploader="video.uploader" :video-id="getVideoId()" + class="efy_trans_filter" /> </div> @@ -185,8 +188,8 @@ :playlist="playlist" :selected-index="index" /> - <hr v-show="showRecs" /> <div v-show="showRecs" class="pp-show-recs"> + <h6 efy_card style="padding: 5rem 10rem 3rem; margin: 0">Recommended</h6> <ContentItem v-for="related in video.relatedStreams" :key="related.url"