2016-10-31 21:04:15 +03:00
|
|
|
//- 💫 CSS > BASE > ANIMATIONS
|
2016-03-31 17:24:48 +03:00
|
|
|
|
2016-10-03 21:19:13 +03:00
|
|
|
//- Fade in
|
2016-03-31 17:24:48 +03:00
|
|
|
|
2016-10-03 21:19:13 +03:00
|
|
|
@keyframes fadeIn
|
2016-03-31 17:24:48 +03:00
|
|
|
from
|
2016-10-03 21:19:13 +03:00
|
|
|
opacity: 0
|
2016-03-31 17:24:48 +03:00
|
|
|
|
|
|
|
|
to
|
2016-10-03 21:19:13 +03:00
|
|
|
opacity: 1
|
2016-03-31 17:24:48 +03:00
|
|
|
|
|
|
|
|
|
2016-10-03 21:19:13 +03:00
|
|
|
//- Element slides in from the top
|
2016-03-31 17:24:48 +03:00
|
|
|
|
2016-10-03 21:19:13 +03:00
|
|
|
@keyframes slideInDown
|
|
|
|
|
from
|
|
|
|
|
transform: translate3d(0, -100%, 0)
|
|
|
|
|
visibility: visible
|
|
|
|
|
|
|
|
|
|
to
|
|
|
|
|
transform: translate3d(0, 0, 0)
|
2017-10-03 15:14:52 +03:00
|
|
|
|
|
|
|
|
|
|
|
|
|
//- Element rotates
|
|
|
|
|
|
|
|
|
|
@keyframes rotate
|
|
|
|
|
to
|
|
|
|
|
transform: rotate(360deg)
|
