From d882d180a5fdcd3a94c16b866de4e395c9276b03 Mon Sep 17 00:00:00 2001
From: Eric Rosenbaum <eric.rosenbaum@gmail.com>
Date: Wed, 24 Jul 2019 11:07:10 -0400
Subject: [PATCH] Use separate play and stop icons for sound editor

---
 src/components/sound-editor/icon--play.svg   | 20 +++++++++++++++++++
 src/components/sound-editor/icon--stop.svg   | 21 ++++++++++++++++++++
 src/components/sound-editor/sound-editor.css |  1 -
 src/components/sound-editor/sound-editor.jsx |  4 ++--
 4 files changed, 43 insertions(+), 3 deletions(-)
 create mode 100644 src/components/sound-editor/icon--play.svg
 create mode 100644 src/components/sound-editor/icon--stop.svg

diff --git a/src/components/sound-editor/icon--play.svg b/src/components/sound-editor/icon--play.svg
new file mode 100644
index 000000000..817a2cab9
--- /dev/null
+++ b/src/components/sound-editor/icon--play.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="49px" height="52px" viewBox="-5 0 49 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
+    <title>play</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <path d="M17.2214651,8.34499443 C19.7766419,4.08636653 23.9234057,4.09303946 26.4745787,8.34499443 L40.1520974,31.140859 C42.7072741,35.3994869 40.7489672,38.8517869 35.7726637,38.8517869 L7.92338006,38.8517869 C2.9495089,38.8517869 0.992773429,35.392814 3.54394641,31.140859 L17.2214651,8.34499443 Z" id="path-1"></path>
+    </defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Desktop---1280x720" transform="translate(-623.000000, -347.000000)">
+            <g id="Step-3---Altering-Suggested-Trim" transform="translate(0.000000, 42.000000)">
+                <g id="Play-/-Record-/-Stop" transform="translate(623.000000, 307.000000)">
+                    <g id="play" transform="translate(21.849131, 22.002656) rotate(90.000000) translate(-21.849131, -22.002656) ">
+                        <use stroke="#FFFFFF" stroke-width="1" fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/src/components/sound-editor/icon--stop.svg b/src/components/sound-editor/icon--stop.svg
new file mode 100644
index 000000000..c960e66c3
--- /dev/null
+++ b/src/components/sound-editor/icon--stop.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="52px" height="52px" viewBox="0 0 52 52" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
+    <title>stop-playback</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <rect id="path-1" x="0" y="0" width="44" height="44" rx="4"></rect>
+    </defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Desktop---1280x720" transform="translate(-619.000000, -345.000000)">
+            <g id="Step-4---Playing-Trim" transform="translate(0.000000, 42.000000)">
+                <g id="Play-/-Record-/-Stop" transform="translate(623.000000, 307.000000)">
+                    <g id="stop-playback">
+                        <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
+                        <rect stroke="#FFFFFF" stroke-width="1" x="0.5" y="0.5" width="43" height="43" rx="4"></rect>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/src/components/sound-editor/sound-editor.css b/src/components/sound-editor/sound-editor.css
index 03cccb22e..f46bcac21 100644
--- a/src/components/sound-editor/sound-editor.css
+++ b/src/components/sound-editor/sound-editor.css
@@ -108,7 +108,6 @@ $border-radius: 0.25rem;
     flex-grow: 1;
     max-width: 100%;
     max-height: 100%;
-    filter: grayscale(1) brightness(10);
     /*min-width: 1.5rem;*/
 }
 
diff --git a/src/components/sound-editor/sound-editor.jsx b/src/components/sound-editor/sound-editor.jsx
index 761856548..b0e97a174 100644
--- a/src/components/sound-editor/sound-editor.jsx
+++ b/src/components/sound-editor/sound-editor.jsx
@@ -13,8 +13,8 @@ import IconButton from '../icon-button/icon-button.jsx';
 
 import styles from './sound-editor.css';
 
-import playIcon from '../record-modal/icon--play.svg';
-import stopIcon from '../record-modal/icon--stop-playback.svg';
+import playIcon from './icon--play.svg';
+import stopIcon from './icon--stop.svg';
 import redoIcon from './icon--redo.svg';
 import undoIcon from './icon--undo.svg';
 import fasterIcon from './icon--faster.svg';