Use nuxtjs/mdc to render descriptions

website/app/components/LibrarySelect.vue

@@ -44,6 +44,7 @@ const onLibrarySelectChange = async () => {
         method: 'POST',
         path: { MangaId: props.mangaId, LibraryId: library.value },
     });
+    await refreshNuxtData(FetchKeys.Manga.Id(props.mangaId));
     loading.value = false;
 };
 </script>

website/app/components/MangaCard.vue

@@ -23,7 +23,6 @@
             </div>
             <div class="flex flex-col h-(--mangacover-height) shrink mx-2 mt-4">
                 <p class="font-semibold text-xl">{{ manga.name }}</p>
-                <p class="max-h-30 overflow-y-hidden grow">{{ manga.description }}</p>
             </div>
         </div>
         <div class="absolute bottom-0 w-full p-2 flex flex-row justify-end">

website/app/components/MangaDetailPage.vue

@@ -17,9 +17,7 @@
                     </NuxtLink>
                 </div>
                 <USkeleton v-else class="w-full h-lh" />
-                <p v-if="manga" class="max-h-30 overflow-y-hidden grow">
-                    {{ manga.description }}
-                </p>
+                <MDC v-if="manga" :value="manga.description" class="min-h-lh grow" />
                 <USkeleton v-else class="w-full h-30" />
             </div>
         </template>