Dialogs and Vuetify styling changes

src/components/AudioLayout.vue

@@ -70,9 +70,8 @@
     <div class="load-later">
       <div style="align-self: flex-end;">
         <v-btn class="clap-button clickable" text elevation="0" v-blur @click.stop="clapButtonClicked()">👏</v-btn>
-        <v-btn :class="{'mic-button': true, 'dimmed': !canRecordAudio}" ref="mic_button" fab small elevation="0" v-blur
+        <v-btn icon="mic" :class="{'mic-button': true, 'dimmed': !canRecordAudio}" ref="mic_button" theme="dark" size="small" elevation="0" v-blur
           @click.stop="micButtonClicked()">
-          <v-icon color="white">mic</v-icon>
         </v-btn>
       </div>
       <v-icon class="clickable" @click="loadNext" color="white" size="28">expand_more</v-icon>
@@ -92,6 +91,7 @@ import emitter from 'tiny-emitter/instance';
 export default {
   mixins: [messageMixin],
   components: { AuthedImage },
+  emits: ['mark-read','loadprevious','loadnext','start-recording','sendclap'],
   props: {
     autoplay: {
       type: Boolean,