2 files changed, 15 insertions, 18 deletions
diff --git a/src/components/flash/flash.js b/src/components/flash/flash.js
index d03384c7..87f940a7 100644
--- a/src/components/flash/flash.js
+++ b/src/components/flash/flash.js
@@ -39,12 +39,13 @@ const Flash = {
           this.player = 'error'
         })
         this.ruffleInstance = player
+        this.$emit('playerOpened')
       })
     },
     closePlayer () {
-      console.log(this.ruffleInstance)
-      this.ruffleInstance.remove()
+      this.ruffleInstance && this.ruffleInstance.remove()
       this.player = false
+      this.$emit('playerClosed')
     }
   }
 }
diff --git a/src/components/flash/flash.vue b/src/components/flash/flash.vue
index d20d037b..95f71950 100644
--- a/src/components/flash/flash.vue
+++ b/src/components/flash/flash.vue
@@ -36,13 +36,6 @@
         </p>
       </span>
     </button>
-    <button
-      v-if="player"
-      class="button-unstyled hider"
-      @click="closePlayer"
-    >
-      <FAIcon icon="stop" />
-    </button>
   </div>
 </template>
 
@@ -51,8 +44,9 @@
 <style lang="scss">
 @import '../../_variables.scss';
 .Flash {
+  display: inline-block;
   width: 100%;
-  height: 260px;
+  height: 100%;
   position: relative;
 
   .player {
@@ -60,6 +54,16 @@
     width: 100%;
   }
 
+  .placeholder {
+    height: 100%;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: var(--bg);
+    color: var(--link);
+  }
+
   .hider {
     top: 0;
   }
@@ -76,13 +80,5 @@
     display: none;
     visibility: 'hidden';
   }
-
-  .placeholder {
-    height: 100%;
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
 }
 </style>