diff options
| author | lonkaars <loek@pipeframe.xyz> | 2021-05-23 21:05:46 +0200 |
|---|---|---|
| committer | lonkaars <loek@pipeframe.xyz> | 2021-05-23 21:05:46 +0200 |
| commit | 221efd26e676ca86aa6f9058d7f7d082e1b87e94 (patch) | |
| tree | 1bc1b3329e94d5a2bfebebb30c6ae179b84d5a98 /styles/keyframes.css | |
| parent | 1374c9b56288bb2ec019f5e7b6b6a8d66c2c3f5f (diff) | |
loop drag start/end hitbox larger
Diffstat (limited to 'styles/keyframes.css')
| -rw-r--r-- | styles/keyframes.css | 34 |
1 files changed, 30 insertions, 4 deletions
diff --git a/styles/keyframes.css b/styles/keyframes.css index 750c7ba..c02698f 100644 --- a/styles/keyframes.css +++ b/styles/keyframes.css @@ -1,17 +1,43 @@ +.appGrid .timeline .keyframes .frame .keyframeWrapper { + --keyframe-color: var(--gruble); + color: var(--keyframe-color); + line-height: 0; + top: 44px; + width: 24px; + height: 24px; +} + +.appGrid .timeline .keyframes .frame .keyframeWrapper.current { color: var(--piss); } +.appGrid .timeline .keyframes .frame .keyframeWrapper.current .loop .connector { background-color: var(--piss); } +.appGrid .timeline .keyframes .frame .keyframeWrapper , +.appGrid .timeline .keyframes .frame .keyframeWrapper .loop .connector { + transition-property: color, background-color; + transition-duration: .2s; +} + +.timeline .keyframes .frame .keyframeWrapper { cursor: grab; } +.timeline .keyframes .frame .keyframeWrapper:active { cursor: grabbing; } + .loop .connector { height: 16px; - background-color: var(--gruble); + background-color: var(--keyframe-color); opacity: .25; - width: calc(100% - 26px); - margin: 4px -11px; + inset: 4px 13px; + position: absolute; } .loop { - width: calc((var(--frame) - var(--begin)) * var(--zoom) * 1px + 24px); position: absolute; + width: calc((var(--frame) - var(--begin)) * var(--zoom) * 1px + 24px); + height: 24px; right: 0; } +.loop .start, +.loop .end { + z-index: 1; +} + .keyframe > * { fill: currentColor; } |