feat(reduce-motion): remove view-transition
The new @view-transition API is supported by most mayor browsers and allows for page transition animations. Disabled these on prefers-reduced-motion.
@romainmenke @jonathantneal
Seems fair.
I don't think the original premise of these is correct. "reduce motion" does not imply that all transitions/animations should be disabled. Only that potentially harmful/detrimental motion should be reduced.
But I also think that is beyond the scope of this change. Since this CSS preset already has this opinion it seems fine to continue along the same line.
It's been 4 years since anyone published this package. So I'd like to first see if there are any blockers for publishing. I want to avoid merging a change that can never be published :)
Taking the opportunity of this PR to suggest another change that might also inspire this one: the current 0s for durations is preventing transition and animation start/end events to be fired.
I've created a pen to demo this back in the days.
If you want to keep a hard reset, this is the minimal code to avoid breaking JS code relying on these event:
*,
::before,
::after {
@media (--reduced-motion) {
transition: .001s !important;
animation: .001s !important;
}
}
Back to view transitions: I don’t know how the pageswap and pagereveal events behave in this situation, but the decision for this should probably be consistent with the adoption of my suggestion. Maybe the view transition duration should also be a .001s one. I haven’t touched VTs a lot, but I guess that would be the code:
:root::view-transition-old(*),
:root::view-transition-new(*),
:root::view-transition-group(*),
:root::view-transition-image-pair(*) {
@media (--reduced-motion) {
animation: .001s !important;
}
}