github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-27 05:53:38 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Simplify animation used to denote draft is saved

Browse Source 
The original implementation felt a bit too short, went with
a much simpler animation which sticks around for 5 seconds.

5 seconds seems to be the standard and the same timing gmail use
This commit is contained in:
Sam Saffron 2019-04-12 10:28:10 +10:00
parent ef621f4c6e
commit 2fea29a355
1 changed files with 4 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
app/assets/stylesheets/common/base/compose.scss
View File

@ -455,50 +455,23 @@ div.ac-wrap {
}
.save-animation {
transition: all 1s ease-in-out;
-webkit-transform: scale(0.1);
transform: scale(0.1);
-webkit-animation: transformer 1.5s forwards;
animation: transformer 1.5s forwards;
-webkit-animation: transformer 5s forwards;
animation: transformer 5s forwards;
}
@-webkit-keyframes transformer {
0% {
-webkit-transform: scale(0.1);
}
20% {
-webkit-transform: scale(1.2);
}
40% {
-webkit-transform: scale(1);
-webkit-filter: opacity(1);
}
60% {
-webkit-transform: scale(1);
90% {
-webkit-filter: opacity(1);
}
100% {
-webkit-transform: scale(1);
-webkit-filter: opacity(0);
}
}
@keyframes transformer {
0% {
transform: scale(0.1);
}
20% {
transform: scale(1.2);
}
40% {
transform: scale(1);
opacity: 1;
}
60% {
transform: scale(1);
90% {
opacity: 1;
}
100% {
transform: scale(1);
opacity: 0;
}
}