DeCentN2Madness
a163ff98c9
- relocate header, footer, nav, hero, and page-hero styles into their owning components - move blog index, blog post, team, video, insurance, CTA, and home-section styles out of the global sheet - keep focused on shared primitives such as buttons, cards, links, and list styling - preserve existing layout and responsive behavior while reducing global CSS scope
21 lines
1.1 KiB
Plaintext
21 lines
1.1 KiB
Plaintext
---
|
|
const { post, prefix = '' } = Astro.props;
|
|
const href = `${prefix}/library/${post.data.slug}`.replace('//', '/');
|
|
const readMore = { en: 'Read More', es: 'Leer Más', ar: 'اقرأ المزيد' }[post.data.lang] || 'Read More';
|
|
---
|
|
<article class="card blog-card">
|
|
{post.data.featuredImage && <a href={href}><img src={post.data.featuredImage} alt={post.data.alt || ''} loading="lazy" /></a>}
|
|
<div class="card-body">
|
|
<div class="blog-card-meta"><img src="/assets/images/rula-diab-avatar.jpg" alt="" /><p>Rula Diab, Clinical Director, M.Ed, BCBA, LBA<br /><time datetime={post.data.date.toISOString()}>{post.data.date.toLocaleDateString(post.data.lang, { day: 'numeric', month: 'long', year: 'numeric' })}</time></p></div>
|
|
<h3><a href={href}>{post.data.title}</a></h3>
|
|
<p>{post.data.description}</p>
|
|
<a class="text-link" href={href}>{readMore}</a>
|
|
</div>
|
|
</article>
|
|
|
|
<style>
|
|
.blog-card-meta { align-items: center; display: flex; font-size: .78rem; gap: .75rem; }
|
|
.blog-card-meta img { aspect-ratio: 1; border-radius: 50%; height: 42px; width: 42px; }
|
|
.blog-card h3 { font-size: 1.35rem; }
|
|
</style>
|