Change the animation of the dialogue with the material-ui

Question

Is it possible to change the animation of the dialogue animation in the material-ui for reaction using css? I am not advancing in css, but I know that there is something like transtion and transform.

Answer 1

The Dialog component provides a transitional option that can be used to override the default value. An example in the Dialog demo video (with the inscription "Slide in the notification dialog box"), which uses the provided slide transition:

import Slide from 'material-ui/transitions/Slide'; 

Then:

 <Dialog open={this.state.open} transition={Slide} onRequestClose={this.handleRequestClose}> 

Here are the migration components that they provide:

• Collapse
• Fade
• Grow
• Slide

If none of them serves your purpose, you can use them as a starting point to create your own transition component.