Reduced motion sickness animations
In many places of Nextcloud, motion sickness is induced, for example:
- loading icons
- modal loadings (they grow a bit when opened)
- app navigation bar moving upwards when hovered
- Scrolling
- and more I may have not seen yet
Solution: There is a setting for “reduced motion animations available on every operating system which should be respected by the library. This website explains how to do it and where to find the settings on each OS: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion
As an example, I made this change for custom animations in Assistant in this PR: https://github.com/nextcloud/assistant/pull/365
Not all animations are inducing motion sickness, only things that move parts of the website in relation to other parts, or animations that “move” a color gradient. Elements appearing or fading are fine in that regard and can still be used, also as a replacement if the setting is activated. If the movement is supposed to trasmit essential information to the user, it should not be just removed but be replaced by something else transferring that information (which can also be a color, an icon, …)
only things that move parts of the website in relation to other parts
I guess, it is NcAppNavigation and NcAppSidebar
Once https://github.com/nextcloud/server/pull/55406 is merged we can provide util like for dark theme and use it for those places.
Why not use native settings?
Why not use native settings?
It is using both, see the media query. But similar with dark mode we cannot always trust the system. Either it might not implement it or you are using a device where you have no permissions to change such settings (e.g. public devices), so we also need an option to enforce this in Nextcloud independent from the system.