fix: full-screen slide animation for day/week nav
This commit is contained in:
parent
b7fa5ff7c0
commit
9be39b0b30
@ -2739,24 +2739,27 @@ h3 {
|
|||||||
/* --- VIEW TRANSITION ANIMATION (Day/Week Navigation Slide) --- */
|
/* --- VIEW TRANSITION ANIMATION (Day/Week Navigation Slide) --- */
|
||||||
|
|
||||||
@keyframes slideOutToLeft {
|
@keyframes slideOutToLeft {
|
||||||
to { transform: translateX(-30%); opacity: 0; }
|
from { transform: translateX(0); }
|
||||||
|
to { transform: translateX(-100%); }
|
||||||
}
|
}
|
||||||
@keyframes slideInFromRight {
|
@keyframes slideInFromRight {
|
||||||
from { transform: translateX(30%); opacity: 0; }
|
from { transform: translateX(100%); }
|
||||||
to { transform: translateX(0); opacity: 1; }
|
to { transform: translateX(0); }
|
||||||
}
|
}
|
||||||
@keyframes slideOutToRight {
|
@keyframes slideOutToRight {
|
||||||
to { transform: translateX(30%); opacity: 0; }
|
from { transform: translateX(0); }
|
||||||
|
to { transform: translateX(100%); }
|
||||||
}
|
}
|
||||||
@keyframes slideInFromLeft {
|
@keyframes slideInFromLeft {
|
||||||
from { transform: translateX(-30%); opacity: 0; }
|
from { transform: translateX(-100%); }
|
||||||
to { transform: translateX(0); opacity: 1; }
|
to { transform: translateX(0); }
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Week Grid Transition Group */
|
/* Week Grid Transition Group */
|
||||||
::view-transition-group(week-grid) {
|
::view-transition-group(week-grid) {
|
||||||
animation-duration: 0.35s;
|
animation-duration: 0.3s;
|
||||||
animation-timing-function: cubic-bezier(0.25, 1, 0.5, 1);
|
animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Slide Next (Left) — content exits left, new enters from right */
|
/* Slide Next (Left) — content exits left, new enters from right */
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user