Sidenav: content area size not calculated properly with animation
- Dominant language
- TypeScript
- Stars
- 25k
- Forks
- 6.8k
- Avg merge
- 1d 8h
- Merged PRs (30d)
- 91
Description
#### Bug, feature request, or proposal:
Bug
#### What is the expected behavior?
The size of the content area is calculated correctly according to the width of the sidenav menu.
#### What is the current behavior?
The calculation is wrong. The margin-left value of the content area is inverted to the width defined in the animation.
#### What are the steps to reproduce?
https://stackblitz.com/edit/angular-etpys5
(to see the issue you have to click a few times on the expand button)
#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
@angular/material@5.2.0
@angular/cdk@5.2.0
@angular/core@5.2.4
@angular/animations@5.2.4
Contributor guide
Research direction
Start by reproducing the issue in the linked StackBlitz example with the Angular Material 5.2.0 sidenav and clicking the expand button repeatedly. Trace the sidenav animation and content-area margin calculation, then verify that the content width and margin remain correct after repeated expand/collapse cycles.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100