Skip to content

[BUG]: Cumulative layout shift when modal consists of images #2

@SneakySensei

Description

@SneakySensei

Describe the bug
When the modal consists of images the modal faces a shift in layout since initially the images are not loaded and the width/height of the modal remains at minimum.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://react-lean-modal.snehil.dev/
  2. Click on the "Open Modal" button in the example and wait for the images to load.
  3. See the error

Expected behavior
Modal should stay stable throughout the animation.

Screenshots
image
Before
image
After

Additional context
Maybe a prop can be added to the Modal component to specify whether it's a full-size modal or a compact modal (size depending on content).

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workinggood first issueGood for newcomershacktoberfestThis issue opts-in into hacktoberfest 2022

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions