Overview
We can make the page hierarchy (or layers) feel more robust by adjusting the styles in a way where elements are not moving around between state changes. We should consider both focus / active styles, as well as drag and drop.
Proposed resolution
The focus / active styles most probably are just CSS changes and doesn't necessarily mean we need to change the design.
The drag and drop changes will require minor changes to the design. We can model after #3470973: Retain the placement of components within the preview when inserting a component.
User interface changes
| Comment | File | Size | Author |
|---|---|---|---|
| #7 | Screenshot 2024-09-06 at 9.34.34 AM.png | 52.39 KB | lauriii |
Issue fork experience_builder-3472243
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
wim leersIs this enough information for you to act on this, @balintbrews or @jessebaker?
Comment #3
gauravvvv commentedComment #5
gauravvvv commentedComment #6
gauravvvv commentedComment #7
lauriiiNice one @gauravvvv! I was thinking that we probably should follow the design from the preview canvas drag and drop. This means using the blue border to highlight where an element is going to be moved. Here's an example of how this could look like in the page hierarchy:
Comment #8
hooroomooClosing this issue as a duplicate because #7 makes sense to be addressed as a part of #3470594: Refine dragging behavior and design in Layers menu so the layers dragging can be holistically tested and reviewed.