Docs Site: Lightbox component does not work properly

[anuradha9712]

Description

When the user navigates to the MDS Docs site and clicks on any image, the lightbox feature does not appear to function properly.

It was working previously, but stopped functioning after migrating the code from Gatsby v3.x to v5.x

Steps to reproduce

• Navigate to the MDS Docs site
• Clicks on any image
• Image does not opens in an overlay on top of the current page.

Expected result

After clicking on the image, the image should opens in an overlay on top of the current page, dimming or blurring the background to focus on the image.

Steps to fix the issue

• Fork and clone this repository
• Switch current directory to docs using command cd docs
• Install dependencies using npm install
• Start development server using npm run dev
• Check the issue on your local environment on localhost:8000
• Refer to lightbox codebase and main layout component