Reconsider margin transition on sidenav

• Do you want to request a feature or report a bug? Bug
• What is the current behavior? Poor performance for sidenav toggle transition
• **If the current behavior is a bug, @jelbourn’s material2 demo and sidenav template show that transition is targeting margin-left.
• What is the expected behavior? I would expect animating transform: translateX unless there’s a reason that I missed
• What is the motivation / use case for changing the behavior? Smoother toggle transition
• Which version of Angular and Material, and which browser and OS does this issue affect? Material alpha 4
• Other information I would love to fix this if you agree Thanks!

[sebakerckhof]

The sidenav already animates using transform: translateX. However, the main content is animated using margin-left, which changes the width of the container and can result in poor performance. But using translate there would not have the same behavior. One does actually want the width to change.

I think a good middle ground is the way google inbox does it. They animate the side bar, but they don’t animate the main content. So the side nav slides in using a transform, but the width of the main content does not animate, but just jumps back and forth.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}