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

fix(angular/menu): remove dependency on animations module #2472

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

mhaertwig
Copy link
Collaborator

This should allow us to avoid some of the pitfalls of the animations module like occasional memory leaks and reduce the bundle size.

@mhaertwig mhaertwig marked this pull request as draft January 13, 2025 13:22
This should allow us to avoid some of the pitfalls of the animations module like occasional memory leaks and reduce the bundle size.
}
to {
width: 288px;
max-height: 100%;
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using max-height to animate the user menu's height creates a less fluid animation compared to directly animating its actual height.

In Angular animations, we achieved this smoothly by using height: '*', where the wildcard dynamically applies the element's height before the animation starts.

@jeripeierSBB, do you have any suggestions for improving the CSS transition?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I got this working by using grid-template-rows for the height animation and by adding a <div class="sbb-menu-panel-content" /> wrapper element around the menu content.

@mhaertwig mhaertwig marked this pull request as ready for review February 3, 2025 07:16
@github-actions github-actions bot requested a deployment to preview-pr2472 February 3, 2025 07:33 In progress
@github-actions github-actions bot requested a deployment to preview-pr2472 February 3, 2025 09:55 In progress
Copy link
Collaborator

@kyubisation kyubisation left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 👍
Nice work! 😃

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

Successfully merging this pull request may close these issues.

2 participants