Lightling
8ac3ed16ff
- redefine gallery types - re-implement gallery list, tile, and view - no carousel yet for variants, but WithoutVariants works when url specified
73 lines
1.5 KiB
Vue
73 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
import { computed, onMounted, ref } from 'vue'
|
|
import { marked } from 'marked'
|
|
import { getFormattedDate } from 'src/utilities/parse'
|
|
import type {
|
|
BlogEntry,
|
|
} from '@goldenwere/mackenzii-types'
|
|
|
|
const props = defineProps<{
|
|
id: string,
|
|
viewPath: string,
|
|
isInternal: boolean,
|
|
entry: Promise<BlogEntry>
|
|
}>()
|
|
|
|
const resolved = ref({} as BlogEntry)
|
|
const thumbnail = computed(() => resolved.value.thumbnail)
|
|
const description = computed(() => marked.parse(resolved.value.description || ''))
|
|
const date = computed(() => !!resolved.value.date ? getFormattedDate(resolved.value.date) : null)
|
|
const title = computed(() => marked.parse(resolved.value.title || props.id))
|
|
const href = computed(() => `${props.viewPath}?id=${props.id}`)
|
|
|
|
onMounted(async () => {
|
|
resolved.value = await props.entry
|
|
})
|
|
</script>
|
|
|
|
<template lang="pug">
|
|
mixin link
|
|
router-link.router-link.link(
|
|
v-if='isInternal'
|
|
:to='{ path: viewPath, query: { id: id } }'
|
|
)
|
|
block
|
|
a.link(
|
|
v-else
|
|
:href='href'
|
|
)
|
|
block
|
|
mixin embedText
|
|
.text
|
|
.title(
|
|
v-html='title'
|
|
)
|
|
.date(
|
|
v-if='date'
|
|
)
|
|
span {{ date }}
|
|
.blog-embed
|
|
.thumbnail-wrapper(
|
|
v-if='!!thumbnail'
|
|
)
|
|
+link
|
|
.thumbnail(
|
|
:style='thumbnail.style'
|
|
)
|
|
.text-wrapper
|
|
+link
|
|
+embedText
|
|
.description(
|
|
v-html='description'
|
|
)
|
|
</template>
|
|
|
|
<style scoped lang="sass">
|
|
.thumbnail-wrapper
|
|
.link,
|
|
.link .thumbnail
|
|
height: 100%
|
|
width: 100%
|
|
display: block
|
|
</style>
|
|
|