revil-O/platypush
1
0
Fork 0
forked from platypush/platypush
Code Pull requests Activity

[UI] Added shink, expand and unfold animations.

Browse source
This commit is contained in:
Fabio Manganiello 2024-09-05 01:20:43 +02:00
parent dd2ea2092e
commit 68e3cc51e4
Signed by untrusted user: blacklight
GPG key ID: D90FBA7F76362774
1 changed files with 39 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
platypush/backend/http/webapp/src/style/animations.scss
View file

@ -14,6 +14,30 @@
-webkit-animation-name: fadeOut;
}
.expand {
animation-duration: 0.5s;
-webkit-animation-duration: 0.5s;
animation-fill-mode: both;
animation-name: expand;
-webkit-animation-name: expand;
}
.shrink {
animation-duration: 0.5s;
-webkit-animation-duration: 0.5s;
animation-fill-mode: both;
animation-name: shrink;
-webkit-animation-name: shrink;
}
.unfold {
animation-duration: 0.5s;
-webkit-animation-duration: 0.5s;
animation-fill-mode: both;
animation-name: unfold;
-webkit-animation-name: unfold;
}
@keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
@ -27,6 +51,21 @@
}
}
@keyframes expand {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@keyframes shrink {
0% {transform: scale(1);}
100% {transform: scale(0);}
}
@keyframes unfold {
0% {transform: scale(0, 1);}
100% {transform: scale(1, 1);}
}
.glow {
animation-duration: 2s;
-webkit-animation-duration: 2s;