diff options
author | mehekj <mehek.jethani@gmail.com> | 2021-09-11 11:47:22 -0400 |
---|---|---|
committer | mehekj <mehek.jethani@gmail.com> | 2021-09-11 11:47:22 -0400 |
commit | 7e0a60dc39ce2ad3fc8f90197f5ade7fe5e5b112 (patch) | |
tree | 6cbb6ee859317ec7cc3c93a5cc629d290addfafb /src | |
parent | 610f197693271c8d2a80c980f9abd5e6f68ce3f5 (diff) |
fixed record buttons and trimmed marker width appearance
Diffstat (limited to 'src')
-rw-r--r-- | src/client/views/collections/CollectionStackedTimeline.tsx | 8 | ||||
-rw-r--r-- | src/client/views/nodes/AudioBox.scss | 14 |
2 files changed, 13 insertions, 9 deletions
diff --git a/src/client/views/collections/CollectionStackedTimeline.tsx b/src/client/views/collections/CollectionStackedTimeline.tsx index 51e05e278..56621d6d5 100644 --- a/src/client/views/collections/CollectionStackedTimeline.tsx +++ b/src/client/views/collections/CollectionStackedTimeline.tsx @@ -548,10 +548,14 @@ export class CollectionStackedTimeline extends CollectionSubView< ); const left = this.props.trimming ? (start / this.duration) * timelineContentWidth - : (start - this.trimStart) / this.props.trimDuration * timelineContentWidth; + : Math.max((start - this.trimStart) / this.props.trimDuration * timelineContentWidth, 0); const top = (d.level / maxLevel) * this.timelineContentHeight(); const timespan = end - start; - const width = (timespan / this.props.trimDuration) * timelineContentWidth; + let width = (timespan / this.props.trimDuration) * timelineContentWidth; + width = (!this.props.trimming && left == 0) ? + width - ((this.trimStart - start) / this.props.trimDuration * timelineContentWidth) : width; + width = (!this.props.trimming && this.trimEnd < end) ? + width - ((end - this.trimEnd) / this.props.trimDuration * timelineContentWidth) : width; const height = this.timelineContentHeight() / maxLevel return this.props.Document.hideAnchors ? null : ( <div diff --git a/src/client/views/nodes/AudioBox.scss b/src/client/views/nodes/AudioBox.scss index ac2b19fd6..0b720ef16 100644 --- a/src/client/views/nodes/AudioBox.scss +++ b/src/client/views/nodes/AudioBox.scss @@ -14,7 +14,6 @@ display: flex; width: 100%; align-items: center; - height: 100%; .audiobox-dictation { position: relative; @@ -69,25 +68,26 @@ .time { position: relative; - height: 100%; width: 100%; font-size: $large-header; text-align: center; - top: 5; } - .buttons { + .recording-buttons { position: relative; margin-top: auto; margin-bottom: auto; - width: 25px; - width: 25px; - padding: 5px; color: $dark-gray; &:hover { color: $black; } } + + .time, .recording-buttons { + display: flex; + align-items: center; + padding: 5px; + } } .audiobox-controls { |