You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
While working on the slicing MVP, we noticed several inconsistencies with the highlighting in the left panel:
When hovering on the list and on a node in the flowchart - highlighting in the list panel is not the same width (one is longer, other is shorter)
When clicking on the list and on a node in the flowchart - highlighting in the list panel stretches to full-width (both are full-width)
When hovering and clicking on pipeline groups - On the list - hover and click has different highlight widths (one is longer, other is shorter) In the flowchart - hover and click on pipeline groups doesn't highlight in the list panel (this is a BUG)
Summary - highlight widths are inconsistent across different interactions in the list panel. There are currently 3+ different widths in the list panel, and hover and selection states also have inconsistent highlight widths.
Context
These issues should ideally be fixed before we can release the slicing MVP feature.
Suggested Implementation - New Design Updates
New design pattern for highlights in the left panel:
Now we only have 1 width (always full-width) for both hover and selection states.
Hovering on an expanded pipeline group will also highlight all it's children in the same highlight width.
Selected items will have a blue indication line on the right side, and a full-width highlight as well. Pipeline groups cannot be selected, only nodes can be selected. Clicking on a pipeline group will expand/collapse it (this is the same pattern currently and already exists).
When a child node inside a pipeline is selected - if the pipeline group is expanded, the blue line will be shown at the child level. If the pipeline group is collapsed, the blue line will be shown at the parent pipeline level to indicate something is selected within that pipeline group.
Description
While working on the slicing MVP, we noticed several inconsistencies with the highlighting in the left panel:
On the list - hover and click has different highlight widths (one is longer, other is shorter)
In the flowchart - hover and click on pipeline groups doesn't highlight in the list panel (this is a BUG)
Summary - highlight widths are inconsistent across different interactions in the list panel. There are currently 3+ different widths in the list panel, and hover and selection states also have inconsistent highlight widths.
Context
These issues should ideally be fixed before we can release the slicing MVP feature.
Suggested Implementation - New Design Updates
New design pattern for highlights in the left panel:
More detailed examples of the different states and various options can be found here - https://www.figma.com/design/3kSpvIO1veLKfy9qHxuXwF/Kedro-WIP?node-id=1763-75495&t=yYd5EKuBdBCdDf3X-4
Any questions let me know!
The text was updated successfully, but these errors were encountered: