Claude Fable 5
418aafd5ec
Some checks failed
CI / Lint, typecheck, test (pull_request) Successful in 4m43s
CI / Build container images (pull_request) Successful in 1m11s
CI / Auth e2e pack (pull_request) Successful in 7m14s
CI / Import/export fidelity gate (pull_request) Successful in 56s
CD / Deploy to Test (push) Blocked by required conditions
CD / Smoke tests against Test (push) Blocked by required conditions
CD / Promote to Int (push) Blocked by required conditions
CI / Auth e2e pack (push) Blocked by required conditions
CI / Import/export fidelity gate (push) Blocked by required conditions
CI / Build container images (push) Blocked by required conditions
CD / Build and push images (push) Has been cancelled
CI / Lint, typecheck, test (push) Has been cancelled
i18n spiegelt die aktive Sprache auf <html lang> (Init + languageChanged; der User-Locale-Wechsel in auth-context läuft über dasselbe Event). Neuer useDocumentTitle-Hook setzt je Route einen sprechenden Titel (Seite — Teich — Dorfteich), verdrahtet in allen Routen-Komponenten; dynamische Titel folgen den geladenen Daten. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01AGM8jo3hwoV9wsCVGfy8iq
44 lines
1.5 KiB
TypeScript
44 lines
1.5 KiB
TypeScript
import { FONT_CATALOG, fontStack } from '@dorfteich/shared';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
import { useDocumentTitle } from '../lib/use-document-title';
|
|
/**
|
|
* Font catalog attribution page (issue #66, ADR 0016): lists every self-hosted
|
|
* family with its license, rendered in the font itself. The self-hosting is the
|
|
* GDPR guarantee — this page is the human-readable attribution surface.
|
|
*/
|
|
export function FontCatalogPage(): React.JSX.Element {
|
|
const { t } = useTranslation('font');
|
|
useDocumentTitle(t('catalog.title'));
|
|
return (
|
|
<div className="font-catalog">
|
|
<h1>{t('catalog.title')}</h1>
|
|
<p>{t('catalog.intro')}</p>
|
|
<table className="font-catalog__table">
|
|
<thead>
|
|
<tr>
|
|
<th>{t('catalog.family')}</th>
|
|
<th>{t('catalog.category')}</th>
|
|
<th>{t('catalog.weights')}</th>
|
|
<th>{t('catalog.license')}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{FONT_CATALOG.map((font) => (
|
|
<tr key={font.family}>
|
|
<td style={{ fontFamily: fontStack(font.family) }}>{font.family}</td>
|
|
<td>{t(`category.${font.category}`)}</td>
|
|
<td>{font.weights.join(', ')}</td>
|
|
<td>
|
|
<a href={font.licenseUrl} target="_blank" rel="noreferrer noopener">
|
|
{font.license}
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
);
|
|
}
|