Reduce landing page typography and add active endpoints list

src/ignition.ts

@@ -33,7 +33,7 @@ export const ignition = () => {
       }
       h1 {
         margin: 0 0 8px;
-        font-size: clamp(40px, 8vw, 84px);
+        font-size: clamp(28px, 5vw, 44px);
         line-height: 1;
         letter-spacing: -0.08em;
       }
@@ -42,39 +42,51 @@ export const ignition = () => {
       }
       .tagline {
         margin: 0 0 44px;
-        font-size: 22px;
-        text-align: center;
+        font-size: 14px;
+        text-align: left;
       }
       h2 {
         margin: 36px 0 10px;
-        font-size: 28px;
+        font-size: 16px;
         font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
         text-transform: uppercase;
       }
       a {
         color: inherit;
       }
       .endpoint {
-        margin: 0 0 34px 64px;
+        margin: 0 0 34px;
+      }
+      .endpoint-list {
+        margin: 0 0 28px;
+        padding: 0;
+        list-style: none;
+        font-size: 14px;
+      }
+      .endpoint-list li {
+        margin: 0 0 6px;
+      }
+      .endpoint-list a {
+        font-weight: 700;
       }
       .curl {
         margin: 0 0 12px;
         color: #000;
-        font-size: clamp(20px, 3vw, 30px);
+        font-size: clamp(14px, 1.8vw, 16px);
         font-weight: 700;
         white-space: pre-wrap;
         word-break: break-word;
       }
       pre {
-        margin: 0 0 26px 88px;
+        margin: 0 0 26px;
         color: #444;
-        font-size: clamp(16px, 2.5vw, 26px);
+        font-size: clamp(12px, 1.5vw, 14px);
         line-height: 1.45;
         white-space: pre-wrap;
       }
       .links {
         margin-top: 44px;
-        font-size: 18px;
+        font-size: 14px;
       }
       @media (max-width: 640px) {
         body {
@@ -83,12 +95,6 @@ export const ignition = () => {
         .tagline {
           text-align: left;
         }
-        .endpoint {
-          margin-left: 0;
-        }
-        pre {
-          margin-left: 24px;
-        }
       }
     </style>
   </head>
@@ -97,6 +103,13 @@ export const ignition = () => {
       <h1>version<span>-</span>vault</h1>
       <p class="tagline">Version metadata responses are JSON-encoded.</p>
 
+      <h2>ENDPOINTS</h2>
+      <ul class="endpoint-list">
+        <li><a href="/">/</a> This page.</li>
+        <li><a href="/python/pyenv">/python/pyenv</a> Pyenv Python versions.</li>
+        <li><a href="/python/uv-build">/python/uv-build</a> Python Build Standalone assets.</li>
+      </ul>
+
       <h2>Examples</h2>
       <section class="endpoint" aria-label="pyenv Python versions">
         <p class="curl">$ curl https://vault.vfox.dev/python/pyenv</p>

tests/root.test.ts

@@ -9,6 +9,14 @@ test("root route renders landing page with examples and endpoint links", async (
   assert.equal(response.status, 200);
   assert.match(response.headers.get("content-type") ?? "", /^text\/html/);
   assert.match(body, /https:\/\/github\.com\/version-fox\/version-vault/);
+  assert.match(body, /<h2>ENDPOINTS<\/h2>/);
+  assert.match(body, /<a href="\/">\/<\/a>/);
+  assert.match(body, /This page\./);
+  assert.match(body, /href="\/python\/pyenv"/);
+  assert.match(body, /Pyenv Python versions\./);
+  assert.match(body, /href="\/python\/uv-build"/);
+  assert.match(body, /Python Build Standalone assets\./);
+  assert.doesNotMatch(body, /\/pyenv-versions/);
   assert.match(body, /\$ curl https:\/\/vault\.vfox\.dev\/python\/pyenv/);
   assert.match(body, /\$ curl https:\/\/vault\.vfox\.dev\/python\/uv-build/);
   assert.match(body, /https:\/\/vault\.vfox\.dev\/python\/uv-build\?os=linux&amp;arch=aarch64&amp;libc=gnu/);