[EmptyStateExampleEmptyStateDefault]

[teophilus]

Summary

Empty State Image is opacity is set to 0 and never gets set to 1

Expected behavior

Empty state image opacity should be set to 1

Actual behavior

Wrap animated gifs/videos in a details tag:

Summary of your gif(s)

Steps to reproduce

Link to sandbox
1.
2.
3.

Are you using React components?

None

Polaris version number

12.26.1

Browser

Chrome

Device

MacOS

[laurkim]

Thanks for creating an issue @teophilus!

Do you mind providing a sandbox for the issue you're running into with opacity? EmptyState image starts at opacity: 0 and transitions to opacity: 1 once the image is loaded.

[teophilus]

sure, it's not working on the docs page:
https://polaris.shopify.com/components/layout-and-structure/empty-state

[laurkim]

Thanks, I'll update on upcoming fixes soon 👍

[laurkim]

Hey @teophilus thanks for flagging the opacity issue. A fix has been merged and the docs page will be fixed in the next release 👍