diff --git a/studio-frontend/src/app/anim-timeline.element.scss b/studio-frontend/src/app/anim-timeline.element.scss index c866c93..b1831c4 100644 --- a/studio-frontend/src/app/anim-timeline.element.scss +++ b/studio-frontend/src/app/anim-timeline.element.scss @@ -31,6 +31,14 @@ width: 100%; z-index: 1; } + + .timeline-nav-dragger { + grid-row: 1 / span 1; + grid-column: 1 / span 1; + background: #000; + opacity: 0.1; + height: 1.5em; + } } .hash { diff --git a/studio-frontend/src/app/anim-timeline.element.ts b/studio-frontend/src/app/anim-timeline.element.ts index 33fbd18..1b0683f 100644 --- a/studio-frontend/src/app/anim-timeline.element.ts +++ b/studio-frontend/src/app/anim-timeline.element.ts @@ -64,7 +64,7 @@ export class AnimTimelineElement extends LitElement { @property({ type: Number }) clipStart = 0; /** The time (in seconds) at the end of the clip */ @property({ type: Number }) clipEnd = 5; - /** The time (in seconds) at the end of the clip */ + /** The number of frames per second for this animation clip */ @property({ type: Number }) clipFps = 24; /** The time (in seconds) of the current play-head position */ @@ -130,8 +130,6 @@ export class AnimTimelineElement extends LitElement { this.zoomTimeline(event.clientX, event.deltaY); } else if (event.deltaX) { this.pan(-event.deltaX); - } else if (event.shiftKey && event.deltaY) { - this.pan(-event.deltaY); } } @@ -354,15 +352,16 @@ export class AnimTimelineElement extends LitElement { move: this.onMidDrag, end: this.onMidDragEnd, })} + tabindex="-1" + > +