[BUG] Background page scrolls when reaching the end of Roadmap modal content

[sammy200-ui]

Describe the bug.

I was exploring the Roadmap page and noticed a scrolling behavior that seems unintentional. When I click on a roadmap item card, a modal popup appears with the description. If I scroll down inside this modal and reach the bottom, the main background page starts scrolling instead of the scroll stopping at the end of the modal content. I wanted to confirm if this "scroll chaining" behavior is intended or if the background scroll should be locked while the modal is open?

Expected behavior

Typically, when a modal is open, the background page should be locked (non-scrollable) to keep the user's focus on the modal content. The scroll should be contained entirely within the popup.

Screenshots

https://github.com/user-attachments/assets/25fda1d1-1286-43b7-ac8a-bfc73540ec08

How to Reproduce

Go to https://www.asyncapi.com/roadmap Click on any roadmap item card that has a long description Scroll down inside the popup modal. Continue scrolling once you reach the bottom of the modal. Observe that the background page behind the modal begins to scroll.

🖥️ Device Information [optional]

• Operating System (OS):
• Browser:
• Browser Version:

👀 Have you checked for similar open issues?

• [x] I checked and didn't find similar issue

🏢 Have you read the Contributing Guidelines?

• [x] I have read the Contributing Guidelines

Are you willing to work on this issue ?

Yes

[namanjain24-sudo]

can I work on this issue ?

[sammy200-ui]

Hey! @namanjain24-sudo Thanks for your interest 😊 I’m already actively working on this issue and should have an update soon depending on the mentors approval

[sammy200-ui]

Hello @princerajpoot20 if this is a bug i would like to work on it. Thank you!!

[princerajpoot20]

The background scroll should be blocked. @sammy200-ui You can go ahead with this issue.

[sammy200-ui]

@princerajpoot20 Thanks for the confirmation. I will go ahead and make a pr