Community forum for knowledge and support

Updated 11 months ago

The Modal 3 Component's Brightness Issue

At a glance

The community member posted about an issue with a Modal 3 Component not appearing in full brightness, having a dark overlay. Other community members suggested it could be a z-index issue and advised checking the z-index of the component versus the overlay. They also discussed where the modal component should be placed, with the recommendation to keep it in the page-wrapper. The original poster later reported that they had figured out the issue, which was related to a missing variable and not assigning the right background color to an element in the component.

When the Modal 3 Component is opened, it doesn’t appear in full brightness. It has a dark overlay. How can I fix this?

M
M
7 comments

most likely a z-index issue. Want to share a read-only and I can pinpoint it for you or you can take a look at the z-index of the component versus the overlay.

Okay, I will take a look at at. Should the modal component be in the page-wrapper or main-wrapper?

anywhere in the page-wrapper should be fine. No reason to keep it in main-wrapper - it all depends on where you are triggering the modal as well.

Thanks, I’ve figured it out. It was related to a missing variable issue and my not assigning a background color to the right element in the component.

dang missing variables again...

Yup! At least I’m aware of that issue now.

Add a reply
Sign up and join the conversation on Slack