게시물 목록 카드 썸네일 생성 추가

components/site/PostCard.vue

@@ -14,6 +14,7 @@ defineProps({
         :to="post.to"
         :title="post.title"
         :featured-image="post.featuredImage"
+        :thumbnail-image="post.featuredImageThumbnail"
         link-class="h-20 w-36 shrink-0"
         aspect-class="h-full w-full"
       />

components/site/PostCardMedia.vue

@@ -1,5 +1,5 @@
 <script setup>
-defineProps({
+const props = defineProps({
   /** 게시물 링크 */
   to: {
     type: String,
@@ -15,6 +15,11 @@ defineProps({
     type: String,
     default: ''
   },
+  /** 목록 표시용 대표 이미지 썸네일 URL */
+  thumbnailImage: {
+    type: String,
+    default: ''
+  },
   /** 썸네일 비율·크기 Tailwind 클래스 */
   aspectClass: {
     type: String,
@@ -31,6 +36,8 @@ defineProps({
     default: ''
   }
 })
+
+const displayImage = computed(() => props.thumbnailImage || props.featuredImage)
 </script>
 
 <template>
@@ -42,10 +49,10 @@ defineProps({
   >
     <figure class="post-card-media__figure overflow-hidden rounded-[10px]">
       <img
-        v-if="featuredImage"
+        v-if="displayImage"
         class="post-card-media__image w-full rounded-[inherit] object-cover transition-opacity duration-200 group-hover:opacity-90"
         :class="[aspectClass, imageClass]"
-        :src="featuredImage"
+        :src="displayImage"
         :alt="title"
         loading="lazy"
       >