Protofy-xyz / Protofy

AI Supercharged LowCode Platform CMS and Framework 🚀🚀
https://protofy.xyz/
MIT License
235 stars 49 forks source link

You can't select header (blue box) in some elements while visually editing a page #10

Closed theG3n15 closed 9 months ago

theG3n15 commented 9 months ago

Expected Behavior

You should be able to select the header of any component while visually editing the page.

Current Behavior

When trying to select the header, the top component gets selected instead of the header

Steps to Reproduce

  1. Login as admin
  2. Navigate to a page
  3. Click top right pencil icon to edit page
  4. Try to select the header (blue bounding box) of a component

Context (Environment)

Default setup OS: MacOS, Windows 11 Browser: Chrome

Issue demo

https://github.com/Protofy-xyz/Protofy/assets/110179160/f0c57a5d-66fc-4049-8e15-cb81cdef0707

gdomenech98 commented 9 months ago

Fixes "zi" utility prop to prevent blue box to be behind elevated area. Video that proves the error:

BEFORE SOLVED BEHAVIOUR ❌

https://github.com/Protofy-xyz/Protofy/assets/108338080/d5ad3098-0249-4083-a622-d22570f933b6

SOVED BEHAVIOUR ✅

https://github.com/Protofy-xyz/Protofy/assets/108338080/00e30a2b-a30c-427e-b366-af9372de75f8