the typeface picker names the current face
"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>
This commit is contained in:
@@ -45,6 +45,14 @@ type Layout = {
|
|||||||
font_display: string | null;
|
font_display: string | null;
|
||||||
/** What the picker may offer — sent by the API so this file holds no third copy of the list. */
|
/** What the picker may offer — sent by the API so this file holds no third copy of the list. */
|
||||||
fonts: string[];
|
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. */
|
/** 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:
|
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
|
`fonts` and `font_defaults` are the API describing the site — which faces the build subsets, and
|
||||||
would be harmless today and wrong the first time a face is added — the panel would show unsaved
|
which one plays each role today — not values anybody edits here. Including them would be harmless
|
||||||
changes for a decision made in the build script.
|
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 = [
|
const WRITABLE = [
|
||||||
'background',
|
'background',
|
||||||
@@ -225,10 +234,11 @@ export const LayoutPanel = () => {
|
|||||||
onChange={(event) => patch({ [key]: event.currentTarget.value || null } as Partial<Layout>)}
|
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"
|
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
|
{/* Not "Default" — the face the stylesheet actually uses, named. Choosing it puts
|
||||||
untouched site already does — so choosing it puts things back rather than
|
things back rather than setting something new, and now you can see what back is. */}
|
||||||
setting something new. */}
|
<option value="">
|
||||||
<option value="">Default</option>
|
{draft.font_defaults[key] ? `${draft.font_defaults[key]} (site default)` : 'Default'}
|
||||||
|
</option>
|
||||||
{draft.fonts.map((font) => (
|
{draft.fonts.map((font) => (
|
||||||
<option key={font} value={font}>
|
<option key={font} value={font}>
|
||||||
{font}
|
{font}
|
||||||
|
|||||||
Reference in New Issue
Block a user