When using nested sidebars (one sidebar opened within another), the overlay of the second sidebar does not block the content of the first (underlying) sidebar.
The expected behavior is that the overlay of the second sidebar should block the content of the first sidebar.
Open the first sidebar in your Angular application.
While the first sidebar is open, open a second within the first.
Observe that the overlay of the second sidebar DOES NOT block the content of the first sidebar.
Expected behavior
The second sidebar's overlay should block the content of the first sidebar.
Describe the bug
When using nested sidebars (one sidebar opened within another), the overlay of the second sidebar does not block the content of the first (underlying) sidebar.
The expected behavior is that the overlay of the second sidebar should block the content of the first sidebar.
https://github.com/user-attachments/assets/5cef8e4a-4a2e-4acf-96ee-9d248b08b08b
Environment
Angular Version: 18.2.2 PrimeNG Version: 17.18.9 Browser: Chrome Operating System: Windows
Reproducer
https://stackblitz.com/edit/sgvhsn?file=src%2Fapp%2Fsidebar-basic-demo.html
Angular version
18.2.2
PrimeNG version
17.18.9
Build / Runtime
Angular CLI App
Language
TypeScript
Node version (for AoT issues node --version)
18.20.4
Browser(s)
Chrome (latest)
Steps to reproduce the behavior
Open the first sidebar in your Angular application. While the first sidebar is open, open a second within the first. Observe that the overlay of the second sidebar DOES NOT block the content of the first sidebar.
Expected behavior
The second sidebar's overlay should block the content of the first sidebar.