Add animation for likes, from #222

This commit is contained in:
Daniel Supernault 2019-02-28 13:42:49 -07:00
parent eb04e595a8
commit 9f28526b99
No known key found for this signature in database
GPG Key ID: 0DEF1C662C9033F7
1 changed files with 39 additions and 0 deletions

View File

@ -211,6 +211,45 @@ body, button, input, textarea {
animation: loading-bar 3s linear infinite;
}
.liked {
position: relative;
z-index: 1;
}
.liked::after {
content: "\F0a3";
color: transparent;
animation: liking 1.5s;
position: absolute;
z-index: -1;
left: 50%;
top: 0;
}
@keyframes liking {
0% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
font-size:0;
top: .25rem;
color: #ebf70e;
}
75% {
-webkit-transform:rotate(1turn);
transform:rotate(1turn);
top: -0.55rem;
font-size: 2.8rem;
opacity:1;
left: -0.55rem;
}
100% {
transform:rotate(1turn);
top: 2.5rem;
left: 0em;
font-size:0;
left: 0.9rem
}
.max-hide-overflow {
max-height: 500px;
overflow-y: hidden;