diff options
Diffstat (limited to 'pydis_site/static/css/home/timeline.css')
| -rw-r--r-- | pydis_site/static/css/home/timeline.css | 80 |
1 files changed, 80 insertions, 0 deletions
diff --git a/pydis_site/static/css/home/timeline.css b/pydis_site/static/css/home/timeline.css index 07e17e15..c7137fde 100644 --- a/pydis_site/static/css/home/timeline.css +++ b/pydis_site/static/css/home/timeline.css @@ -3652,6 +3652,14 @@ mark { -webkit-animation-name: cd-bounce-2-inverse; animation-name: cd-bounce-2-inverse } + .cd-timeline__img--bounce-out { + -webkit-animation: cd-bounce-out-1 0.6s; + animation: cd-bounce-out-1 0.6s; + } + .cd-timeline__content--bounce-out { + -webkit-animation: cd-bounce-out-2 0.6s; + animation: cd-bounce-out-2 0.6s; + } } @-webkit-keyframes cd-bounce-1 { @@ -3755,3 +3763,75 @@ mark { transform: translateX(0) } } + +@-webkit-keyframes cd-bounce-out-1 { + 0% { + opacity: 1; + -webkit-transform: scale(1); + transform: scale(1) + } + + 60% { + -webkit-transform: scale(1.2); + transform: scale(1.2) + } + + 100% { + opacity: 0; + -webkit-transform: scale(0.5); + transform: scale(0.5) + } +} + +@keyframes cd-bounce-out-1 { + 0% { + opacity: 1; + -webkit-transform: scale(1); + transform: scale(1); + } + + 60% { + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + + 100% { + opacity: 0; + -webkit-transform: scale(0.5); + transform: scale(0.5); + } +} + +@-webkit-keyframes cd-bounce-out-2 { + 0% { + opacity: 1; + -webkit-transform: translateX(0); + transform: translateX(0) + } + 60% { + -webkit-transform: translateX(20px); + transform: translateX(20px) + } + 100% { + opacity: 0; + -webkit-transform: translateX(-100px); + transform: translateX(-100px) + } +} + +@keyframes cd-bounce-out-2 { + 0% { + opacity: 1; + -webkit-transform: translateX(0); + transform: translateX(0) + } + 60% { + -webkit-transform: translateX(20px); + transform: translateX(20px) + } + 100% { + opacity: 0; + -webkit-transform: translateX(-100px); + transform: translateX(-100px) + } +} |