working on switching to overlays instead of dialogs?

src/components/AddNote.vue

@@ -1,4 +1,5 @@
 <template>
+    <v-container>
     <v-card title="Add Comment">
         <v-card-text>
             <p>Add new comment for : {{ customer.acc_no }} - {{ customer.name }}</p>
@@ -11,6 +12,7 @@
         </v-card-actions>
 
     </v-card>
+    </v-container>
 </template>
 <script>
 import axios from 'axios'

src/components/CustomerComments.vue

@@ -20,9 +20,9 @@
             </v-list>
         </v-card-text>
     </v-card>
-    <v-dialog v-model="dialog[0]">
+    <v-overlay v-model="dialog[0]" contained class="align-center justify-center">
         <AddNote :customer="customer" @return="closeAddNote"></AddNote>
-    </v-dialog>
+    </v-overlay>
 </template>
 <script>
 import Customer from '@/types/CustomerType.vue'