refactor: update icon usage to use mdi imports for consistency

src/views/Home.vue

@@ -48,11 +48,11 @@ v-if="resolveNewsItem(wrapped).isNew" class="ml-2" color="primary" size="x-small
                     </div>
                     <div class="d-flex ga-4 mt-3 text-caption text-medium-emphasis">
                       <div class="d-flex align-center ga-1">
-                        <v-icon size="14">mdi-folder-outline</v-icon>
+                        <v-icon size="14" :icon="mdiFolderOutline" />
                         <span>{{ resolveNewsItem(wrapped).dept }}</span>
                       </div>
                       <div class="d-flex align-center ga-1">
-                        <v-icon size="14">mdi-eye-outline</v-icon>
+                        <v-icon size="14" :icon="mdiEyeOutline" />
                         <span>{{ resolveNewsItem(wrapped).views }} 次瀏覽</span>
                       </div>
                     </div>
@@ -119,6 +119,7 @@ class="d-flex flex-column align-center ga-2 text-center py-4 px-2 quick-item" va
 </template>
 
 <script setup lang="ts">
+import { mdiEyeOutline, mdiFolderOutline } from '@mdi/js'
 import { ref } from 'vue'
 import { useMessageStore } from '@/stores/messages'
 import { useSnackbarStore } from '@/stores/snackbar'