Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make backout exits and entrances use a variable #1267

Open
SamMousa opened this issue Apr 16, 2021 · 6 comments
Open

Make backout exits and entrances use a variable #1267

SamMousa opened this issue Apr 16, 2021 · 6 comments

Comments

@SamMousa
Copy link

Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Currently the backout exits use hardcoded pixel translations. This has 2 drawbacks:

  • It won't work for very large resolutions
  • It creates a time gap between the animationend event and the UX of when the animation ends for smaller elements.

Consider I have an element of fixed width 500px, inside it I slide an element to the left, it will be translated to -2000px. The first 20% of the animation time is spent on scaling, after that the remaining 80% is spent on moving the item. This means that after 0.2 seconds of movement the item is no longer visible (overflow hidden).
Suppose when the animation ends I want to start another animation, like something sliding in from the right, this will start very late because half of both animations are not visible

Describe the solution you'd like A clear and concise description of what you want to happen.

  1. Configure the pixel values using variables so that they can be overridden.
  2. Default to using viewport relative units so that it'll work on large resolutions. (this is optional and not strictly related, just something I noticed when reviewing the source code)

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.
Current alternative is to use setInterval to trigger the next animation early and remove the previous element mid animation.

Additional context Add any other context or screenshots about the feature request here.

I'm happy to make a PR.

@SamMousa SamMousa changed the title Make backout exits use a variable Make backout exits and entrances use a variable Apr 16, 2021
@warengonzaga
Copy link
Member

Hi @SamMousa I'll review your feature request and get back to you.

@warengonzaga
Copy link
Member

Hi @SamMousa did you try to PR?

@SamMousa
Copy link
Author

SamMousa commented Sep 3, 2021

Nope, turns out priorities changed and I forgot about this one...

@warengonzaga
Copy link
Member

Nope, turns out priorities changed and I forgot about this one...

Let us know if you still want to PR so we can work on it.
I'm gonna be free in the next few weeks.

@SamMousa
Copy link
Author

SamMousa commented Sep 3, 2021

Please go ahead then! Thanks in advance 😊

@warengonzaga
Copy link
Member

Please go ahead then! Thanks I'm advance 😊

Thanks, will add this on v5 🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants