@janga/norna 0.7.2 → 0.7.4

package/scripts/show-typography.mjs

@@ -1,10 +1,12 @@
 import { readFile } from 'node:fs/promises';
+import { findMap } from './lib/frontmatter-yaml.mjs';
 import {
 	defaultTypography,
 	resolveTypographyOverride,
 	resolveTypographyConfig,
 	toYamlLines,
 	typographyPresets,
+	typographyRhythms,
 } from './lib/typography.mjs';
 import {
 	getContentFiles,
@@ -23,76 +25,56 @@ import {
 
 const mode = process.argv[2] ?? 'show';
 
-const typographyRoles = ['heading', 'body', 'caption'];
-const typographyFields = {
-	heading: ['align', 'size', 'lineHeight', 'spacing'],
-	body: ['align', 'size', 'lineHeight', 'paragraphSpacing'],
-	caption: ['align', 'size', 'lineHeight', 'spacing'],
-};
-const responsiveFields = new Set(['align']);
-
+const typographyValuePaths = [
+	['headings', 'h1', 'align', 'desktop'],
+	['headings', 'h1', 'align', 'mobile'],
+	['headings', 'h1', 'size'],
+	['headings', 'h1', 'lineHeight'],
+	['headings', 'h1', 'spacingBefore'],
+	['headings', 'h1', 'spacingAfter'],
+	['headings', 'h2', 'align', 'desktop'],
+	['headings', 'h2', 'align', 'mobile'],
+	['headings', 'h2', 'size'],
+	['headings', 'h2', 'lineHeight'],
+	['headings', 'h2', 'spacingBefore'],
+	['headings', 'h2', 'spacingAfter'],
+	['headings', 'h3', 'align', 'desktop'],
+	['headings', 'h3', 'align', 'mobile'],
+	['headings', 'h3', 'size'],
+	['headings', 'h3', 'lineHeight'],
+	['headings', 'h3', 'spacingBefore'],
+	['headings', 'h3', 'spacingAfter'],
+	['headings', 'h4', 'align', 'desktop'],
+	['headings', 'h4', 'align', 'mobile'],
+	['headings', 'h4', 'size'],
+	['headings', 'h4', 'lineHeight'],
+	['headings', 'h4', 'spacingBefore'],
+	['headings', 'h4', 'spacingAfter'],
+	['body', 'align', 'desktop'],
+	['body', 'align', 'mobile'],
+	['body', 'size'],
+	['body', 'lineHeight'],
+	['body', 'paragraphSpacing'],
+	['caption', 'align', 'desktop'],
+	['caption', 'align', 'mobile'],
+	['caption', 'size'],
+	['caption', 'lineHeight'],
+	['caption', 'spacingBefore'],
+];
+const rhythmValuePaths = new Set([
+	'headings.h1.spacingBefore',
+	'headings.h1.spacingAfter',
+	'headings.h2.spacingBefore',
+	'headings.h2.spacingAfter',
+	'headings.h3.spacingBefore',
+	'headings.h3.spacingAfter',
+	'headings.h4.spacingBefore',
+	'headings.h4.spacingAfter',
+	'body.paragraphSpacing',
+	'caption.spacingBefore',
+]);
 const countIndent = (line) => line.match(/^\s*/)?.[0].length ?? 0;
 
-const parseScalar = (rawValue) => {
-	const value = rawValue.trim();
-
-	if (/^-?\d+(?:\.\d+)?$/.test(value)) return Number(value);
-	if ((value.startsWith('"') && value.endsWith('"')) || (value.startsWith("'") && value.endsWith("'"))) {
-		return value.slice(1, -1);
-	}
-
-	return value;
-};
-
-const parseMapping = (lines, startIndex, baseIndent) => {
-	const value = {};
-	let index = startIndex;
-
-	while (index < lines.length) {
-		const line = lines[index];
-		if (!line.trim() || line.trim().startsWith('#')) {
-			index += 1;
-			continue;
-		}
-
-		const indent = countIndent(line);
-		if (indent <= baseIndent) break;
-		if (line.trim().startsWith('- ')) break;
-
-		const match = line.trim().match(/^([a-zA-Z][a-zA-Z0-9-]*):(?:\s+(.*))?$/);
-		if (!match) break;
-
-		const [, key, rawValue] = match;
-		if (rawValue === undefined) {
-			const parsed = parseMapping(lines, index + 1, indent);
-			value[key] = parsed.value;
-			index = parsed.nextIndex;
-		} else {
-			value[key] = parseScalar(rawValue);
-			index += 1;
-		}
-	}
-
-	return { value, nextIndex: index };
-};
-
-const findMap = (lines, label, parentStart = 0, parentEnd = lines.length, requiredIndent = null) => {
-	for (let index = parentStart; index < parentEnd; index += 1) {
-		const line = lines[index];
-		const match = line.match(/^(\s*)([a-zA-Z][a-zA-Z0-9-]*):\s*$/);
-		if (!match || match[2] !== label) continue;
-		if (requiredIndent !== null && match[1].length !== requiredIndent) continue;
-
-		return {
-			index,
-			indent: match[1].length,
-			...parseMapping(lines, index + 1, match[1].length),
-		};
-	}
-
-	return null;
-};
-
 const isPlainObject = (value) => (
 	value !== null &&
 	typeof value === 'object' &&
@@ -129,54 +111,29 @@ const setPath = (value, path, entry) => {
 const annotateResolvedValues = (resolved, sources) => {
 	const annotated = {};
 
-	for (const role of typographyRoles) {
-		for (const field of typographyFields[role]) {
-			if (responsiveFields.has(field)) {
-				for (const viewport of ['desktop', 'mobile']) {
-					const path = [role, field, viewport];
-					const source = getPath(sources, path);
-					setPath(annotated, path, {
-						value: getPath(resolved.values, path),
-						source: source.source,
-						...(source.inherited ? { inherited: true } : {}),
-					});
-				}
-				continue;
-			}
-
-			const path = [role, field];
-			const source = getPath(sources, path);
-			setPath(annotated, path, {
-				value: getPath(resolved.values, path),
-				source: source.source,
-				...(source.inherited ? { inherited: true } : {}),
-			});
-		}
+	for (const path of typographyValuePaths) {
+		const source = getPath(sources, path);
+		setPath(annotated, path, {
+			value: getPath(resolved.values, path),
+			source: source.source,
+			...(source.inherited ? { inherited: true } : {}),
+		});
 	}
 
 	return annotated;
 };
 
-const presetSources = (presetName) => {
+const defaultSources = (presetName, rhythmName) => {
 	const sources = {};
 
-	for (const role of typographyRoles) {
-		for (const field of typographyFields[role]) {
-			if (responsiveFields.has(field)) {
-				for (const viewport of ['desktop', 'mobile']) {
-					setPath(sources, [role, field, viewport], {
-						source: `preset:${presetName}`,
-						inherited: false,
-					});
-				}
-				continue;
-			}
-
-			setPath(sources, [role, field], {
-				source: `preset:${presetName}`,
-				inherited: false,
-			});
-		}
+	for (const path of typographyValuePaths) {
+		const pathKey = path.join('.');
+		setPath(sources, path, {
+			source: rhythmValuePaths.has(pathKey)
+				? `rhythm:${rhythmName}`
+				: `preset:${presetName}`,
+			inherited: false,
+		});
 	}
 
 	return sources;
@@ -186,28 +143,12 @@ const applyOverrideSources = (sources, typographyConfig, sourceLabel) => {
 	const overrides = typographyConfig?.overrides;
 	if (!overrides) return sources;
 
-	for (const role of typographyRoles) {
-		for (const field of typographyFields[role]) {
-			if (responsiveFields.has(field)) {
-				for (const viewport of ['desktop', 'mobile']) {
-					const path = [role, field, viewport];
-					if (hasPath(overrides, path)) {
-						setPath(sources, path, {
-							source: `${sourceLabel} override`,
-							inherited: false,
-						});
-					}
-				}
-				continue;
-			}
-
-			const path = [role, field];
-			if (hasPath(overrides, path)) {
-				setPath(sources, path, {
-					source: `${sourceLabel} override`,
-					inherited: false,
-				});
-			}
+	for (const path of typographyValuePaths) {
+		if (hasPath(overrides, path)) {
+			setPath(sources, path, {
+				source: `${sourceLabel} override`,
+				inherited: false,
+			});
 		}
 	}
 
@@ -217,25 +158,11 @@ const applyOverrideSources = (sources, typographyConfig, sourceLabel) => {
 const inheritedSources = (sources) => {
 	const inherited = structuredClone(sources);
 
-	for (const role of typographyRoles) {
-		for (const field of typographyFields[role]) {
-			if (responsiveFields.has(field)) {
-				for (const viewport of ['desktop', 'mobile']) {
-					const path = [role, field, viewport];
-					setPath(inherited, path, {
-						...getPath(sources, path),
-						inherited: true,
-					});
-				}
-				continue;
-			}
-
-			const path = [role, field];
-			setPath(inherited, path, {
-				...getPath(sources, path),
-				inherited: true,
-			});
-		}
+	for (const path of typographyValuePaths) {
+		setPath(inherited, path, {
+			...getPath(sources, path),
+			inherited: true,
+		});
 	}
 
 	return inherited;
@@ -244,7 +171,7 @@ const inheritedSources = (sources) => {
 const resolveAnnotatedTypographyConfig = (typographyConfig, sourceLabel) => {
 	const resolved = resolveTypographyConfig(typographyConfig ?? defaultTypography);
 	const sources = applyOverrideSources(
-		presetSources(resolved.preset),
+		defaultSources(resolved.preset, resolved.rhythm),
 		typographyConfig,
 		sourceLabel,
 	);
@@ -255,14 +182,44 @@ const resolveAnnotatedTypographyConfig = (typographyConfig, sourceLabel) => {
 			source: typographyConfig?.preset ? sourceLabel : 'engine default',
 			...(typographyConfig?.preset ? {} : { inherited: true }),
 		},
+		rhythm: {
+			value: resolved.rhythm,
+			source: typographyConfig?.rhythm ? sourceLabel : 'engine default',
+			...(typographyConfig?.rhythm ? {} : { inherited: true }),
+		},
 		resolved,
 		sources,
 	};
 };
 
 const resolveAnnotatedTypographyOverride = (baseAnnotated, typographyConfig, sourceLabel) => {
-	if (typographyConfig?.preset) {
-		return resolveAnnotatedTypographyConfig(typographyConfig, sourceLabel);
+	if (typographyConfig?.preset || typographyConfig?.rhythm) {
+		const resolvedConfig = {
+			preset: typographyConfig.preset ?? baseAnnotated.resolved.preset,
+			rhythm: typographyConfig.rhythm ?? baseAnnotated.resolved.rhythm,
+			overrides: typographyConfig.overrides,
+		};
+		const resolved = resolveTypographyConfig(resolvedConfig);
+		const sources = applyOverrideSources(
+			defaultSources(resolved.preset, resolved.rhythm),
+			typographyConfig,
+			sourceLabel,
+		);
+
+		return {
+			preset: {
+				value: resolved.preset,
+				source: typographyConfig.preset ? sourceLabel : baseAnnotated.preset.source,
+				...(typographyConfig.preset ? {} : { inherited: true }),
+			},
+			rhythm: {
+				value: resolved.rhythm,
+				source: typographyConfig.rhythm ? sourceLabel : baseAnnotated.rhythm.source,
+				...(typographyConfig.rhythm ? {} : { inherited: true }),
+			},
+			resolved,
+			sources,
+		};
 	}
 
 	if (typographyConfig?.overrides) {
@@ -279,6 +236,11 @@ const resolveAnnotatedTypographyOverride = (baseAnnotated, typographyConfig, sou
 				source: baseAnnotated.preset.source,
 				inherited: true,
 			},
+			rhythm: {
+				value: resolved.rhythm,
+				source: baseAnnotated.rhythm.source,
+				inherited: true,
+			},
 			resolved,
 			sources,
 		};
@@ -290,6 +252,11 @@ const resolveAnnotatedTypographyOverride = (baseAnnotated, typographyConfig, sou
 			source: baseAnnotated.preset.source,
 			inherited: true,
 		},
+		rhythm: {
+			value: baseAnnotated.resolved.rhythm,
+			source: baseAnnotated.rhythm.source,
+			inherited: true,
+		},
 		resolved: baseAnnotated.resolved,
 		sources: inheritedSources(baseAnnotated.sources),
 	};
@@ -297,6 +264,7 @@ const resolveAnnotatedTypographyOverride = (baseAnnotated, typographyConfig, sou
 
 const formatAnnotatedTypography = (annotated) => ({
 	preset: annotated.preset,
+	rhythm: annotated.rhythm,
 	resolved: annotateResolvedValues(annotated.resolved, annotated.sources),
 });
 
@@ -355,10 +323,7 @@ const readThemeTypography = async () => {
 	}
 
 	const themeLines = themeFrontmatterBody.split(/\r?\n/);
-	const themePresentation = findMap(themeLines, 'presentation', 0, themeLines.length, 0);
-	const themeTypographyConfig = themePresentation
-		? findMap(themeLines, 'typography', themePresentation.index + 1, themePresentation.nextIndex)?.value
-		: null;
+	const themeTypographyConfig = findMap(themeLines, 'typography', 0, themeLines.length, 0)?.value;
 	return resolveAnnotatedTypographyConfig(themeTypographyConfig ?? defaultTypography, siteThemeLabel);
 };
 
@@ -401,7 +366,10 @@ const readPageTypography = async (contentFile, themeTypography) => {
 };
 
 if (mode === 'presets') {
-	console.log(toYamlLines(typographyPresets).join('\n'));
+	console.log(toYamlLines({
+		presets: typographyPresets,
+		rhythms: typographyRhythms,
+	}).join('\n'));
 } else if (mode === 'show') {
 	const themeTypography = await readThemeTypography();
 	const pages = await Promise.all((await getContentFiles()).map((contentFile) => readPageTypography(contentFile, themeTypography)));
@@ -429,5 +397,5 @@ if (mode === 'presets') {
 
 	console.log(toYamlLines(output).join('\n'));
 } else {
-	throw new Error('Usage: norna typography:presets|typography:show');
+	throw new Error('Usage: norna typography presets|show');
 }

package/scripts/sync-content-sections.mjs

@@ -59,7 +59,7 @@ const promptForWrite = async () => {
 	if (!process.stdin.isTTY) return false;
 
 	const rl = createInterface({ input, output });
-	const answer = await rl.question(`This will rewrite Markdown sections in ${siteContentLabel} and move gallery image files if needed. Continue? [y/N] `);
+	const answer = await rl.question(`This will rewrite Markdown sections in ${siteContentLabel} and move image files if needed. Continue? [y/N] `);
 	rl.close();
 
 	return answer.trim().toLowerCase() === 'y';
@@ -269,7 +269,7 @@ const validateRouteContentFiles = async () => {
 				if (referencedImages.has(imageName)) {
 					const previousSectionId = referencedImages.get(imageName);
 					const message = `Image "${imageName}" is referenced more than once, in "${previousSectionId}" and "${contentFile.contentLabel}:${section.id}".`;
-					const fix = 'Each image filename can be referenced by only one gallery row.';
+					const fix = 'Each image filename can be referenced by only one image row.';
 
 					addIssue({ severity: 'error', sectionId: previousSectionId, message, fix });
 					addIssue({
@@ -291,7 +291,7 @@ const validateRouteContentFiles = async () => {
 						sectionId: `${contentFile.contentLabel}:${section.id}`,
 						sectionLabel: `${contentFile.contentLabel} [${section.id}]`,
 						message: `Image "${imageName}" does not exist anywhere under ${contentFile.imagesLabel}/.`,
-						fix: `Add the source image to ${contentFile.imagesLabel}/${section.id}/ or remove the gallery row.`,
+						fix: `Add the source image to ${contentFile.imagesLabel}/${section.id}/ or remove the image row.`,
 					});
 					continue;
 				}
@@ -380,7 +380,7 @@ const getReportLines = (title) => {
 			leftKey.localeCompare(rightKey, 'sv')
 		));
 
-		lines.push('', 'Section and Gallery Issues');
+		lines.push('', 'Section And Image Issues');
 
 		for (const [, group] of orderedSectionGroups) {
 			lines.push('', `[${group.label}]`);
@@ -506,7 +506,7 @@ for (const section of frontmatterSections) {
 			const message = previousSectionId === section.id
 				? `Image "${imageName}" is referenced more than once in this section.`
 				: `Image "${imageName}" is referenced more than once, in sections "${previousSectionId}" and "${section.id}".`;
-			const fix = 'Each image filename can be referenced by only one gallery row.';
+			const fix = 'Each image filename can be referenced by only one image row.';
 
 			addSectionIssue(previousSectionId, { severity: 'error', message, fix });
 			if (previousSectionId !== section.id) {
@@ -522,7 +522,7 @@ for (const section of frontmatterSections) {
 			addSectionIssue(section.id, {
 				severity: 'error',
 				message: `Image "${imageName}" does not exist anywhere under ${siteImagesLabel}/.`,
-				fix: `Add the source image to ${siteImagesLabel}/${section.id}/ or remove the gallery row.`,
+				fix: `Add the source image to ${siteImagesLabel}/${section.id}/ or remove the image row.`,
 			});
 			continue;
 		}

package/scripts/test-content-check.mjs

@@ -43,9 +43,8 @@ const makePngHeader = ({ width, height }) => {
 };
 
 const defaultTheme = `---
-presentation:
-  typography:
-    preset: quiet-gallery
+typography:
+  preset: quiet-gallery
 frame:
   colors: presentation
 ---
@@ -114,7 +113,7 @@ test('content:check groups section issues, global issues, and unreferenced image
 
 		assert.equal(result.status, 1, output);
 		assert.match(output, /^Content check failed\./m);
-		assert.match(output, /Section and Gallery Issues\n\n\[min-konst\]\n  Errors:/);
+		assert.match(output, /Section And Image Issues\n\n\[min-konst\]\n  Errors:/);
 		assert.match(output, /Image "vav\.jpeg" is used here but is located in site\/images\/mitt-hem\/\./);
 		assert.match(output, /Image "missing\.jpeg" does not exist anywhere under site\/images\/\./);
 		assert.match(output, /Image "duplicate\.jpg" is referenced more than once in this section\./);

package/scripts/test-engine-commands.mjs

@@ -4,6 +4,7 @@ import { mkdir, mkdtemp, readFile, realpath, rm, writeFile } from 'node:fs/promi
 import { tmpdir } from 'node:os';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
+import { typographyPresets, typographyRhythms } from './lib/typography.mjs';
 
 const repoRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
 const cliPath = path.join(repoRoot, 'bin', 'norna.mjs');
@@ -47,12 +48,29 @@ try {
 	assert.equal(initializedPackageJson.scripts['engine:update'], undefined);
 	assert.equal(initializedPackageJson.scripts['engine:version'], undefined);
 
-	const presetsResult = runCli(['typography:presets']);
+	const presetsResult = runCli(['typography', 'presets']);
 	assert.equal(presetsResult.status, 0, presetsResult.stderr || presetsResult.stdout);
 	assert.match(presetsResult.stdout, /quiet-gallery:/);
 	assert.match(presetsResult.stdout, /text-forward:/);
-
-	const showResult = runCli(['--site-dir', path.join(initializedSiteRoot, 'site'), 'typography:show']);
+	assert.match(presetsResult.stdout, /rhythms:/);
+	assert.match(presetsResult.stdout, /normal:/);
+	for (const [presetName, preset] of Object.entries(typographyPresets)) {
+		for (const [level, heading] of Object.entries(preset.headings)) {
+			assert.equal(heading.size, 'medium', `${presetName} ${level} should use medium size`);
+		}
+		assert.equal(preset.body.size, 'medium', `${presetName} body should use medium size`);
+		assert.equal(preset.caption.size, 'medium', `${presetName} caption should use medium size`);
+	}
+	for (const [rhythmName, rhythm] of Object.entries(typographyRhythms)) {
+		for (const [level, heading] of Object.entries(rhythm.headings)) {
+			assert.match(heading.spacingBefore, /^(0|[\d.]+em)$/, `${rhythmName} ${level} spacingBefore should be text-relative`);
+			assert.match(heading.spacingAfter, /^[\d.]+em$/, `${rhythmName} ${level} spacingAfter should be text-relative`);
+		}
+		assert.match(rhythm.body.paragraphSpacing, /^[\d.]+em$/, `${rhythmName} body paragraphSpacing should be text-relative`);
+		assert.match(rhythm.caption.spacingBefore, /^[\d.]+em$/, `${rhythmName} caption spacingBefore should be text-relative`);
+	}
+
+	const showResult = runCli(['--site-dir', path.join(initializedSiteRoot, 'site'), 'typography', 'show']);
 	assert.equal(showResult.status, 0, showResult.stderr || showResult.stdout);
 	assert.match(showResult.stdout, /theme:/);
 	assert.match(showResult.stdout, /pages:/);

package/scripts/test-package-check.mjs

@@ -181,18 +181,18 @@ try {
 	await writeFile(
 		packageCheckConfigPath,
 		packageCheckConfig
-			.replace("url: 'https://example.com/'", "url: 'https://example.com/gallery/'")
-			.replace("basePath: '/'", "basePath: '/gallery/'"),
+			.replace("url: 'https://example.com/'", "url: 'https://example.com/site/'")
+			.replace("basePath: '/'", "basePath: '/site/'"),
 	);
 	const packageCheckThemePath = path.join(siteProjectRoot, 'site', 'theme.md');
 	const packageCheckTheme = await readFile(packageCheckThemePath, 'utf8');
 	await writeFile(
 		packageCheckThemePath,
-		packageCheckTheme.replace('brand: Example Gallery', 'brand: Package Check Brand'),
+		packageCheckTheme.replace('brand: Example Site', 'brand: Package Check Brand'),
 	);
 	await mkdir(path.join(siteProjectRoot, 'site', 'routes', 'about'), { recursive: true });
 	await writeFile(path.join(siteProjectRoot, 'site', 'routes', 'about', 'route-content.md'), `---
-title: About the gallery
+title: About the site
 description: Route used by package checks.
 navigation:
   label: About
@@ -237,6 +237,14 @@ This route verifies that packaged norna sites can build route pages.
 		path.join(siteProjectRoot, 'dist', 'index.html'),
 		'--section-heading-font-size-desktop: clamp(1.35rem, 1.1rem + 0.9vw, 2rem)',
 	);
+	await assertFileIncludes(
+		path.join(siteProjectRoot, 'dist', 'index.html'),
+		'--section-heading-spacing-after: 0.55em',
+	);
+	await assertFileIncludes(
+		path.join(siteProjectRoot, 'dist', 'index.html'),
+		'--section-markdown-h3-spacing-before: 1.5em',
+	);
 	await assertFileIncludes(
 		path.join(siteProjectRoot, 'dist', 'index.html'),
 		"--font-sans: Arial, 'Helvetica Neue', Helvetica, sans-serif",
@@ -247,15 +255,15 @@ This route verifies that packaged norna sites can build route pages.
 	);
 	await assertFileIncludes(
 		path.join(siteProjectRoot, 'dist', 'about', 'index.html'),
-		'<link rel="canonical" href="https://example.com/gallery/about/">',
+		'<link rel="canonical" href="https://example.com/site/about/">',
 	);
 	await assertFileIncludes(
 		path.join(siteProjectRoot, 'dist', 'about', 'index.html'),
-		'href="/gallery/about/" aria-current="page"',
+		'href="/site/about/" aria-current="page"',
 	);
 	await assertFileIncludes(
 		path.join(siteProjectRoot, 'dist', 'index.html'),
-		'<a class="site-brand" href="/gallery/">Package Check Brand</a>',
+		'<a class="site-brand" href="/site/">Package Check Brand</a>',
 	);
 	await assertFileIncludes(
 		path.join(siteProjectRoot, 'dist', 'index.html'),
@@ -273,6 +281,14 @@ This route verifies that packaged norna sites can build route pages.
 		path.join(siteProjectRoot, 'dist', 'index.html'),
 		'--section-caption-line-height: 1.35',
 	);
+	await assertFileIncludes(
+		path.join(siteProjectRoot, 'dist', 'index.html'),
+		'--section-caption-spacing-before: 0.5em',
+	);
+	await assertFileIncludes(
+		path.join(siteProjectRoot, 'dist', 'index.html'),
+		'--section-caption-font-size-desktop: clamp(0.86rem, 0.84rem + 0.08vw, 0.92rem)',
+	);
 	await assertFileIncludes(
 		path.join(siteProjectRoot, 'dist', 'index.html'),
 		'class="inline-style inline-style-highlight" style="--inline-style-color: #ffd84d"',
@@ -306,7 +322,7 @@ This route verifies that packaged norna sites can build route pages.
 	await assertFileExists(path.join(siteProjectRoot, 'dist', 'favicon.ico'));
 	await assertFileIncludes(
 		path.join(siteProjectRoot, 'dist', 'index.html'),
-		'<link rel="icon" sizes="any" href="/gallery/favicon.ico">',
+		'<link rel="icon" sizes="any" href="/site/favicon.ico">',
 	);
 	await assertFileExcludes(
 		path.join(siteProjectRoot, 'dist', 'index.html'),
@@ -316,12 +332,12 @@ This route verifies that packaged norna sites can build route pages.
 	const siteContent = await readFile(siteContentPath, 'utf8');
 	const siteThemePath = path.join(siteProjectRoot, 'site', 'theme.md');
 	const siteTheme = await readFile(siteThemePath, 'utf8');
-	await writeFile(siteThemePath, siteTheme.replace('\n    preset: quiet-gallery', '\n    preset: noisy-gallery'));
+	await writeFile(siteThemePath, siteTheme.replace('\n  preset: quiet-gallery', '\n  preset: noisy-gallery'));
 	await runExpectFailure(
 		npxBin,
 		['norna', 'build'],
 		{ cwd: siteProjectRoot, env: npmEnv },
-		'presentation.typography.preset',
+		'typography.preset',
 	);
 	await writeFile(
 		siteThemePath,
@@ -371,14 +387,14 @@ This route verifies that packaged norna sites can build route pages.
 		siteContentPath,
 		siteContent.replace(
 			'      typography:\n        preset: statement',
-			'      typography:\n        overrides:\n          caption:\n            spacing: wide',
+			'      typography:\n        overrides:\n          caption:\n            spacingBefore: wide',
 		),
 	);
 	await runExpectFailure(
 		npxBin,
 		['norna', 'build'],
 		{ cwd: siteProjectRoot, env: npmEnv },
-		'sections.0.presentation.typography.overrides.caption.spacing',
+		'sections.0.presentation.typography.overrides.caption.spacingBefore',
 	);
 	await writeFile(
 		siteContentPath,
@@ -390,11 +406,9 @@ This route verifies that packaged norna sites can build route pages.
 		{ cwd: siteProjectRoot, env: npmEnv },
 		'sections.0.presentation.typography.preset',
 	);
-	const siteConfigPath = path.join(siteProjectRoot, 'site', 'config.mjs');
-	const siteConfig = await readFile(siteConfigPath, 'utf8');
 	await writeFile(
-		siteConfigPath,
-		siteConfig.replace(
+		siteThemePath,
+		siteTheme.replace(
 			'fontFamily: "Arial, \'Helvetica Neue\', Helvetica, sans-serif"',
 			'fontFamily: "Arial; color: red"',
 		),
@@ -405,9 +419,12 @@ This route verifies that packaged norna sites can build route pages.
 		{ cwd: siteProjectRoot, env: npmEnv },
 		'typography.fontFamily',
 	);
+	await writeFile(siteThemePath, siteTheme);
+	const siteConfigPath = path.join(siteProjectRoot, 'site', 'config.mjs');
+	const siteConfig = await readFile(siteConfigPath, 'utf8');
 	await writeFile(
 		siteConfigPath,
-		siteConfig.replace("basePath: '/gallery/'", "basePath: 'gallery'"),
+		siteConfig.replace("basePath: '/site/'", "basePath: 'site'"),
 	);
 	await runExpectFailure(
 		npxBin,

package/scripts/test-temporary-visibility.mjs

@@ -49,9 +49,8 @@ try {
 };
 `);
 	await writeFile(path.join(siteDir, 'theme.md'), `---
-presentation:
-  typography:
-    preset: quiet-gallery
+typography:
+  preset: quiet-gallery
 frame:
   colors: presentation
 ---

package/src/components/SitePage.astro

@@ -27,10 +27,9 @@ const navigationPages = getNavigationPages(sitePages);
 const homePage = sitePages.find((page) => page.isHome) ?? currentPage;
 const themeData = theme?.data ?? {};
 const brandLabel = themeData.navigation?.brand ?? homePage.title;
-const pagePresentation = resolvePagePresentation(themeData.presentation, entry.data.presentation);
+const pagePresentation = resolvePagePresentation(themeData, entry.data.presentation);
 const frameColors = resolveFrameColors({
-	themePresentation: themeData.presentation,
-	themeFrame: themeData.frame,
+	theme: themeData,
 	pagePresentation,
 	pageFrame: entry.data.frame,
 });