How can I fix the issue of the Finsweet Cookie consent cloneable not working on mobile and unable to scroll inside the modal on both Finsweet's website and my own Webflow site?

The Finsweet Cookie Consent cloneable may break mobile scroll inside the modal due to overflow or body scroll-lock conflicts. This issue affects both the original Finsweet site and your Webflow project when using their cloneable.

1. Identify the Problem

• The modal opens correctly, but you cannot scroll inside it on mobile devices.
• Both the background body scroll lock and the modal container settings may contribute to this.
• This happens regardless of whether you're using the cloneable from Finsweet directly or in your Webflow project.

2. Inspect CSS Overflow Settings

• Go to Webflow Designer > Style panel for the modal container (.cookie-modal or similar).
• Make sure the container has overflow: auto or overflow-y: scroll for vertical scroll to work.
• Also ensure height is set to 100vh or a constrained value that requires scroll if content overflows.

3. Check Body Scroll Lock Script

• Finsweet’s cloneable might be using a body scroll lock JS utility when the modal is open.

• This script can inadvertently disable all scrolling on mobile, including within modals.

• Look in your custom code or page/page settings for any script like body-scroll-lock.js.

• If you find JS like disableBodyScroll(modalElem), make sure it's correctly scoped.

• You may need to allow scroll inside the modal with allowTouchMove(modalElem).

4. Adjust Mobile Overflow Settings

• In mobile breakpoints, check that the modal wrapper and inner block don't have:

• overflow: hidden or

• Fixed height percentages that don’t account for viewport behavior on mobile.

• Target the modal container and ensure:

• Position: fixed

• Top: 0, Bottom: 0

• Width: 100%

• Proper z-index

• Padding or max-height should allow vertical scroll

5. Consider Replacing Scroll Lock or Cookie Consent

• If resolution takes too much effort or the cloneable JS is too restrictive, consider either:
• Custom-building a simpler version of the consent modal without scroll lock logic.
• Using a cookie consent integration like Osano or Cookiebot, which are more robust on mobile.

Summary

The Finsweet cookie modal’s scroll issue on mobile stems from scroll-lock scripts or incorrect overflow settings in the modal container. To fix it, enable overflow-y: scroll on the modal and ensure the scroll-lock JavaScript does not block touch scrolling on mobile. If issues persist, consider customizing the cloneable or using a third-party consent tool.