♻️ Interactive v2 #1
@ -1,31 +1,23 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<component
|
||||||
|
:is="props.brief ? RouterLink : 'div'"
|
||||||
|
:to="{ name: 'posts.details.articles', params: { alias: props.item?.alias } }"
|
||||||
|
>
|
||||||
<section v-if="!props.contentOnly" class="mb-2">
|
<section v-if="!props.contentOnly" class="mb-2">
|
||||||
<h1 class="text-lg font-bold">{{ props.item?.title }}</h1>
|
<h1 class="text-lg font-bold">{{ props.item?.title }}</h1>
|
||||||
<div class="text-sm">{{ props.item?.description }}</div>
|
<div class="text-sm">{{ props.item?.description }}</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<div v-if="props.brief" class="mt-2">
|
|
||||||
<v-btn
|
|
||||||
append-icon="mdi-arrow-right"
|
|
||||||
variant="tonal"
|
|
||||||
size="small"
|
|
||||||
rounded="sm"
|
|
||||||
:to="{ name: 'posts.details.articles', params: { alias: props.item?.alias ?? 'not-found' } }"
|
|
||||||
>
|
|
||||||
Read more
|
|
||||||
</v-btn>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<article class="prose max-w-none" v-html="parseContent(props.item?.content ?? '')" />
|
<article class="prose max-w-none" v-html="parseContent(props.item?.content ?? '')" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</component>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import dompurify from "dompurify"
|
import dompurify from "dompurify"
|
||||||
import { parse } from "marked"
|
import { parse } from "marked"
|
||||||
|
import { RouterLink } from "vue-router"
|
||||||
|
|
||||||
const props = defineProps<{ item: any; brief?: boolean; contentOnly?: boolean }>()
|
const props = defineProps<{ item: any; brief?: boolean; contentOnly?: boolean }>()
|
||||||
|
|
||||||
|
@ -1,24 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<component
|
||||||
|
:is="props.brief ? RouterLink : 'div'"
|
||||||
|
:to="{ name: 'posts.details.moments', params: { alias: props.item?.alias } }"
|
||||||
|
>
|
||||||
<article class="prose prose-moment" v-html="parseContent(props.item?.content ?? '')" />
|
<article class="prose prose-moment" v-html="parseContent(props.item?.content ?? '')" />
|
||||||
|
</component>
|
||||||
<div v-if="props.brief" class="my-1">
|
|
||||||
<v-btn
|
|
||||||
append-icon="mdi-arrow-right"
|
|
||||||
variant="tonal"
|
|
||||||
size="x-small"
|
|
||||||
rounded="sm"
|
|
||||||
:to="{ name: 'posts.details.moments', params: { alias: props.item?.alias ?? 'not-found' } }"
|
|
||||||
>
|
|
||||||
More
|
|
||||||
</v-btn>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import dompurify from "dompurify"
|
import dompurify from "dompurify"
|
||||||
import { parse } from "marked"
|
import { parse } from "marked"
|
||||||
|
import { RouterLink } from "vue-router"
|
||||||
|
|
||||||
const props = defineProps<{ item: any; brief?: boolean }>()
|
const props = defineProps<{ item: any; brief?: boolean }>()
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user