search

upmostly / modali

A delightful modal dialog component for React, built from the ground up to support React Hooks.
213 stars 23 forks source link

Custom "show" effect transition #17

Closed yairEO closed 5 years ago

yairEO commented 5 years ago

Would be nice to have control over the animation so I could decide which animation I want the modal to have, including duration and so on.

I suspect you are add a class when rendering the modal, so show it, and on that class the transition is happening. I would like the control the initial style of the modal before it is showed and the style after it is shown, to have total control over the effect.

For example, I would like the modal to initially have this style:

opacity: 0;
transform: scale(.6) rotateX(10deg);  // parent should always have "perspective:1000px"

And the "show" state should have this style:

opacity: 1;
transform: none;

Now that I think about it, I would like to have complete control over the whole style, from the background color, to modal shadow and everything.. This is more related to #15

jcrowson commented 5 years ago

@yairEO Thanks for all of your suggestions, great stuff!

I'm hesitant with allowing too much customization. My original goal for modali was to provide a great looking modal experience out of the box. I wanted devs to have a modal up very quickly, which meant less options to read through and understand.

I believe that there are alternative modal solutions out there that allow you to customize the whole experience. Therefore, I'm closing this issue. Feel free to convince me otherwise!