1
0
mirror of https://github.com/kremalicious/portfolio.git synced 2025-02-14 21:10:41 +01:00
portfolio/src/components/atoms/Animations.scss

44 lines
747 B
SCSS

.fadein-appear,
.fadein-enter {
opacity: .01;
&.fadein-appear-active,
&.fadein-enter-active {
opacity: 1;
transition: 200ms ease-in;
}
}
.fadein-exit {
opacity: 1;
transition: 200ms ease-in;
&.fadein-exit-active {
opacity: .01;
}
}
.movein-appear,
.movein-enter {
opacity: .01;
transform: translate3d(0, 3rem, 0);
&.movein-appear-active,
&.movein-enter-active {
opacity: 1;
transform: translate3d(0, 0, 0);
transition: 300ms ease-out;
}
}
.movein-exit {
opacity: 1;
transform: translate3d(0, 0, 0);
transition: 100ms ease-out;
&.movein-exit-active {
opacity: .01;
transform: translate3d(0, 3rem, 0);
}
}