Ion-modal changes background color of ion-page

When the modal is opened, the background color of the page changes. How can this be prevented?
Thanks a million!


 <ion-modal ref="modal" trigger="open-modal" :show-backdrop="false" :presenting-element="presentingElement" style="--max-height: 30vh; --backdrop-opacity: 0;">

I see that you are setting the style, and that should work. But this class solution works for me:

<ion-modal class="clear-backdrop">...</ion-modal>

<style scoped>
ion-modal.clear-backdrop {
  --backdrop-opacity: 0;

Thank you for your answer. Unfortunately, the background color of ion-page or ion-content is still changed.

Its probably not working because your are using scoped css styles?

Current code without scoped styles:

    <ion-page ref="indexpage">
        <ion-content :fullscreen="true">
            <ion-modal ref="modal" class="clear-backdrop" :show-backdrop="false" trigger="open-modal" :presenting-element="presentingElement"></ion-modal>

.clear-backdrop {
    --backdrop-opacity: 0;

It doesn’t look to me like the backdrop is causing the background color of the page to become lighter.