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

Avatar should allow for width and height to be set against the image #28552

Open
1 task done
nicholasgriffintn opened this issue Dec 26, 2020 · 3 comments
Open
1 task done
Labels

Comments

@nicholasgriffintn
Copy link

nicholasgriffintn commented Dec 26, 2020

  • I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

It would remove the Google Lighthouse errors for:

"Image elements do not have explicit width and height"

Which also brings performance gains.

What does the proposed API look like?

Height and width should be passed from the Avatar props.

@zombieJ
Copy link
Member

zombieJ commented Dec 28, 2020

Seems this is a false positive since image holder div has already config the size style.

@nicholasgriffintn
Copy link
Author

nicholasgriffintn commented Dec 28, 2020

So using something like this, it does output style on the wrapper. It does not add width and height attributes to the image provided.

<Avatar
                        shape="square"
                        size={32}
                        src={
                          'https://example.com/image.png'
                        }
                        alt={`alt text`}
                      />

Can be seen in Chrome:

image

You'd want something like this:

image

@vnvyvu
Copy link

vnvyvu commented Dec 8, 2021

you can temporarily fix it:

.ant-comment-avatar img {
    width: inherit !important;
    height: inherit !important;
    border-radius: inherit !important;
}

i hope it gets fixed soon too

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

No branches or pull requests

5 participants