diff --git a/src/server/web/link.rs b/src/server/web/link.rs
index f7980d1..b43f70c 100644
--- a/src/server/web/link.rs
+++ b/src/server/web/link.rs
@@ -1,4 +1,5 @@
 use askama::Template;
+use maud::{html, Markup};
 use time::OffsetDateTime;
 
 use crate::server::util;
@@ -34,6 +35,44 @@ impl LinkCommit {
             reachable,
         }
     }
+
+    pub fn class_and_title(&self) -> (&'static str, &'static str) {
+        if self.reachable == 0 {
+            (
+                "commit-orphaned",
+                "This commit is orphaned. It can't be reached from any ref.",
+            )
+        } else if self.reachable == -1 {
+            (
+                "commit-reachable",
+                "This commit can only be reached from untracked refs.",
+            )
+        } else {
+            (
+                "commit-tracked",
+                "This commit can be reached from a tracked ref.",
+            )
+        }
+    }
+
+    pub fn html(&self) -> Markup {
+        let (class, title) = self.class_and_title();
+
+        let truncate = self.short.chars().take(81).count() > 80;
+        let short = if truncate {
+            self.short
+                .chars()
+                .take(80 - 3)
+                .chain("...".chars())
+                .collect::<String>()
+        } else {
+            self.short.to_string()
+        };
+
+        html! {
+            a href=(self.link) .(class) title=(title) { (short) }
+        }
+    }
 }
 
 #[derive(Template)]
@@ -72,6 +111,12 @@ impl LinkRunDate {
             date: util::format_time(start),
         }
     }
+
+    pub fn html(&self) -> Markup {
+        html! {
+            a href=(self.link) { "Run from " (self.date) }
+        }
+    }
 }
 
 #[derive(Template)]
diff --git a/src/server/web/pages/commit.rs b/src/server/web/pages/commit.rs
index 41202d2..bf61f42 100644
--- a/src/server/web/pages/commit.rs
+++ b/src/server/web/pages/commit.rs
@@ -1,10 +1,10 @@
-use askama::Template;
 use axum::{
     extract::State,
     http::StatusCode,
     response::{IntoResponse, Response},
 };
 use futures::TryStreamExt;
