Dashboard / Layers & selection

Layers & selection

A screen is things inside things. These are the gestures for reaching the one you mean without hunting for it.

Selecting on the canvas

A click picks the largest meaningful thing under the pointer — the plan card, not the price inside it. Click again in the same place and you go one level in. Keep clicking and you walk all the way down: the section, the card, the row, the price.

The Layers panel

The same tree, as a list. Containers are named and weighted more heavily than the content inside them, and anything a user can interact with — something tappable, selectable, a field — is tinted, so the panel answers “what can be touched on this screen” at a glance.

• Double-click a row to name it. A name you choose shows upright; a name the editor derived from the contents shows in italics.
• Hover a row for its ＋, duplicate and delete.
• The number on the right is how many things are inside — worth knowing before you open it.

Moving things

Drag a row. While you drag, the panel draws where it will land: a line between two rows means it goes there; a ring around a container means it goes inside. Hold over a closed container for a moment and it opens so you can drop into a specific spot.

Copy, cut, paste

Select a layer and ⌘C, ⌘X, ⌘V. Paste follows the same rule the library does: inside a selected container, after a selected element, or at the end of the screen.

This works across screens and across flows. A plan card you designed once can be copied, another flow opened, and pasted — its copy and the variables it writes to come with it, in every language the source had.

Everything else

Back to the editor →