Add color_cycle as standalone source type; UI polish

- color_cycle is now a top-level source type (alongside picture/static/gradient)
  with a configurable color list and cycle_speed; defaults to full rainbow spectrum
- ColorCycleColorStripSource + ColorCycleColorStripStream: smooth 30 fps interpolation
  between user-defined colors, one full cycle every 20s at speed=1.0
- Removed color_cycle animation sub-type from StaticColorStripStream
- Color cycle editor: compact horizontal swatch layout, proper module-scope fix
  (colorCycleAdd/Remove now exposed on window, DOM-synced before mutations)
- Animation enabled + Frame interpolation checkboxes use toggle-switch style
- Removed Potential FPS metric from targets and KC targets metric grids

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-20 22:14:42 +03:00
parent 872949a7e1
commit c31818a20d
14 changed files with 674 additions and 40 deletions

View File

@@ -599,3 +599,39 @@
.gradient-stop-spacer {
flex: 1;
}
/* ── Color Cycle editor ──────────────────────────────────────── */
#color-cycle-colors-list {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin-bottom: 8px;
}
.color-cycle-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
}
.color-cycle-item input[type="color"] {
width: 36px;
height: 28px;
border: 1px solid var(--border-color);
border-radius: 4px;
padding: 1px;
cursor: pointer;
background: transparent;
flex-shrink: 0;
}
.color-cycle-remove-btn {
font-size: 0.6rem;
padding: 0;
width: 36px;
height: 14px;
min-width: unset;
line-height: 1;
}