telerik / kendo-angular

Issue tracker - Kendo UI for Angular
http://www.telerik.com/kendo-angular-ui/
Other
469 stars 218 forks source link

TileLayout + Dialog break the overlay when dialog is selected #4016

Closed 99graciamanel closed 1 year ago

99graciamanel commented 1 year ago

Describe the bug When TileLayout is combined with Dialog components the overlay is broken causing components to be superposed.

To Reproduce Steps to reproduce the behavior:

  1. Find an example in https://codesandbox.io/s/suspicious-banzai-pug013?file=/src/app/app.component.ts

Expected behavior Both components have to work independently. Dialog overlay should be in front of TileLayouts.

Screenshots

When clicking Sofia button:

image

When clicking Rome button:

image

dtopalov commented 1 year ago

Hi @99graciamanel,

The issue is caused by the fact that the Dialog is created within the TileLayout Item which it is opened from. To ensure the Dialog overlay covers the whole page, please place the Dialog outside of the TileLayout rendering. Dynamic content can be achieved by storing the item the Dialog is opened from, for example:

https://codesandbox.io/s/goofy-ptolemy-x4d099

This repository is for bug reports only. If you need any further assistance with a specific scenario implementation or setup, please use our support system.