animations
This commit is contained in:
98
app/static/css/animations.css
Normal file
98
app/static/css/animations.css
Normal file
@@ -0,0 +1,98 @@
|
||||
/* Modal transition animations using Tailwind classes */
|
||||
/*
|
||||
.slide-left-move {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
transition: all 300ms ease-out;
|
||||
}
|
||||
|
||||
.slide-left-enter-from {
|
||||
transform: translateX(100%);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.slide-left-enter-to {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
transition: all 300ms ease-out;
|
||||
}
|
||||
|
||||
.slide-left-leave-from {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.slide-left-leave-to {
|
||||
transform: translateX(-100%);
|
||||
opacity: 0;
|
||||
transition: all 300ms ease-in;
|
||||
}
|
||||
|
||||
.slide-right-move {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
transition: all 300ms ease-out;
|
||||
}
|
||||
|
||||
.slide-right-enter-from {
|
||||
transform: translateX(-100%);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.slide-right-enter-to {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
transition: all 300ms ease-out;
|
||||
}
|
||||
|
||||
.slide-right-leave-from {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.slide-right-leave-to {
|
||||
transform: translateX(100%);
|
||||
opacity: 0;
|
||||
transition: all 300ms ease-in;
|
||||
}
|
||||
|
||||
.translate-up-move {
|
||||
transform: translateY(0);
|
||||
opacity: 1;
|
||||
transition: all 300ms ease-out;
|
||||
}
|
||||
|
||||
.translate-up-enter-from {
|
||||
transform: translateY(100%);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.translate-up-enter-to {
|
||||
transform: translateY(0);
|
||||
opacity: 1;
|
||||
transition: all 300ms ease-out;
|
||||
}
|
||||
|
||||
.translate-up-leave-from {
|
||||
transform: translateY(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.translate-up-leave-to {
|
||||
transform: translateY(-100%);
|
||||
opacity: 0;
|
||||
transition: all 300ms ease-in;
|
||||
}
|
||||
|
||||
.step-1 .steps .step:first-child,
|
||||
.step-2 .steps .step:last-child {
|
||||
--tw-step-text: hsl(var(--bc));
|
||||
--tw-step-primary: hsl(var(--p));
|
||||
}
|
||||
|
||||
.step-1 .steps .step:last-child,
|
||||
.step-2 .steps .step:first-child {
|
||||
--tw-step-text: hsl(var(--bc));
|
||||
color: hsl(var(--bc));
|
||||
}
|
||||
*/
|
||||
Reference in New Issue
Block a user