From 5062518d16158a0ebd63e0f96eaabf3abfb8bedb Mon Sep 17 00:00:00 2001
From: Eric Rosenbaum <eric.rosenbaum@gmail.com>
Date: Tue, 16 Jul 2019 16:41:36 -0400
Subject: [PATCH] Fix playhead CSS
---
src/components/audio-trimmer/audio-selector.jsx | 2 +-
src/components/audio-trimmer/audio-trimmer.css | 2 +-
src/components/audio-trimmer/playhead.jsx | 2 +-
3 files changed, 3 insertions(+), 3 deletions(-)
diff --git a/src/components/audio-trimmer/audio-selector.jsx b/src/components/audio-trimmer/audio-selector.jsx
index 3a7692216..a7c0b41c2 100644
--- a/src/components/audio-trimmer/audio-selector.jsx
+++ b/src/components/audio-trimmer/audio-selector.jsx
@@ -15,7 +15,7 @@ const AudioSelector = props => (
>
{props.trimStart === null ? null : (
<Box
- className={classNames(styles.absolute, styles.trimBackground, styles.startTrimBackground)}
+ className={classNames(styles.absolute)}
style={{
left: `${props.trimStart * 100}%`,
width: `${100 * (props.trimEnd - props.trimStart)}%`
diff --git a/src/components/audio-trimmer/audio-trimmer.css b/src/components/audio-trimmer/audio-trimmer.css
index ce7d60213..701b24eff 100644
--- a/src/components/audio-trimmer/audio-trimmer.css
+++ b/src/components/audio-trimmer/audio-trimmer.css
@@ -40,7 +40,6 @@ $hover-scale: 2;
}
.selection-background {
- border: 1px solid $motion-tertiary;
background: $motion-primary;
opacity: 0.5;
}
@@ -82,6 +81,7 @@ $hover-scale: 2;
so that we can use transform: translateX() using percentages.
*/
width: 100%;
+ height: 100%;
border-left: 1px solid $motion-primary;
border-top: none;
border-bottom: none;
diff --git a/src/components/audio-trimmer/playhead.jsx b/src/components/audio-trimmer/playhead.jsx
index 5b3adddd6..be5423809 100644
--- a/src/components/audio-trimmer/playhead.jsx
+++ b/src/components/audio-trimmer/playhead.jsx
@@ -6,7 +6,7 @@ import styles from './audio-trimmer.css';
const Playhead = props => (
<div className={styles.playheadContainer}>
<div
- className={classNames(styles.trimLine, styles.playhead)}
+ className={classNames(styles.playhead)}
style={{
transform: `translateX(${100 * props.playbackPosition}%)`
}}
--
GitLab