Topic: mdb-stepper is not responsive as you see examples
Expected behavior
Component just doesn't work as per example
https://mdbootstrap.com/docs/angular/components/stepper/#stepper-with-icons
Actual behavior
That works with responsiveness.
Just put the code in your application and it will not work as per the example. I have the JQuery library I don't have so many problems, but Angular is having problems and incomplete documentation. We need to release a production version but we are not confident with the library.
Resources (screenshots, code snippets etc.)
Hi @Wanderson,
Thank you for report the bug.
If you want to change vertical property, please change the first line in HTML code for like this:
<mdb-stepper #stepper [linear]="true" [vertical]="vertical" (window:resize)="onResize($event)" (window:load)="onResize($event)">
And then we need to make vertical variable and onResize function.
vertical = false;
onResize(event: any) {
if (event.target.innerWidth >= 786) {
this.vertical = false;
} else {
this.vertical = true;
}
}
So, now component has a breakpoint in 786px.
Also, we will change the documentation of this component.
Thanks again, and I hope my solution will be exactly what do you need.
Best, Konrad.
Resolved
- User: Pro
- Premium support: No
- Technology: Angular
- MDB Version: 9.3.0
- Device: All
- Browser: All
- OS: All
- Provided sample code: No
- Provided link: Yes