Open Bug 1517043 Opened 5 years ago Updated 2 years ago

Flexbox highlighter: When hovering over the diagram or selector in the Flex Item pane, related element should be highlighted in page

Categories

(DevTools :: Inspector, enhancement, P3)

enhancement

Tracking

(Not tracked)

People

(Reporter: victoria, Unassigned)

References

(Blocks 1 open bug)

Details

Currently the Flexbox Container view does a great job of emphasizing context by displaying in-page highlights when hovering over any of the element names. 

Once you click into a Flex item however, it feels like this in-page context goes missing. I suggest that when the Flex item pane is in use, we also highlight the in-age element (box model highlight). (Originally the mockups had the flex item diagram overlaid in page, but I think the box model highlight is fine too, and maybe better because it shows margin/padding).

I think it'd be best if this highlight only shows when hovering over the name/selector or diagram, to match other behaviors and to emphasize the connection.

Bonus: When hovering the sibling names in the open selector menu, also highlight those siblings. Might be hard with the native menu?
Assignee: nobody → gl
Status: NEW → ASSIGNED
Priority: -- → P3

Unassigning due to inactivity

Assignee: gl → nobody
Status: ASSIGNED → NEW
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.