- JournalPostCard: the title link is the card's only anchor; the image is no longer a link and the separate read-more link is gone; the whole card stays clickable through a CSS stretched link with the focus ring on the card; prop headingLevel (2 | 3, default 2) - related posts keep their h2 and render their cards at h3; JournalPostList passes headingLevel through - smoke checks headings=strict (one h1, no skipped level) and cardlinks=N on every fixture page; expectation files for postTitleTag forced to h1 and p (the documented two-h1 and no-h1 consequences) BREAKING CHANGE: .journal-post-card__more and the image link (.journal-post-card__image is now a div) are removed from post cards.
15 lines
595 B
Vue
15 lines
595 B
Vue
<script setup lang="ts">
|
|
// A grid of post cards, or the empty-state text when there are none.
|
|
// headingLevel goes to every card (3 under the related posts' h2).
|
|
import type { JournalPost } from '../../utils/types.ts'
|
|
|
|
defineProps<{ posts: JournalPost[]; empty?: string; headingLevel?: 2 | 3 }>()
|
|
</script>
|
|
|
|
<template>
|
|
<div class="journal-post-list">
|
|
<JournalPostCard v-for="post in posts" :key="post.id" :post="post" :heading-level="headingLevel ?? 2" />
|
|
<p v-if="posts.length === 0" class="journal-post-list__empty">{{ empty ?? $t('journal.index.empty') }}</p>
|
|
</div>
|
|
</template>
|