Jakub Zych
c408eeb2ca
- index and category pages paginate with ?page=N and 404 out of range - category content renders above the list through the html gate - related posts fall back to the latest posts - --journal-* tokens and neutral base styles - pl/en strings registered only for locales the app enables
27 lines
1.3 KiB
Vue
27 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
// One post in a listing: image, title link, date and excerpt.
|
|
import type { JournalPost } from '../../utils/types.ts'
|
|
import { formatJournalDate } from '../../utils/view.ts'
|
|
|
|
const props = defineProps<{ post: JournalPost }>()
|
|
const { localeProperties } = useI18n()
|
|
const links = useJournalLinks()
|
|
const href = computed(() => links.postLink(props.post.slug))
|
|
const date = computed(() => formatJournalDate(props.post.published_at, localeProperties.value.language ?? 'en'))
|
|
</script>
|
|
|
|
<template>
|
|
<article class="journal-post-card">
|
|
<NuxtLink v-if="href && post.featured_image_url" :to="href" class="journal-post-card__image" tabindex="-1" aria-hidden="true">
|
|
<JournalFeaturedImage :src="post.featured_image_url" :alt="post.title" />
|
|
</NuxtLink>
|
|
<h2 class="journal-post-card__title">
|
|
<NuxtLink v-if="href" :to="href">{{ post.title }}</NuxtLink>
|
|
<template v-else>{{ post.title }}</template>
|
|
</h2>
|
|
<time v-if="date" class="journal-post-card__date" :datetime="post.published_at ?? undefined">{{ date }}</time>
|
|
<p v-if="post.excerpt" class="journal-post-card__excerpt">{{ post.excerpt }}</p>
|
|
<NuxtLink v-if="href" :to="href" class="journal-post-card__more">{{ $t('journal.readMore') }}</NuxtLink>
|
|
</article>
|
|
</template>
|