Drag timeline rows into symbols, into groups, and back out

A node's row can be dragged onto an instance's row, to go inside the symbol
it places; onto any other node's row, to be grouped with it into a new
symbol; or onto empty label space, to come back to the top of the open
symbol. All three keep the picture and the timing as they are, and a refused
move says why in the status line. Pool drop targets now only take things out
of the pool, and row drags set a move effect so the browser delivers the drop.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Olive Vaughn 2026-09-29 13:50:34 -04:00
parent eafbe6c4d2
commit 490460bf45
5 changed files with 134 additions and 22 deletions

View file

@ -615,6 +615,10 @@ input[type="range"] { width: 100%; accent-color: var(--sel); }
/* The preview row of a drop in flight: its own length, where it would start. */
.tl-span.ghost, .tl-label.ghost { pointer-events: none; }
/* A row being dragged over another: into an instance, or grouped with a node. */
.tl-label.drop-into { box-shadow: inset 0 0 0 2px var(--sel); background: var(--sel-bg); }
.tl-label.drop-group { box-shadow: inset 0 -2px 0 var(--sel); }
.tl-span.ghost {
background: transparent;
border: 1px dashed var(--sel);