Add initial README.md for Astro Starter Kit: Minimal
This commit is contained in:
27
src/pages/events.astro
Normal file
27
src/pages/events.astro
Normal file
@@ -0,0 +1,27 @@
|
||||
---
|
||||
import BaseLayout from '../layouts/BaseLayout.astro';
|
||||
const events = await Astro.glob('../../content/events/*.md');
|
||||
const sortedEvents = events.sort((a, b) => new Date(b.frontmatter.date) - new Date(a.frontmatter.date));
|
||||
---
|
||||
<BaseLayout>
|
||||
<h1 class="text-3xl font-headline font-bold text-primary mt-12 text-center">Events</h1>
|
||||
<p class="mt-4 text-center">See our upcoming and past events below.</p>
|
||||
<section class="max-w-5xl mx-auto mt-8 grid grid-cols-1 md:grid-cols-2 gap-8 px-4">
|
||||
{sortedEvents.map(event => (
|
||||
<article class="card bg-base-100 shadow-lg">
|
||||
<figure>
|
||||
<img src={event.frontmatter.image} alt={event.frontmatter.title} class="w-full h-48 object-cover" />
|
||||
</figure>
|
||||
<div class="card-body">
|
||||
<div class="flex items-center gap-2 mb-2">
|
||||
<span class="badge badge-secondary">{event.frontmatter.category}</span>
|
||||
<span class="text-xs text-gray-500">{new Date(event.frontmatter.date).toLocaleDateString()}</span>
|
||||
</div>
|
||||
<h2 class="card-title text-lg font-bold">{event.frontmatter.title}</h2>
|
||||
<p class="text-sm mb-2">{event.frontmatter.description}</p>
|
||||
<div class="text-xs text-gray-400">{event.compiledContent()}</div>
|
||||
</div>
|
||||
</article>
|
||||
))}
|
||||
</section>
|
||||
</BaseLayout>
|
Reference in New Issue
Block a user