editor.js/src/styles/animations.css
Peter Savchenko 8ceb615cd5
Some new styles, used by Image Tool (#479)
* Some new styles, used by Image Tool

* update example

* Update submodule

* increase version

* remove Simple

* update some packages
2018-11-06 18:33:39 +03:00

62 lines
932 B
CSS

.wobble {
animation-name: wobble;
animation-duration: 400ms;
}
/**
* @author Nick Pettit - https://github.com/nickpettit/glide
*/
@keyframes wobble {
from {
transform: translate3d(0, 0, 0);
}
15% {
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
transform: translate3d(2%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
transform: translate3d(-3%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
transform: translate3d(2%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
transform: translate3d(-1%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
to {
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceIn {
from,
20%,
40%,
60%,
80%,
to {
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
transform: scale3d(0.9, 0.9, 0.9);
}
20% {
transform: scale3d(1.03, 1.03, 1.03);
}
60% {
transform: scale3d(1, 1, 1);
}
}