Open samanmohamadi opened 6 years ago
Agreed, or having a faster default animation using uk-animation-fast
. A workaround is that you can disable the animation by setting transition: none;
on the uk-modal-dialog div, and then use your own animation. For example:
<div style="transition: none;" class="uk-modal-dialog uk-modal-body uk-margin-auto-vertical uk-animation-fade uk-animation-fast" uk-overflow-auto>
<button class="uk-modal-close-default" type="button" uk-close></button>
Blah blah blah
</div>
Here's scale up: https://codepen.io/anon/pen/VXoJRz
Edit: Maybe it would be nice to have a uk-animation-clear
as well.
It is possible to override the animation with a .hook-modal-dialog()
, but you then have to specify the animation 'manually', from scratch, overriding the pre-defined transform
that the modal dialog uses. Using the hook, UIkit also does an 'out' animation in reverse by default. For example, to change the animation so we get a 'slide-left' that is longer than the default animation, we could use:
.hook-modal-dialog() {
transform: translateY(0px) translateX(-300px);
transition: 0.8s ease-out;
}
It's not difficult, but it's cumbersome, and it would be infinitely better to be able to just 'plug-in' the animations from the Animation component.
it would be nice if there was a possibility to use another animation for modals. for example, Scale Up