Post.vue 667 B

12345678910111213141516171819202122232425262728
  1. <template>
  2. <div class="flex flex-col gap-2 text-foreground bg-background-100 rounded-lg overflow-hidden">
  3. <img :src="image" :alt="title" class="h-[170px] object-cover object-center" >
  4. <span class="px-2 leading-none text-xl font-semibold">
  5. {{ title }}
  6. </span>
  7. <span class="px-2 font-medium">
  8. {{ description }}
  9. </span>
  10. <span class="w-full text-right -mt-2 px-2 pb-2 text-sm font-medium opacity-50">
  11. {{ date }}
  12. </span>
  13. </div>
  14. </template>
  15. <script setup lang="ts">
  16. const props = withDefaults(
  17. defineProps<{
  18. image?: string,
  19. title?: string,
  20. description?: string
  21. date?: string
  22. }>(), {
  23. }
  24. );
  25. </script>