feat(docs): add changelog page and switch tag guide paths to appendix

2026-11-02 13:12:44 +00:00 · 2026-09-30 18:00:35 -04:00
1 parent c3c482d954
commit 45bd3f771d
@@ -0,0 +1,117 @@
+---
+/**
+ * `/changelog`: every topic and review release on one page, newest first — a
+ * vertical timeline, the date on the left and one card per release on the
+ * right, with no per-release subpages. Replaces Blume's generated changelog
+ * (a custom page wins its route); the header links here from
+ * `navigation.actions` in blume.config.ts. Data: lib/releases.ts.
+ */
+import PageLayout from "blume/components/layout/PageLayout.astro";
+import data from "blume:data";
+import { readReleases } from "../lib/releases.ts";
+
+const { config } = data;
+const releases = await readReleases();
+const DATE = new Intl.DateTimeFormat("en-US", {
+  timeZone: "America/New_York",
+  month: "short",
+  day: "numeric",
+  year: "numeric",
+});
+const issueUrl = (n: number) => `https://github.com/prdlk/leetcode/issues/${n}`;
+// The /progress cards' difficulty palette (--chart-1..3 in theme.css), so a
+// Hard reads the same colour here as in the SolvedRing gauge.
+const DIFFICULTY: Record<string, { label: string; class: string }> = {
+  easy: { label: "Easy", class: "border-chart-1/40 bg-chart-1/10 text-chart-1" },
+  medium: { label: "Med.", class: "border-chart-2/40 bg-chart-2/10 text-chart-2" },
+  hard: { label: "Hard", class: "border-chart-3/40 bg-chart-3/10 text-chart-3" },
+};
+const description = "Every topic and review the campaign finished, newest first.";
+---
+
+<PageLayout
+  site={{ title: config.title, description: config.description }}
+  logo={config.logo}
+  favicon={config.favicon}
+  banner={config.banner}
+  analytics={config.analytics}
+  navigation={data.navigation}
+  fontCssVars={data.fontCssVars}
+  themeMode={config.theme.mode}
+  searchEnabled={config.search.enabled}
+  siteUrl={config.site}
+  ogEnabled={config.og.enabled}
+  structuredDataEnabled={config.structuredData}
+  page={{ title: `Changelog - ${config.title}`, description, route: "/changelog" }}
+>
+  <section class="mx-auto w-full max-w-4xl px-6 py-16">
+    <h1 class="m-0 text-4xl font-semibold tracking-tight text-foreground">Changelog</h1>
+    <p class="mt-3 text-lg text-muted-foreground">{description}</p>
+
+    <ol class="relative mt-12 list-none p-0">
+      {
+        releases.map((r, i) => (
+          <li class="relative grid gap-4 pb-14 pl-8 sm:grid-cols-[11rem_1fr] sm:gap-8">
+            {/* The rail: a line down the left edge, a ring at each release. */}
+            {i < releases.length - 1 && (
+              <span class="absolute top-3 bottom-0 left-[5px] w-px bg-border" aria-hidden="true" />
+            )}
+            <span
+              class="absolute top-1.5 left-0 size-[11px] rounded-full border border-emerald-500 bg-background"
+              aria-hidden="true"
+            />
+            <div class="font-mono text-sm">
+              <time class="block uppercase tracking-wide text-foreground" datetime={r.finishedAt.toISOString()}>
+                {DATE.format(r.finishedAt)}
+              </time>
+              <a class="mt-1 block text-xs text-muted-foreground no-underline hover:underline" href={r.url}>
+                {r.kind} release ↗
+              </a>
+            </div>
+            <article id={`issue-${r.issue}`} class="rounded-lg border border-border bg-muted/30 p-6">
+              <header class="flex items-baseline justify-between gap-4">
+                <h2 class="m-0 text-lg font-semibold text-foreground">{r.name}</h2>
+                <a
+                  class="shrink-0 font-mono text-sm text-muted-foreground no-underline hover:underline"
+                  href={issueUrl(r.issue)}
+                >
+                  #{r.issue}
+                </a>
+              </header>
+              <ul class="mt-4 mb-0 list-none space-y-2 p-0">
+                {r.problems.map((p) => (
+                  <li class="flex items-baseline gap-3 text-base leading-relaxed text-muted-foreground">
+                    <span class="select-none text-border" aria-hidden="true">—</span>
+                    <span class="min-w-0 flex-1">
+                      <span class="mr-2 font-mono text-xs uppercase tracking-wide">{p.set}</span>
+                      <a class="text-foreground no-underline hover:underline" href={issueUrl(p.issue)}>
+                        {p.title}
+                      </a>
+                      {p.docs && (
+                        <a class="ml-2 font-mono text-xs text-emerald-500 no-underline hover:underline" href={p.docs}>
+                          view →
+                        </a>
+                      )}
+                    </span>
+                    {/* Its own right-hand column, one width for all three, so the
+                        badges line up down the card instead of crowding the link. */}
+                    {DIFFICULTY[p.difficulty] && (
+                      <span
+                        class:list={[
+                          "w-12 shrink-0 rounded-full border py-px text-center font-mono text-[11px] leading-4",
+                          DIFFICULTY[p.difficulty]!.class,
+                        ]}
+                      >
+                        {DIFFICULTY[p.difficulty]!.label}
+                      </span>
+                    )}
+                  </li>
+                ))}
+              </ul>
+            </article>
+          </li>
+        ))
+      }
+    </ol>
+  </section>
+</PageLayout>