Adds notes.

src/pages/about.astro

@@ -15,6 +15,6 @@ const { Content } = await render(about);
 <RootLayout>
   <NotchedBox fillNotches="left">
     <h1>{about.data.title}</h1>
-<Content />
+    <Content />
   </NotchedBox>
 </RootLayout>

src/pages/notes/[...slug].astro

@@ -0,0 +1,36 @@
+---
+import RootLayout from '../../layouts/RootLayout.astro';
+import NotchedBox from '../../components/NotchedBox.astro';
+import FormattedDate from '../../components/FormattedDate.astro';
+import { type CollectionEntry, getCollection } from 'astro:content';
+import { render } from 'astro:content';
+
+export async function getStaticPaths() {
+	const notes = await getCollection('notes');
+	return notes.map((note) => ({
+		params: { slug: note.id },
+		props: note,
+	}));
+}
+type Props = CollectionEntry<'notes'>;
+
+const note = Astro.props;
+const { Content } = await render(note);
+---
+
+<RootLayout>
+  <NotchedBox fillNotches="left">
+    <h1>{note.data.title}</h1>
+    <div class="last-updated">
+      Last updated <FormattedDate date={note.data.updated} />
+    </div>
+    <Content />
+  </NotchedBox>
+</RootLayout>
+
+<style>
+.last-updated {
+  font-size: var(--font-size-sm);
+  color: var(--color-gray);
+}
+</style>