TeamPiped-mirror/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-08-14 23:57:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

Fix comment formatting (#267) (#297)

Browse source
This commit is contained in:
Emil Carlsson 2021-07-21 12:19:51 +02:00 committed by GitHub
parent 1dbfb14230
commit 1856f45c85
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 50 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
src/components/Comment.vue Normal file
View file

@ -0,0 +1,47 @@
<template>
<div class="comment uk-flex">
<img
:src="comment.thumbnail"
class="comment-avatar uk-border-circle uk-margin-right"
style="width: 48px; height: 48px;"
loading="lazy"
alt="Avatar"
/>
<div class="comment-content">
<div class="comment-header">
<div v-if="comment.pinned" class="comment-pinned uk-text-meta">
<font-awesome-icon icon="thumbtack"></font-awesome-icon>&nbsp; Pinned by
{{ uploader }}
</div>
<div class="comment-author">
<router-link class="uk-text-bold uk-text-small" v-bind:to="comment.commentorUrl">
{{ comment.author }} </router-link
>&thinsp;<font-awesome-icon v-if="comment.verified" icon="check"></font-awesome-icon>
</div>
<div class="comment-meta uk-text-meta uk-margin-small-bottom">
{{ comment.commentedTime }}
</div>
</div>
<div class="comment-body" style="white-space: pre-wrap">
{{ comment.commentText }}
</div>
<div class="comment-footer uk-margin-small-top uk-text-meta">
<font-awesome-icon icon="thumbs-up" style="margin-right: 4px;"></font-awesome-icon>
<span>{{ numberFormat(comment.likeCount) }}</span>
&nbsp;
<font-awesome-icon v-if="comment.hearted" icon="heart"></font-awesome-icon>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
comment: Object,
uploader: String
}
}
</script>

30
src/components/WatchVideo.vue
View file

@ -80,33 +80,7 @@
v-bind:key="comment.commentId"
v-for="comment in comments.comments"
>
<div align="left">
<div v-if="comment.pinned">
<font-awesome-icon icon="thumbtack"></font-awesome-icon>&nbsp; Pinned by
{{ video.uploader }}
</div>
<img
:src="comment.thumbnail"
style="width: 10vmin"
height="176"
width="176"
loading="lazy"
alt="avatar"
/>
<br />
<router-link class="uk-link-muted" v-bind:to="comment.commentorUrl">
{{ comment.author }} </router-link
>&thinsp;<font-awesome-icon v-if="comment.verified" icon="check"></font-awesome-icon>
</div>
<p style="white-space: pre-wrap">{{ comment.commentText }}</p>
<div>
<b>{{ numberFormat(comment.likeCount) }}</b>
&nbsp;
<font-awesome-icon icon="thumbs-up"></font-awesome-icon>
&nbsp;
<font-awesome-icon v-if="comment.hearted" icon="heart"></font-awesome-icon>
</div>
<hr />
<Comment :comment="comment" :uploader="video.uploader" />
</div>
</div>
@ -128,6 +102,7 @@
import Player from "@/components/Player.vue";
import VideoItem from "@/components/VideoItem.vue";
import ErrorHandler from "@/components/ErrorHandler.vue";
import Comment from "@/components/Comment.vue";
export default {
name: "App",
@ -269,6 +244,7 @@ export default {
Player,
VideoItem,
ErrorHandler,
Comment
},
};
</script>