1 files changed, 10 insertions, 10 deletions

diff --git a/viewer/src/components/LdInformation.vue b/viewer/src/components/LdInformation.vue
index 66ccc80..68e1817 100644
--- a/viewer/src/components/LdInformation.vue
+++ b/viewer/src/components/LdInformation.vue
@@ -21,28 +21,28 @@
   <div v-if="item" class="flex-column" :class="$style.infopanel">
     <div v-if="item.title" :class="$style.title">{{ item.title }}</div>
     <time v-if="item.datetime" :datetime="item.datetime" :class="$style.datetime">{{ formatDate }}</time>
-    <div v-if="item.description" :class="$style.description" v-html="formatDescription" />
+    <Markdown v-if="item.description" :class="$style.description" :markdown="item.description" />
   </div>
 </template>
 
 <script lang="ts">
-import { Component, Vue, Prop } from "vue-property-decorator";
-import marked from "marked";
+import { Item } from "@/@types/gallery";
+import { Markdown } from "@/components/async";
+import { Component, Prop, Vue } from "vue-property-decorator";
 
-@Component
+@Component({
+  components: {
+    Markdown,
+  },
+})
 export default class LdInformation extends Vue {
-  @Prop({ required: true }) readonly item!: Gallery.Item;
+  @Prop({ required: true }) readonly item!: Item;
 
   get formatDate() {
     const date = this.item.datetime.substr(0, 10);
     const time = this.item.datetime.substr(11, 5);
     return `${date} ${time}`;
   }
-
-  get formatDescription() {
-    if (!this.item.description) return "";
-    return marked(this.item.description);
-  }
 }
 </script>