change background loading method

app/src/components/QuestMap.vue

@@ -161,11 +161,9 @@ const edgeStyle = computed(() => {
 
 <template>
   <div class="relative bg-black w-full h-full flex">
-    <img
+    <div
-      src="../img/catelogbg.svg"
+      class="flex place-content-center w-full bg-catelogbg bg-cover bg-scroll"
-      alt="bg"
+    >
-      class="p-2 stroke-2 scale-y-120 justify-center items-center"
-    />
       <h1
         class="p-10 absolute w-fit z-2 font-mono flex flax-wrap text-xl"
         style="width: 30%; height: 6%; font-size: 3vh; color: #00ff00"
@@ -227,6 +225,7 @@ const edgeStyle = computed(() => {
         @close-intro="closeIntro"
       />
     </div>
+  </div>
 </template>
 
 <style scoped>

app/tailwind.config.ts

@@ -24,6 +24,9 @@ export default {
           DEFAULT: '#FF0000',
         },
       },
+      backgroundImage: {
+        catelogbg: "url('src/img/catelogbg.svg')",
+      },
     },
   },
   plugins: [],