lowcoder-org / lowcoder

🔥 🔥 🔥 The Open Source Retool, Tooljet and Appsmith Alternative
https://www.lowcoder.cloud/
GNU Affero General Public License v3.0
915 stars 187 forks source link

[Bug]: Drawer component is not visible all the time; the Z-index property needs to be implemented #1290

Open vsnshanmuganathan opened 4 days ago

vsnshanmuganathan commented 4 days ago

Is there an existing issue for this?

Current Behavior

If we have multiple drawer components, sometimes one may be hidden behind another and not visible.

Expected Behavior

The last called Drawer component should be visible on the screen.

Steps to reproduce

I'm not a coding expert, but in WordPress, there is something called the Z-index property, which is used to stack containers on top of each other. The visibility of these containers depends on their Z-index values. I have attached the project file to reproduce this error. test.json

Environment

Lowcoder latest on Docker (2.4.12)

Additional Information

In the video below, if I open the account drawer first and then the left drawer, both of them overlap (which is fine) until I refresh the page. https://github.com/user-attachments/assets/56a6491b-066e-4e90-8fb1-30c2aecd7f79

However, if I open the left drawer first, close it, and then open the account drawer followed by the left drawer, the left drawer appears behind the account drawer, which is not what I expected. The left drawer should be above the account drawer.

https://github.com/user-attachments/assets/5b5ab71f-1a13-40db-8cf9-6a72f716d21c

vsnshanmuganathan commented 1 day ago

While solving this bug, please add a z-index to the modal component as well, because both the tabbed and modal components are overlapping and hiding each-other.