<script setup lang="ts">
interface BlogItemProps {
  url: string;
  title: string;
  date: string;
  excerpt: string;
}

const props = defineProps<BlogItemProps>();
</script>

<template>
  <div class="card card-lift card-gradient-border">
    <div class="card-content">
      <div class="card-header">
        <h2 class="card-title">
          <a :href="props.url">
            {{ props.title }}
          </a>
        </h2>
        <span class="card-meta">{{ props.date }}</span>
      </div>
      <div v-if="props.excerpt" v-html="props.excerpt"></div>
    </div>
  </div>
</template>

<style scoped></style>
