Show fav/RT counts even if not logged in.

This commit is contained in:
eal 2018-02-02 00:45:29 +02:00
parent 3ff39f9b39
commit 664a55fc79
5 changed files with 24 additions and 18 deletions

View file

@ -1,5 +1,5 @@
const FavoriteButton = { const FavoriteButton = {
props: ['status'], props: ['status', 'loggedIn'],
data () { data () {
return { return {
animated: false animated: false

View file

@ -1,6 +1,10 @@
<template> <template>
<div> <div v-if="loggedIn">
<i :class='classes' class='favorite-button base09' @click.prevent='favorite()'/> <i :class='classes' class='favorite-button fav-active base09' @click.prevent='favorite()'/>
<span v-if='status.fave_num > 0'>{{status.fave_num}}</span>
</div>
<div v-else>
<i :class='classes' class='favorite-button base09'/>
<span v-if='status.fave_num > 0'>{{status.fave_num}}</span> <span v-if='status.fave_num > 0'>{{status.fave_num}}</span>
</div> </div>
</template> </template>
@ -8,7 +12,7 @@
<script src="./favorite_button.js" ></script> <script src="./favorite_button.js" ></script>
<style lang='scss'> <style lang='scss'>
.favorite-button { .fav-active {
cursor: pointer; cursor: pointer;
animation-duration: 0.6s; animation-duration: 0.6s;
&:hover { &:hover {

View file

@ -1,5 +1,5 @@
const RetweetButton = { const RetweetButton = {
props: ['status'], props: ['status', 'loggedIn'],
data () { data () {
return { return {
animated: false animated: false

View file

@ -1,6 +1,10 @@
<template> <template>
<div> <div v-if="loggedIn">
<i :class='classes' class='icon-retweet base09' v-on:click.prevent='retweet()'></i> <i :class='classes' class='icon-retweet rt-active base09' v-on:click.prevent='retweet()'></i>
<span v-if='status.repeat_num > 0'>{{status.repeat_num}}</span>
</div>
<div v-else>
<i :class='classes' class='icon-retweet base09'></i>
<span v-if='status.repeat_num > 0'>{{status.repeat_num}}</span> <span v-if='status.repeat_num > 0'>{{status.repeat_num}}</span>
</div> </div>
</template> </template>
@ -9,7 +13,7 @@
<style lang='scss'> <style lang='scss'>
@import '../../_variables.scss'; @import '../../_variables.scss';
.icon-retweet { .rt-active {
cursor: pointer; cursor: pointer;
animation-duration: 0.6s; animation-duration: 0.6s;
&:hover { &:hover {

View file

@ -105,17 +105,15 @@
</div> </div>
</div> </div>
<div v-if="loggedIn"> <div class='status-actions'>
<div class='status-actions'> <div v-if="loggedIn">
<div> <a href="#" v-on:click.prevent="toggleReplying">
<a href="#" v-on:click.prevent="toggleReplying"> <i class="base09 icon-reply" :class="{'icon-reply-active': replying}"></i>
<i class="base09 icon-reply" :class="{'icon-reply-active': replying}"></i> </a>
</a>
</div>
<retweet-button :status=status></retweet-button>
<favorite-button :status=status></favorite-button>
<delete-button :status=status></delete-button>
</div> </div>
<retweet-button :loggedIn="loggedIn" :status=status></retweet-button>
<favorite-button :loggedIn="loggedIn" :status=status></favorite-button>
<delete-button :status=status></delete-button>
</div> </div>
</div> </div>
</div> </div>