search

material-components / material-components-web

Modular and customizable Material Design UI components for the web
https://material.io/develop/web
MIT License
17.14k stars 2.15k forks source link

[MDC List] Icons and avatars that are not 1:1 aspect ratio are distorted #5897

Open mmalerba opened 4 years ago

mmalerba commented 4 years ago

Bug report

When using an image that is not 1:1 aspect ratio as the icon or avatar for a list, it becomes distorted.

Steps to reproduce

See reproduction: https://codepen.io/mmalerba/pen/BaoroME

Actual behavior

Image is distorted

Expected behavior

Image is scaled down, but not distorted

Possible solution

Add object-fit: cover to the styles for .mdc-list-item__graphic

joyzhong commented 4 years ago

Thanks for filing! Going to add to our backlog, but feel free to send out a CL for this!