Topic: MDBReact stepper
I have implemented stepper within a form and it works fine. Is it feasible to change horizontal display to vertical display on small devices or when viewing on small devices?
handleStepper = () => {
const { formActivePanel1, swapFormActive } = this.props;
return (
<MDBStepper form>
<MDBStep form>
<a onClick={() => swapFormActive(1)(1)}>
<MDBBtn
color={formActivePanel1 === 1 ? 'indigo' : 'default'}
circle
>
1
</MDBBtn>
</a>
<p>Test 1</p>
</MDBStep>
<MDBStep form>
<a onClick={() => swapFormActive(1)(2)}>
<MDBBtn
color={formActivePanel1 === 2 ? 'indigo' : 'default'}
circle
>
2
</MDBBtn>
</a>
<p>Test 2</p>
</MDBStep>
<MDBStep form>
<a onClick={() => swapFormActive(1)(3)}>
<MDBBtn
color={formActivePanel1 === 3 ? 'indigo' : 'default'}
circle
>
3
</MDBBtn>
</a>
<p>Test 3</p>
</MDBStep>
<MDBStep form>
<a onClick={() => swapFormActive(1)(4)}>
<MDBBtn
color={formActivePanel1 === 4 ? 'indigo' : 'default'}
circle
>
4
</MDBBtn>
</a>
<p>Test 4</p>
</MDBStep>
<MDBStep form>
<a onClick={() => swapFormActive(1)(5)}>
<MDBBtn
color={formActivePanel1 === 5 ? 'indigo' : 'default'}
circle
>
5
</MDBBtn>
</a>
<p>Test 5</p>
</MDBStep>
</MDBStepper>
);
}
Jakub Chmura
staff premium answered 10 months ago
Hi @Paul TP,
Sorry, it's impossible. You can try to overwrite CSS to achieve what you want but we do not support these changes.
Best, Kuba
Answered
- User: Free
- Premium support: No
- Technology: React
- MDB Version: 4.27.0
- Device: Laptop
- Browser: chrome
- OS: Linux Fedora 32
- Provided sample code: No
- Provided link: No