Davide Scaini
46 lines
1.6 KiB
Plaintext
46 lines
1.6 KiB
Plaintext
---
|
|
import type { CollectionEntry } from 'astro:content';
|
|
import Base from './Base.astro';
|
|
import FormattedDate from '../components/FormattedDate.astro';
|
|
|
|
type Props = CollectionEntry<'blog'>['data'] & { id?: string };
|
|
|
|
const { title, description, pubDate, updatedDate, heroImage, id } = Astro.props;
|
|
---
|
|
|
|
<Base title={title} description={description}>
|
|
<article class="max-w-3xl mx-auto">
|
|
{heroImage && (
|
|
<img class="w-full rounded-xl mb-6 object-cover" style="max-height: 400px" src={heroImage} alt="" />
|
|
)}
|
|
<div class="mb-6 pb-4 border-b" style="border-color: var(--border)">
|
|
<div class="text-sm mb-2" style="color: var(--text-4)">
|
|
<FormattedDate date={pubDate} />
|
|
{updatedDate && (
|
|
<span class="italic"> · Aggiornato <FormattedDate date={updatedDate} /></span>
|
|
)}
|
|
</div>
|
|
<div class="flex items-start justify-between gap-4">
|
|
<h1 class="text-3xl font-bold" style="color: var(--text-primary)">{title}</h1>
|
|
{id && (
|
|
<button
|
|
data-slug={id}
|
|
id="edit-post-btn"
|
|
class="shrink-0 text-xs text-zinc-500 hover:text-white transition-colors px-2 py-1 rounded border border-zinc-700 hover:border-zinc-500 mt-1"
|
|
>Modifica</button>
|
|
)}
|
|
</div>
|
|
</div>
|
|
<div class="prose-wiki">
|
|
<slot />
|
|
</div>
|
|
</article>
|
|
</Base>
|
|
|
|
<script>
|
|
document.getElementById('edit-post-btn')?.addEventListener('click', (e) => {
|
|
const slug = (e.currentTarget as HTMLElement).dataset.slug;
|
|
window.dispatchEvent(new CustomEvent('open-editor', { detail: { slug, apiBase: '/stories' } }));
|
|
});
|
|
</script>
|