---
interface Props {
    title: string;
    description: string;
    published?: Date;
    path: string;
}

const { title, description, published, path } = Astro.props;
---

<a href={path} class="nostyle">
    <div class="card">
        <h3>{title}</h3>
        <p>{description}</p>
    </div>
</a>

<style lang="scss">
.card {
    border: 1px solid gray;
    border-radius: 1em;
    max-width: 350px;
    margin: 1rem auto;
    transition: box-shadow 0.1s ease-in-out;
    cursor: pointer;
    padding: 10px;
    margin: 5px;

    &:hover {
        box-shadow: 0px 0px 10px var(--blog_color);
    }
}

h3 {
    font-size: 120%;
    font-weight: bold;
}
</style>