migrate to vite

src/views/Main/AppDiagnosticInfo.vue

@@ -2,7 +2,7 @@
   <div id="app-info-container">
     <img
       id="app-info-icon"
-      :src="require('@/assets/images/info.svg')"
+      src="~@/assets/images/info.svg"
       @click="$modal.show('app-info')"
     />
     <modal
@@ -31,6 +31,7 @@
 
 <script>
 import CloseIcon from '@/components/svg/close'
+import { version } from '../../../package.json'
 
 export default {
   name: 'AppDiagnosticInfo',
@@ -40,7 +41,7 @@ export default {
       info: [
         {
           name: 'sqliteviz version',
-          info: [require('../../../package.json').version]
+          info: [version]
         }
       ]
     }

src/views/Main/Inquiries/index.vue

@@ -119,7 +119,7 @@
   </div>
 
   <!--Rename Inquiry dialog  -->
-  <modal modal-id="rename" class="dialog">
+  <modal modal-id="rename" class="dialog" content-style="width: 560px;">
     <div class="dialog-header">
       Rename inquiry
       <close-icon @click="$modal.hide('rename')"/>
@@ -139,7 +139,7 @@
   </modal>
 
   <!--Delete Inquiry dialog  -->
-  <modal modal-id="delete" class="dialog">
+  <modal modal-id="delete" class="dialog" content-style="width: 480px;">
     <div class="dialog-header">
       Delete {{ deleteGroup ? 'inquiries' : 'inquiry' }}
       <close-icon @click="$modal.hide('delete')"/>
@@ -147,7 +147,7 @@
     <div class="dialog-body">
       {{ deleteDialogMsg }}
       <div v-show="selectedInquiriesCount > selectedNotPredefinedCount" id="note">
-        <img :src="require('@/assets/images/info.svg')">
+        <img src="~@/assets/images/info.svg">
         Note: Predefined inquiries you've selected won't be deleted
       </div>
     </div>

src/views/Main/MainMenu.vue

@@ -2,7 +2,7 @@
   <nav>
     <div id="nav-links">
       <a href="https://sqliteviz.com">
-        <img :src="require('@/assets/images/logo_simple.svg')">
+        <img src="~@/assets/images/logo_simple.svg">
       </a>
       <router-link to="/workspace">Workspace</router-link>
       <router-link to="/inquiries">Inquiries</router-link>
@@ -29,14 +29,14 @@
     </div>
 
     <!--Save Inquiry dialog  -->
-    <modal modal-id="save" class="dialog">
+    <modal modal-id="save" class="dialog" content-style="width: 560px;">
       <div class="dialog-header">
         Save inquiry
         <close-icon @click="cancelSave"/>
       </div>
       <div class="dialog-body">
         <div v-show="isPredefined" id="save-note">
-          <img :src="require('@/assets/images/info.svg')">
+          <img src="~@/assets/images/info.svg">
           Note: Predefined inquiries can't be edited.
           That's why your modifications will be saved as a new inquiry. Enter the name for it.
         </div>

src/views/Main/Workspace/Tabs/index.vue

@@ -29,7 +29,7 @@
     </div>
 
     <!--Close tab warning dialog  -->
-    <modal modal-id="close-warn" class="dialog">
+    <modal modal-id="close-warn" class="dialog" content-style="width: 560px;">
       <div class="dialog-header">
         Close tab {{
           closingTab !== null
@@ -49,7 +49,7 @@
         <button class="secondary" @click="closeTab(closingTab)">
           Close without saving
         </button>
-        <button class="secondary" @click="$modal.hide('close-warn')">Cancel</button>
+        <button class="secondary" @click="$modal.hide('close-warn')">Don't close</button>
         <button class="primary" @click="saveAndClose(closingTab)">Save and close</button>
       </div>
     </modal>