UA-Fediland/pixelfed
2
0
Fork 0
mirror of https://github.com/pixelfed/pixelfed.git synced 2024-11-10 00:34:50 +00:00
Code Issues Projects Releases Packages Wiki Activity

Update components, add fallback default avatar

Browse source
This commit is contained in:
Daniel Supernault 2021-07-11 02:57:14 -06:00
parent 57e0a741ab
commit 726553f552
No known key found for this signature in database
GPG key ID: 0DEF1C662C9033F7
4 changed files with 15 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
resources/assets/js/components/Direct.vue
View file

@ -26,10 +26,10 @@
<div v-if="!messages.inbox.length" class="list-group-item d-flex justify-content-center align-items-center" style="min-height: 40vh;"> <div v-if="!messages.inbox.length" class="list-group-item d-flex justify-content-center align-items-center" style="min-height: 40vh;">
<p class="lead mb-0">No messages found :(</p> <p class="lead mb-0">No messages found :(</p>
</div> </div>
<div v-else v-for="(thread, index) in messages.inbox"> <div v-else v-for="(thread, index) in messages.inbox" :key="'dm_inbox'+index">
<a class="list-group-item text-dark text-decoration-none border-left-0 border-right-0 border-top-0" :href="'/account/direct/t/'+thread.id"> <a class="list-group-item text-dark text-decoration-none border-left-0 border-right-0 border-top-0" :href="'/account/direct/t/'+thread.id">
<div class="media d-flex align-items-center"> <div class="media d-flex align-items-center">
<img class="mr-3 rounded-circle img-thumbnail" :src="thread.avatar" alt="Generic placeholder image" width="32px"> <img class="mr-3 rounded-circle img-thumbnail" :src="thread.avatar" width="32" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';" v-once>
<div class="media-body"> <div class="media-body">
<p class="mb-0"> <p class="mb-0">
<span class="font-weight-bold text-truncate"> <span class="font-weight-bold text-truncate">
@ -62,10 +62,10 @@
<div v-if="!messages.sent.length" class="list-group-item d-flex justify-content-center align-items-center" style="min-height: 40vh;"> <div v-if="!messages.sent.length" class="list-group-item d-flex justify-content-center align-items-center" style="min-height: 40vh;">
<p class="lead mb-0">No messages found :(</p> <p class="lead mb-0">No messages found :(</p>
</div> </div>
<div v-else v-for="(thread, index) in messages.sent"> <div v-else v-for="(thread, index) in messages.sent" :key="'dm_sent'+index">
<a class="list-group-item text-dark text-decoration-none border-left-0 border-right-0 border-top-0" href="#" @click.prevent="loadMessage(thread.id)"> <a class="list-group-item text-dark text-decoration-none border-left-0 border-right-0 border-top-0" href="#" @click.prevent="loadMessage(thread.id)">
<div class="media d-flex align-items-center"> <div class="media d-flex align-items-center">
<img class="mr-3 rounded-circle img-thumbnail" :src="thread.avatar" alt="Generic placeholder image" width="32px"> <img class="mr-3 rounded-circle img-thumbnail" :src="thread.avatar" width="32" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';" v-once>
<div class="media-body"> <div class="media-body">
<p class="mb-0"> <p class="mb-0">
<span class="font-weight-bold text-truncate"> <span class="font-weight-bold text-truncate">
@ -98,10 +98,10 @@
<div v-if="!messages.filtered.length" class="list-group-item d-flex justify-content-center align-items-center" style="min-height: 40vh;"> <div v-if="!messages.filtered.length" class="list-group-item d-flex justify-content-center align-items-center" style="min-height: 40vh;">
<p class="lead mb-0">No messages found :(</p> <p class="lead mb-0">No messages found :(</p>
</div> </div>
<div v-else v-for="(thread, index) in messages.filtered"> <div v-else v-for="(thread, index) in messages.filtered" :key="'dm_filtered'+index">
<a class="list-group-item text-dark text-decoration-none border-left-0 border-right-0 border-top-0" href="#" @click.prevent="loadMessage(thread.id)"> <a class="list-group-item text-dark text-decoration-none border-left-0 border-right-0 border-top-0" href="#" @click.prevent="loadMessage(thread.id)">
<div class="media d-flex align-items-center"> <div class="media d-flex align-items-center">
<img class="mr-3 rounded-circle img-thumbnail" :src="thread.avatar" alt="Generic placeholder image" width="32px"> <img class="mr-3 rounded-circle img-thumbnail" :src="thread.avatar" width="32" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';" v-once>
<div class="media-body"> <div class="media-body">
<p class="mb-0"> <p class="mb-0">
<span class="font-weight-bold text-truncate"> <span class="font-weight-bold text-truncate">
@ -373,4 +373,4 @@ export default {
} }
} }
} }
</script> </script>

12
resources/assets/js/components/DirectMessage.vue
View file

@ -11,7 +11,7 @@
</span> </span>
<span> <span>
<div class="media"> <div class="media">
<img class="mr-3 rounded-circle img-thumbnail" :src="thread.avatar" alt="Generic placeholder image" width="40px"> <img class="mr-3 rounded-circle img-thumbnail" :src="thread.avatar" width="40" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';">
<div class="media-body"> <div class="media-body">
<p class="mb-0"> <p class="mb-0">
<span class="font-weight-bold">{{thread.name}}</span> <span class="font-weight-bold">{{thread.name}}</span>
@ -40,10 +40,10 @@
</li> </li>
<li v-for="(convo, index) in thread.messages" class="list-group-item border-0 chat-msg cursor-pointer" @click="openCtxMenu(convo, index)"> <li v-for="(convo, index) in thread.messages" class="list-group-item border-0 chat-msg cursor-pointer" @click="openCtxMenu(convo, index)">
<div v-if="!convo.isAuthor" class="media d-inline-flex mb-0"> <div v-if="!convo.isAuthor" class="media d-inline-flex mb-0">
<img v-if="!hideAvatars" class="mr-3 mt-2 rounded-circle img-thumbnail" :src="thread.avatar" alt="avatar" width="32px"> <img v-if="!hideAvatars" class="mr-3 mt-2 rounded-circle img-thumbnail" :src="thread.avatar" alt="avatar" width="32" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';">
<div class="media-body"> <div class="media-body">
<p v-if="convo.type == 'photo'" class="pill-to p-0 shadow"> <p v-if="convo.type == 'photo'" class="pill-to p-0 shadow">
<img :src="convo.media" width="140px" style="border-radius:20px;"> <img :src="convo.media" width="140" style="border-radius:20px;" onerror="this.onerror=null;this.src='/storage/no-preview.png';">
</p> </p>
<div v-else-if="convo.type == 'link'" class="media d-inline-flex mb-0 cursor-pointer"> <div v-else-if="convo.type == 'link'" class="media d-inline-flex mb-0 cursor-pointer">
<div class="media-body"> <div class="media-body">
@ -90,7 +90,7 @@
<div v-else class="media d-inline-flex float-right mb-0"> <div v-else class="media d-inline-flex float-right mb-0">
<div class="media-body"> <div class="media-body">
<p v-if="convo.type == 'photo'" class="pill-from p-0 shadow"> <p v-if="convo.type == 'photo'" class="pill-from p-0 shadow">
<img :src="convo.media" width="140px" style="border-radius:20px;"> <img :src="convo.media" width="140" style="border-radius:20px;" onerror="this.onerror=null;this.src='/storage/no-preview.png';">
</p> </p>
<div v-else-if="convo.type == 'link'" class="media d-inline-flex float-right mb-0 cursor-pointer"> <div v-else-if="convo.type == 'link'" class="media d-inline-flex float-right mb-0 cursor-pointer">
<div class="media-body"> <div class="media-body">
@ -134,7 +134,7 @@
</p> </p>
<p v-else>&nbsp;</p> <p v-else>&nbsp;</p>
</div> </div>
<img v-if="!hideAvatars" class="ml-3 mt-2 rounded-circle img-thumbnail" :src="profile.avatar" alt="avatar" width="32px"> <img v-if="!hideAvatars" class="ml-3 mt-2 rounded-circle img-thumbnail" :src="profile.avatar" alt="avatar" width="32" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';">
</div> </div>
</li> </li>
@ -682,4 +682,4 @@
} }
} }
} }
</script> </script>

2
resources/assets/js/components/PostComponent.vue
View file

@ -466,7 +466,7 @@
<div class="list-group-item border-0 py-1" v-for="(user, index) in likes" :key="'modal_likes_'+index"> <div class="list-group-item border-0 py-1" v-for="(user, index) in likes" :key="'modal_likes_'+index">
<div class="media"> <div class="media">
<a :href="user.url"> <a :href="user.url">
<img class="mr-3 rounded-circle box-shadow" :src="user.avatar" :alt="user.username + '’s avatar'" width="30px"> <img class="mr-3 rounded-circle box-shadow" :src="user.avatar" :alt="user.username + '’s avatar'" width="30px" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';">
</a> </a>
<div class="media-body"> <div class="media-body">
<p class="mb-0" style="font-size: 14px"> <p class="mb-0" style="font-size: 14px">

1
resources/assets/js/components/Timeline.vue
View file

@ -104,6 +104,7 @@
</div> </div>
<status-card <status-card
:class="{ 'border-top': index === 0 }"
:status="status" :status="status"
:reaction-bar="reactionBar" :reaction-bar="reactionBar"
v-on:status-delete="deleteStatus" v-on:status-delete="deleteStatus"