<script lang="ts" setup>
defineProps<{
  content: string
}>()
</script>

<template>
  <div
    class="markdown-body"
    v-html="$mdRender.render(content)"
  />
</template>

<style lang="scss">
.markdown-body {
  font-family: "LXGW WenKai", sans-serif;

  .MathJax {
    display: inline-block;

    svg {
      margin: 0 auto;
    }
  }

  table {
    overflow-x: auto; /* X 轴允许滚动 */
    overflow-y: visible; /* Y 轴完全显示 */
    white-space: nowrap; /* 防止表格内容换行 */

    /* 隐藏滚动条 */
    &::-webkit-scrollbar {
      display: none; /* Chrome, Safari */
    }
    -ms-overflow-style: none; /* IE 10+ */
    scrollbar-width: none; /* Firefox */
  }
}
</style>
