Refactor code structure for improved readability and maintainability

components/DraggableWindow.vue

@@ -66,7 +66,7 @@ const stopDrag = () => {
       width: props.width || '400px',
       height: props.height || '300px',
     }"
-    class="fixed bg-white dark:bg-gray-800 rounded-md shadow-lg overflow-hidden flex flex-col shadow-lg shadow-xl/30"
+    class="fixed bg-white dark:bg-gray-800 rounded-xl shadow-lg overflow-hidden flex flex-col shadow-lg shadow-xl/30"
   >
     <div
       @mousedown="startDrag"

components/app/windows/about.vue

@@ -1,3 +1,6 @@
+<script setup lang="ts">
+import copyrightInfo from "~/components/app/info/copyright.vue";
+</script>
 <template>
   <div class="justify-center align-center text-center flex flex-col">
     <div class="flex flex-col">
@@ -21,5 +24,10 @@
         ></span
       >
     </div>
+    <hr/>
+    <div class="flex flex-col">
+        <span class="text-xl">版權資訊</span>
+        <copyrightInfo />
+    </div>
   </div>
 </template>

components/app/windows/aboutNewsOrg.vue

@@ -44,9 +44,9 @@ onMounted(() => {
       <div
         class="flex flex-row bg-[#AAACAAFF] rounded-3xl p-3 gap-3 m-3 scale-5"
       >
-        <NuxtImg
+        <img
           :src="fetchNewsOrgInfo?.logoUrl"
-          class="w-48 h-48 rounded-[10px]"
+          class="w-48 h-48 rounded-l-3xl object-cover p-0 m-0"
         />
         <div class="flex flex-col gap-3 text-left">
           <h1 class="text-4xl font-bold m-3 text-left">