Fix playhead CSS

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)}%`

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;

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}%)`
             }}