changes

app/components/media/FileShow.vue

@@ -1,7 +1,7 @@
 <template>
   <p
-    class="py-1 border-bottom"
     v-for="(v, i) in vfiles"
+    class="py-1"
   >
     <a
       class="mr-4"
@@ -12,34 +12,44 @@
       class="mr-4"
       @click="download(v, i)"
     >
-      <SvgIcon v-bind="{ name: 'download1.svg', type: 'dark', size: 16 }"></SvgIcon>
+      <span class="icon">
+        <Icon
+          name="material-symbols:download-rounded"
+          :size="18"
+        />
+      </span>
     </a>
     <a
+      v-if="show?.delete"
       @click="remove(v, i)"
-      v-if="show ? show.delete : false"
     >
-      <SvgIcon v-bind="{ name: 'bin1.svg', type: 'dark', size: 16 }"></SvgIcon>
+      <span class="icon">
+        <Icon
+          name="material-symbols:delete-outline-rounded"
+          :size="18"
+        />
+      </span>
     </a>
   </p>
   <Modal
-    @close="showmodal = undefined"
-    v-bind="showmodal"
     v-if="showmodal"
-  ></Modal>
+    v-bind="showmodal"
+    @close="showmodal = undefined"
+  />
 </template>
 <script setup>
 const { $copy, $getpath, $download } = useNuxtApp();
 const emit = defineEmits(["remove", "close"]);
-var props = defineProps({
+const props = defineProps({
   files: Object,
   show: Object,
 });
-var showmodal = ref();
-var vfiles = ref($copy(props.files));
+const showmodal = ref();
+const vfiles = ref($copy(props.files));
 function remove(v, i) {
   vfiles.value.splice(i, 1);
-  emit("remove", { v: v, i: i });
-  emit("modalevent", { name: "removefile", data: { v: v, i: i } });
+  emit("remove", { v, i });
+  emit("modalevent", { name: "removefile", data: { v, i } });
   if (vfiles.value.length === 0) emit("close");
 }
 function open(v) {
@@ -62,7 +72,7 @@ function download(v) {
 }
 watch(
   () => props.files,
-  (newVal, oldVal) => {
+  () => {
     vfiles.value = props.files;
   },
 );