kit/assets/animations/animations.css

.anim-scale-in {
    animation-name: scale-in;
    animation-duration: var(--animation-duration, 0.15s);
    animation-timing-function: cubic-bezier(0.2, 0, 0.13, 1.5);
}

@keyframes scale-in {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.anim-scale-out {
    -webkit-animation: scale-out-center var(--animation-duration, 0.15s) cubic-bezier(0.2, 0, 0.13, 1.5);
    animation: scale-out-center var(--animation-duration, 0.15s) cubic-bezier(0.2, 0, 0.13, 1.5);
}
@-webkit-keyframes scale-out-center {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
        opacity: 0;
    }
}
@keyframes scale-out-center {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
        opacity: 0;
    }
}
.anim-fade-in {
    -webkit-animation: fade-in 0.15s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    animation: fade-in 0.15s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.anim-fade-in-top {
    -webkit-animation: fade-in-top 0.15s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    animation: fade-in-top 0.15s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@-webkit-keyframes fade-in-top {
    0% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}
@keyframes fade-in-top {
    0% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}
.anim-fade-out {
    -webkit-animation: fade-out 0.15s ease-out both;
    animation: fade-out 0.15s ease-out both;
}
@-webkit-keyframes fade-out{0%{opacity:1}100%{opacity:0}}@keyframes fade-out{0%{opacity:1}100%{opacity:0}}
.anim-fade-out-top{-webkit-animation:fade-out-top .15s cubic-bezier(.25,.46,.45,.94) both;animation:fade-out-top .15s cubic-bezier(.25,.46,.45,.94) both}
@-webkit-keyframes fade-out-top{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}100%{-webkit-transform:translateY(-50px);transform:translateY(-50px);opacity:0}}@keyframes fade-out-top{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}100%{-webkit-transform:translateY(-50px);transform:translateY(-50px);opacity:0}}