vi-ilo/apps/vdn-static/src/components/molecules/DiscordRuleOverview.vue

36 lines
959 B
Vue

<script setup lang="ts">
import type { Locale } from "@/i18n/locale";
import SmartLink from "../atoms/SmartLink.vue";
import type { Value } from "@/utils/types";
import RichTemplate from "../atoms/RichTemplate.vue";
import type { CompileLocale } from "@/i18n";
import type { DeepReadonly } from "vue";
defineProps<{
overview: DeepReadonly<
Value<
CompileLocale<Locale>["discord"]["rulesPage"]["rules"]
>["overview"]
>;
ruleNumber: number;
}>();
</script>
<template>
<span>
<SmartLink
covert
:to="{ type: 'internal', internal: { id: `rule-${ruleNumber}` } }"
:style="{ width: 'fit-content', display: 'inline-block' }">
<li :style="{ width: 'fit-content' }">
<RichTemplate :template="overview.text" />
<ul v-if="overview.subtext !== null" class="mt-0 w-fit">
<RichTemplate
tag="li"
:style="{ width: 'fit-content' }"
:template="overview.subtext" />
</ul>
</li>
</SmartLink>
</span>
</template>