feat: add structured multi-transform

This commit is contained in:
2026-08-03 02:38:09 -04:00
parent ac1dbc2aea
commit b09c5aaf34
12 changed files with 311 additions and 29 deletions

View File

@@ -406,4 +406,17 @@ button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px s
.property-placement-grid { display: grid; grid-template-columns: 42px repeat(3, minmax(0, 1fr)); gap: 4px; margin-top: 6px; align-items: center; }
.property-placement-grid span { color: var(--text-muted); font-size: 10px; }
.property-placement-grid input, .property-vector input { min-width: 0; width: 100%; height: 24px; border: 1px solid var(--line); background: var(--bg-soft); color: var(--text); padding: 2px 4px; }
.multi-transform-editor { width: 100%; display: grid; gap: 7px; margin-bottom: 12px; }
.multi-transform-step { width: 100%; border: 1px solid var(--line); border-radius: 4px; background: var(--bg-soft); padding: 7px; }
.multi-transform-step-head { display: grid; grid-template-columns: minmax(42px, 1fr) minmax(82px, 1.4fr) 24px; gap: 5px; align-items: center; color: var(--text-muted); font-size: 10px; }
.multi-transform-step-head select, .multi-transform-fields input, .multi-transform-fields select { min-width: 0; width: 100%; height: 25px; border: 1px solid var(--line); border-radius: 3px; background: var(--bg-raised); color: var(--text); padding: 0 5px; font-size: 10px; }
.multi-transform-remove { width: 24px; height: 24px; display: grid; place-items: center; border: 0; border-radius: 3px; background: transparent; color: var(--text-muted); cursor: pointer; }
.multi-transform-remove:hover:not(:disabled) { color: var(--red); background: var(--red-soft); }
.multi-transform-remove:disabled { opacity: .35; cursor: default; }
.multi-transform-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin-top: 7px; }
.multi-transform-fields-single { grid-template-columns: minmax(0, 1fr); }
.multi-transform-fields label { min-width: 0; display: grid; gap: 3px; color: var(--text-muted); font-size: 9px; }
.multi-transform-add { width: 100%; height: 28px; display: flex; align-items: center; justify-content: center; gap: 5px; border: 1px dashed var(--line); border-radius: 3px; background: transparent; color: var(--text-soft); font-size: 10px; cursor: pointer; }
.multi-transform-add:hover:not(:disabled) { border-color: var(--cyan); color: var(--cyan); }
.multi-transform-add:disabled { opacity: .4; cursor: default; }
.property-vector { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; width: 100%; }