+use maud::html;
 use sqlx::SqlitePool;
 
 use crate::{
@@ -12,7 +12,7 @@ use crate::{
     server::{
         util,
         web::{
-            base::{Base, Link, Tab},
+            base::{Base, Tab},
             link::{LinkCommit, LinkRunDate},
             paths::{PathAdminQueueAdd, PathCommitByHash},
         },
@@ -20,25 +20,6 @@ use crate::{
     somehow,
 };
 
-#[derive(Template)]
-#[template(path = "pages/commit.html")]
-struct Page {
-    link_admin_queue_add: Link,
-    base: Base,
-
-    summary: String,
-    hash: String,
-    author: String,
-    author_date: String,
-    commit: String,
-    commit_date: String,
-    parents: Vec<LinkCommit>,
-    children: Vec<LinkCommit>,
-    message: String,
-    reachable: i64,
-    runs: Vec<LinkRunDate>,
-}
-
 pub async fn get_commit_by_hash(
     path: PathCommitByHash,
     State(config): State<&'static ServerConfig>,
@@ -109,21 +90,69 @@ pub async fn get_commit_by_hash(
     .try_collect::<Vec<_>>()
     .await?;
 
-    Ok(Page {
-        link_admin_queue_add: base.link(PathAdminQueueAdd {}),
-        base,
+    // TODO Somewhat inefficient to construct full LinkCommit for this
+    let (class, title) = LinkCommit::new(
+        &base,
+        commit.hash.clone(),
+        &commit.message,
+        commit.reachable,
+    )
+    .class_and_title();
 
-        summary: util::format_commit_summary(&commit.message),
-        hash: commit.hash,
-        author: commit.author,
-        author_date: util::format_time(commit.author_date),
-        commit: commit.committer,
-        commit_date: util::format_time(commit.committer_date),
-        parents,
-        children,
-        message: commit.message.trim_end().to_string(),
-        reachable: commit.reachable,
-        runs,
-    }
-    .into_response())
+    Ok(base
+        .html(
+            &util::format_commit_summary(&commit.message),
+            html! {},
+            html! {
+                h2 { "Commit" }
+                div .commit-like .commit {
+                    span .title { "commit " (commit.hash) }
+                    dl {
+                        dt { "Author:" }
+                        dd { (commit.author) }
+
+                        dt { "AuthorDate:" }
+                        dd { (util::format_time(commit.author_date)) }
+
+                        dt { "Commit:" }
+                        dd { (commit.committer) }
+
+                        dt { "CommitDate:" }
+                        dd { (util::format_time(commit.committer_date)) }
+
+                        @for commit in parents {
+                            dt { "Parent:" }
+                            dd { (commit.html()) }
+                        }
+
+                        @for commit in children {
+                            dt { "Child:" }
+                            dd { (commit.html()) }
+                        }
+                    }
+                    pre .(class) title=(title) {
+                        (commit.message.trim_end())
+                    }
+                }
+
+                h2 { "Runs" }
+                @if runs.is_empty() {
+                    p { "There aren't any runs yet." }
+                } @else {
+                    ul {
+                        @for run in runs {
+                            li { (run.html()) }
+                        }
+                    }
+                }
+                form method="post" action=(base.link(PathAdminQueueAdd {})) {
+                    input type="hidden" name="hash" value=(commit.hash);
+                    button { "Add to queue" } " with a "
+                    label for="priority" { "priority" } " of "
+                    input id="priority" name="priority" type="number" value="10" min="-2147483648" max="2147483647";
+                    "."
+                }
+            },
+        )
+        .into_response())
 }
diff --git a/templates/pages/commit.html b/templates/pages/commit.html
deleted file mode 100644
index 3412e6a..0000000
--- a/templates/pages/commit.html
+++ /dev/null
@@ -1,58 +0,0 @@
-{% extends "base.html" %}
-{% import "util.html" as util %}
-
-{% block title %}{{ summary }}{% endblock %}
-
-{% block body %}
-
-<h2>Commit</h2>
-
-<div class="commit-like commit">
-    <span class="title">commit {{ hash }}</span>
-    <dl>
-        <dt>Author:</dt>
-        <dd>{{ author }}</dd>
-
-        <dt>AuthorDate:</dt>
-        <dd>{{ author_date }}</dd>
-
-        <dt>Commit:</dt>
-        <dd>{{ commit }}</dd>
-
-        <dt>CommitDate:</dt>
-        <dd>{{ commit_date }}</dd>
-
-        {% for commit in parents %}
-        <dt>Parent:</dt>
-        <dd>{{ commit|safe }}</dd>
-        {% endfor %}
-
-        {% for commit in children %}
-        <dt>Child:</dt>
-        <dd>{{ commit|safe }}</dd>
-        {% endfor %}
-    </dl>
-    <pre class="{% call util::commit_class(reachable) %}"
-        title="{% call util::commit_title(reachable) %}">{{ message }}</pre>
-</div>
-
-<h2>Runs</h2>
-
-{% if runs.is_empty() %}
-There aren't any runs yet.
-{% else %}
-<ul>
-    {% for run in runs %}
-    <li>{{ run|safe }}</li>
-    {% endfor %}
-</ul>
-{% endif %}
-
-<form method="post" action="{{ link_admin_queue_add }}">
-    <input type="hidden" name="hash" value="{{ hash }}">
-    <button>Add to queue</button>
-    with a <label for="priority">priority</label> of
-    <input type="number" id="priority" name="priority" value="10" min="-2147483648" max="2147483647">.
-</form>
-
-{% endblock %}