Topic: Stepper form - animations problem
Expected behavior
stepper works correctly - https://mdbootstrap.com/docs/standard/components/stepper/
Actual behavior
if using windows via remote desktop, or with animations set to false, the content inside each stepper div will overlap each other on change.
is there a fall-back option to disable animations, or at least something I can implement to not use stepper if the user doesn't have animations enabled?
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Opened
Specification of the issue
- ForumUser: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 3.9.0
- Device: all
- Browser: all
- OS: Win
- Provided sample code: No
- Provided link: Yes
Darryl free commented 3 years ago
the vertical stepper actually works -- does anyone know how you can check if win animations are turned off via js? that way you could just default to the vertical option
Michał Duszak staff commented 3 years ago
This might be connected to Reduced motion option in your OS. You can try turning it off:In Windows 10: Settings > Ease of Access > Display > Show animations. In macOS: System Preferences > Accessibility > Display > Reduce motion https://web.dev/prefers-reduced-motion/
Darryl free commented 3 years ago
It is related. But that obviously isn't a fix for the problem, as I can't control if users have that option selected or not. Or if they are accessing my application via remote desktop.
Michał Duszak staff commented 3 years ago
Thank you for your feedback. We will look at this case and provide solution ASAP.
Michał Duszak staff commented 3 years ago
https://mdbootstrap.com/snippets/standard/m-duszak/3424965#css-tab-view
See if this workaround works for you
Darryl free commented 3 years ago
That helps, but if there are inputs in the display none areas, the labels of those input fields are rendered with lines through them. Similar to this issue -- https://mdbootstrap.com/support/jquery/input-label-has-line-through-when-form-switched-from-display-none-and-foucs-on-input/
Michał Duszak staff commented 3 years ago
Updating input fields might help https://mdbootstrap.com/docs/standard/forms/input-fields/#section-update Could you provide me a snippet to recreate this issue so that I can take a closer look at your exact example?