Long expansion panel descriptions overflow the panel.
- Dominant language
- TypeScript
- Stars
- 25k
- Forks
- 6.8k
- Avg merge
- 1d 8h
- Merged PRs (30d)
- 91
Description
#### Bug, feature request, or proposal:
If you have a longer than normal expansion panel description it overflows over the expansion panel and pushes the label out of place.
#### What is the expected behavior?
The description should truncate and add an ellipses, or some other way to gracefully hand this situation.

#### What is the current behavior?
If a description is long it will push the title out of place and overflow.

#### What are the steps to reproduce?
https://stackblitz.com/edit/angular-fcxlsc?file=app/expansion-overview-example.html
#### What is the use-case or motivation for changing an existing behavior?
It looks pretty bad if a long description is used.
#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Tested on Angular Material 5.2.4 using chrome 65.0.3325.181 and firefox 59.0.2.
#### Is there anything else we should know?
Nothing.
Contributor guide
Research direction
Start with the linked StackBlitz reproduction, specifically app/expansion-overview-example.html, using a long expansion-panel description. Then locate the Angular Material expansion-panel implementation and verify that the description no longer overflows or displaces the title, with graceful truncation or another clear treatment as the finished behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 45/100