mirror/pixelfed
1
0
Fork 1
mirror of https://github.com/pixelfed/pixelfed.git synced 2024-12-24 16:53:17 +00:00
Code Issues Releases Wiki Activity

Update Timeline.vue

Browse source
This commit is contained in:
Daniel Supernault 2019-05-08 21:19:08 -06:00
parent e66d4286a6
commit b4e18ec9e1
No known key found for this signature in database
GPG key ID: 0DEF1C662C9033F7
1 changed files with 18 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1,7 +1,7 @@
<template> <template>
<div class="container" style=""> <div class="container" style="">
<div class="row"> <div class="row">
<div class="col-md-8 col-lg-8 pt-sm-2 px-0 my-sm-3 timeline order-2 order-md-1"> <div :class="[modes.distractionFree ? 'col-md-8 col-lg-8 offset-md-2 pt-sm-2 px-0 my-sm-3 timeline order-2 order-md-1':'col-md-8 col-lg-8 pt-sm-2 px-0 my-sm-3 timeline order-2 order-md-1']">
<div style="padding-top:10px;"> <div style="padding-top:10px;">
<div v-if="loading" class="text-center"> <div v-if="loading" class="text-center">
<div class="spinner-border" role="status"> <div class="spinner-border" role="status">
@ -40,7 +40,7 @@
</div> </div>
</div> </div>
<div class="card mb-sm-4 status-card card-md-rounded-0"> <div class="card mb-sm-4 status-card card-md-rounded-0">
<div class="card-header d-inline-flex align-items-center bg-white"> <div v-if="!modes.distractionFree" class="card-header d-inline-flex align-items-center bg-white">
<img v-bind:src="status.account.avatar" width="32px" height="32px" style="border-radius: 32px;"> <img v-bind:src="status.account.avatar" width="32px" height="32px" style="border-radius: 32px;">
<a class="username font-weight-bold pl-2 text-dark" v-bind:href="status.account.url"> <a class="username font-weight-bold pl-2 text-dark" v-bind:href="status.account.url">
{{status.account.username}} {{status.account.username}}
@ -114,13 +114,13 @@
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="reactions my-1"> <div v-if="!modes.distractionFree" class="reactions my-1">
<h3 v-bind:class="[status.favourited ? 'fas fa-heart text-danger pr-3 m-0 cursor-pointer' : 'far fa-heart pr-3 m-0 like-btn cursor-pointer']" title="Like" v-on:click="likeStatus(status, $event)"></h3> <h3 v-bind:class="[status.favourited ? 'fas fa-heart text-danger pr-3 m-0 cursor-pointer' : 'far fa-heart pr-3 m-0 like-btn cursor-pointer']" title="Like" v-on:click="likeStatus(status, $event)"></h3>
<h3 v-if="!status.comments_disabled" class="far fa-comment pr-3 m-0 cursor-pointer" title="Comment" v-on:click="commentFocus(status, $event)"></h3> <h3 v-if="!status.comments_disabled" class="far fa-comment pr-3 m-0 cursor-pointer" title="Comment" v-on:click="commentFocus(status, $event)"></h3>
<h3 v-bind:class="[status.reblogged ? 'far fa-share-square pr-3 m-0 text-primary cursor-pointer' : 'far fa-share-square pr-3 m-0 share-btn cursor-pointer']" title="Share" v-on:click="shareStatus(status, $event)"></h3> <h3 v-bind:class="[status.reblogged ? 'far fa-share-square pr-3 m-0 text-primary cursor-pointer' : 'far fa-share-square pr-3 m-0 share-btn cursor-pointer']" title="Share" v-on:click="shareStatus(status, $event)"></h3>
</div> </div>
<div class="likes font-weight-bold" v-if="expLc(status) == true"> <div class="likes font-weight-bold" v-if="expLc(status) == true && !modes.distractionFree">
<span class="like-count">{{status.favourites_count}}</span> {{status.favourites_count == 1 ? 'like' : 'likes'}} <span class="like-count">{{status.favourites_count}}</span> {{status.favourites_count == 1 ? 'like' : 'likes'}}
</div> </div>
<div class="caption"> <div class="caption">
@ -148,6 +148,9 @@
<a :href="status.url" class="text-muted"> <a :href="status.url" class="text-muted">
<timeago :datetime="status.created_at" :auto-update="60" :converter-options="{includeSeconds:true}" :title="timestampFormat(status.created_at)" v-b-tooltip.hover.bottom></timeago> <timeago :datetime="status.created_at" :auto-update="60" :converter-options="{includeSeconds:true}" :title="timestampFormat(status.created_at)" v-b-tooltip.hover.bottom></timeago>
</a> </a>
<a v-if="modes.distractionFree" class="float-right" :href="status.url">
<i class="fas fa-ellipsis-h fa-lg text-muted"></i>
</a>
</p> </p>
</div> </div>
</div> </div>
@ -203,7 +206,7 @@
</div> </div>
</div> </div>
<div class="col-md-4 col-lg-4 pt-2 my-3 order-1 order-md-2 d-none d-md-block"> <div v-if="!modes.distractionFree" class="col-md-4 col-lg-4 pt-2 my-3 order-1 order-md-2 d-none d-md-block">
<div class="position-sticky" style="top:68px;"> <div class="position-sticky" style="top:68px;">
<div class="mb-4"> <div class="mb-4">
<div class=""> <div class="">
@ -447,7 +450,8 @@
'mod': false, 'mod': false,
'dark': false, 'dark': false,
'notify': true, 'notify': true,
'infinite': true 'infinite': true,
'distractionFree': false
}, },
followers: [], followers: [],
followerCursor: 1, followerCursor: 1,
@ -459,7 +463,7 @@
showSuggestions: false, showSuggestions: false,
showReadMore: true, showReadMore: true,
replyStatus: {}, replyStatus: {},
replyText: '', replyText: ''
} }
}, },
@ -485,12 +489,19 @@
this.showSuggestions = true; this.showSuggestions = true;
} }
if(localStorage.getItem('pf_metro_ui.exp.rm') == 'false') { if(localStorage.getItem('pf_metro_ui.exp.rm') == 'false') {
this.showReadMore = false; this.showReadMore = false;
} else { } else {
this.showReadMore = true; this.showReadMore = true;
} }
if(localStorage.getItem('pf_metro_ui.exp.df') == 'true') {
this.modes.distractionFree = true;
} else {
this.modes.distractionFree = false;
}
this.$nextTick(function () { this.$nextTick(function () {
$('[data-toggle="tooltip"]').tooltip() $('[data-toggle="tooltip"]').tooltip()
}); });