From 97aa78204bde71e086d2d90ecb32985d05d21e03 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Padez?= <andre.padez@gmail.com>
Date: Mon, 31 Aug 2026 02:33:46 +0100
Subject: [PATCH] the typeface picker names the current face
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

"Default" told somebody nothing. The question they are asking of that dropdown is "what is it now, and
what would I be changing it from" — so the empty option now reads "Martian Title (site default)", from
the stylesheet that actually decides it.

A label that refuses to answer makes people change the setting to find out, which is the one action
that loses the answer.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 web/sections/LayoutPanel.tsx | 24 +++++++++++++++++-------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/web/sections/LayoutPanel.tsx b/web/sections/LayoutPanel.tsx
index 88cbf99..6c3340d 100644
--- a/web/sections/LayoutPanel.tsx
+++ b/web/sections/LayoutPanel.tsx
@@ -45,6 +45,14 @@ type Layout = {
   font_display: string | null;
   /** What the picker may offer — sent by the API so this file holds no third copy of the list. */
   fonts: string[];
+  /**
+   * Which face plays each role when nothing has been chosen, read from the site's own stylesheet.
+   *
+   * So the empty option can NAME the typeface instead of saying "Default". The question somebody is
+   * actually asking of that dropdown is "what is it now" — and a label that does not answer it makes
+   * them change the setting to find out, which is the one way to lose the answer.
+   */
+  font_defaults: Record<string, string>;
 };
 
 /** The four roles styles.css declares. A template asks for a role; this decides which face plays it. */
@@ -107,9 +115,10 @@ export const LayoutPanel = () => {
 
   /*
     Compared field by field rather than whole, because the payload carries something this does not own:
-    `fonts` is the API saying which faces the build subsets, not a value anybody edits. Including it
-    would be harmless today and wrong the first time a face is added — the panel would show unsaved
-    changes for a decision made in the build script.
+    `fonts` and `font_defaults` are the API describing the site — which faces the build subsets, and
+    which one plays each role today — not values anybody edits here. Including them would be harmless
+    today and wrong the first time either changed: the panel would show unsaved changes for a decision
+    made in a build script or a stylesheet.
   */
   const WRITABLE = [
     'background',
@@ -225,10 +234,11 @@ export const LayoutPanel = () => {
                 onChange={(event) => patch({ [key]: event.currentTarget.value || null } as Partial<Layout>)}
                 className="h-8 rounded-md border border-input bg-transparent px-2 text-xs"
               >
-                {/* "Default" is not a font. It means the stylesheet decides, which is what an
-                    untouched site already does — so choosing it puts things back rather than
-                    setting something new. */}
-                <option value="">Default</option>
+                {/* Not "Default" — the face the stylesheet actually uses, named. Choosing it puts
+                    things back rather than setting something new, and now you can see what back is. */}
+                <option value="">
+                  {draft.font_defaults[key] ? `${draft.font_defaults[key]} (site default)` : 'Default'}
+                </option>
                 {draft.fonts.map((font) => (
                   <option key={font} value={font}>
                     {font}