diff options
Diffstat (limited to 'website/src/layouts/BlogPost.astro')
| -rw-r--r-- | website/src/layouts/BlogPost.astro | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/website/src/layouts/BlogPost.astro b/website/src/layouts/BlogPost.astro new file mode 100644 index 0000000..b709356 --- /dev/null +++ b/website/src/layouts/BlogPost.astro @@ -0,0 +1,50 @@ +--- +import type { CollectionEntry } from 'astro:content'; +import BaseHead from '../components/BaseHead.astro'; +import FormattedDate from '../components/FormattedDate.astro'; + +type Props = CollectionEntry<'blog'>['data']; + +const { title, description, pubDate, updatedDate } = Astro.props; + +const canonicalUrl = new URL(Astro.url.pathname, Astro.site); + +const pubDateStr = `${pubDate.year}-${pubDate.month}-${pubDate.day}`; +const updatedDateStr = updatedDate ? + `${updatedDate.year}-${updatedDate.month}-${updatedDate.day}` + : pubDateStr; +--- + +<html lang="en"> + <head> + <BaseHead title={`${title} | joeac’s blog`} description={description} /> + <link rel="stylesheet" href="/css/blog.css"> + </head> + + <body> + <article class="h-entry"> + <aside> + <span> + This is a blog post by + <a class="p-author h-card h-card--minimal" href="/">Joe Carstairs</a>. + </span> + { updatedDate + ? ( + <span>Updated: <FormattedDate date={updatedDateStr} className="dt-updated"/>.</span> + <span>Originally published: <FormattedDate date={pubDateStr} className="dt-published"/>.</span> + ) : <span>Published: <FormattedDate date={pubDateStr} className="dt-published"/>.</span> + } + <span>Go back to his <a href="/blog">blog</a> if you like.</span> + <span><a class="u-url uid" href={canonicalUrl}>Permalink</a></span> + </aside> + + <h1 class="h-name">{title}</h1> + + <p class="p-summary" set:html={description} /> + + <div class="e-content"> + <slot /> + </div> + </article> + </body> +</html> |