add a spin animation to favorite and boost actions
This commit is contained in:
parent
ba4f7ef3ef
commit
459fdaf10f
4 changed files with 28 additions and 5 deletions
|
@ -1,5 +1,10 @@
|
|||
const FavoriteButton = {
|
||||
props: [ 'status' ],
|
||||
props: ['status'],
|
||||
data () {
|
||||
return {
|
||||
animated: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
favorite () {
|
||||
if (!this.status.favorited) {
|
||||
|
@ -7,13 +12,18 @@ const FavoriteButton = {
|
|||
} else {
|
||||
this.$store.dispatch('unfavorite', {id: this.status.id})
|
||||
}
|
||||
this.animated = true
|
||||
setTimeout(() => {
|
||||
this.animated = false
|
||||
}, 500)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
classes () {
|
||||
return {
|
||||
'icon-star-empty': !this.status.favorited,
|
||||
'icon-star': this.status.favorited
|
||||
'icon-star': this.status.favorited,
|
||||
'animate-spin': this.animated
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue