Glitch Issuee in the background when closing the Dialog

[Kavindu Gamage]

When i try to close the Dialog box background glitch appears. how to solve this? i have added small video. 

Attachment: Modal_Glitch_cd072842.rar

[Priyanka Karthikeyan]

Hi Kavindu Gamage,

 

We've prepared a sample based on the details you provided but were unable to replicate the problem on our end.

For your reference, you can view the sample and video illustration here:

 

Sample: Blazor Playground Sample

 

To help us better understand and diagnose the issue, could you please share the relevant code snippet? Additionally, let us know if you are using a standard dialog or a predefined dialog. This information will assist us in reproducing the issue more accurately and enable us to provide a more effective solution.

Thank you for your cooperation and understanding.

 

Regards,

Priyanka K

[Kavindu Gamage]

Hi Priyanka Karthikeyan,

I added my code for your reference. this modal is on NavMenu in Blazor server app. I found that if i change the overlay background color to transparent glitch dissapears. but that is not a solution for me. 

  .e-dlg-overlay {

       background-color: transparent; 

  }

Hope this information will help you. Thank you in advance.

Attachment: Test_84b0f5b6.rar

[Priyanka Karthikeyan]

Hi Kavindu Gamage,

 

When the IsModal property is set to true, the Syncfusion Blazor Dialog component applies the e-dlg-overlay class to create a modal effect by preventing interaction with the background, which is typically rendered as a grey backdrop. However, if you prefer to maintain modal functionality without this grey backdrop, you can modify the styles accordingly. By setting the display property of the .e-dlg-overlay class to none, you can effectively hide the overlay while still ensuring that the dialog remains focused and interactive. Please examine the following code example and the provided sample link for guidance.

 

 

 

 .e-dlg-container .e-dlg-overlay

    {

      display: none !important;

    }

 

 

Sample: https://blazorplayground.syncfusion.com/VNBTXbCSfjSdyxGh

If you find that this approach doesn't fully meet your requirements or if you have any additional questions or need further assistance, please don't hesitate to reach out to us. We are here to help and provide further guidance as needed

 

Regards,

Priyanka K