Serve every font from this server and surface open tasks in 1.14.0
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s

Fonts were still reachable from Google in two places. The editor and area
previews were handed `googleFonts` and no `localFonts`, so the screen used
most of the day fetched Lato from fonts.googleapis.com on every open; the
public page fell back to the same link whenever the files were missing.
Neither path remains: the template has no Google branch, `googleFontsUrl()`
is gone, and the policies name no foreign font host - `font-src 'self'`
publicly, `style-src 'self'; font-src 'self'` in administration. Without
local files a site now shows the theme's fallback and says so.

Preloading took the first two weights per family. The Kant-IT theme names
Lato 400, 700 and 900 and sets its headings on 800/900, so the one weight
that carried them loaded after the stylesheet and `font-display:swap`
swapped the heading in plain sight. Every weight of the theme is preloaded
now, latin subset, and the links sit before the stylesheet: measured cold,
all three files finish at 168 ms against a first paint at 292 ms.

Open tasks no longer hide on the screen that owns them. A strip above every
management screen names what needs a button and carries it: a new version
leads to System, missing fonts to Design. Neither asks the network - the
version comes from the daily update-check task, the fonts from a look in
the folder.

System and update was unusable on a phone: `.stack` is a grid whose
automatic column grows to its widest content, and one long database path
pushed the page sideways. It gets `minmax(0, 1fr)`, the backup table stacks
below 620px, and the prose is 45% shorter with the fine print folded away.

The device chips drew the current device with an outline, which lies outside
the box, ran under its neighbour and was clipped by the sidebar - it read as
a cut-off red frame. Used devices are filled in `#9d4e0d` now (5.6:1), the
current one carries a border inside the chip.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
kantarciandClaude Opus 5 committed 2026-09-15 00:16:16 +02:00
1 parent 858b8c6de4
commit a434e0cefc
19 files changed
+345 -126

No files matched your search

+6 -4
View File
@@ -108,9 +108,11 @@ final class FontLibrary
/**
* Die Dateien, die für den ersten Eindruck vorab geholt werden sollen.
*
* Nur der lateinische Grundbereich und nur die Schnitte, die im Fließtext und in
* Überschriften stehen - ein Vorabholen, das alles holt, verzögert genau das, was es
* beschleunigen soll.
* Jeder Schnitt, den das Theme nennt, im lateinischen Grundbereich. Die früheren „ersten
* zwei je Familie“ ließen genau den Schnitt aus, der die Überschriften trägt: Lato 900 lud
* erst nach dem Stylesheet, und mit `font-display:swap` sprang die Überschrift sichtbar von
* der Ersatzschrift auf die richtige. Die erweiterten Bereiche bleiben draußen - sie werden
* nur für Zeichen gebraucht, die auf den meisten Seiten nicht vorkommen.
*
* @return list<string>
*/
@@ -118,7 +120,7 @@ final class FontLibrary
{
$preload = [];
foreach ($this->wanted($theme) as $family => $weights) {
foreach (array_slice($weights, 0, 2) as $weight) {
foreach ($weights as $weight) {
$name = $this->slug($family).'-'.$weight.'-latin.woff2';
if (is_file($this->directory.'/'.$name)) {
$preload[] = '/assets/fonts/'.$name;
-15
View File
@@ -329,19 +329,4 @@ final class Theme
).ButtonDesign::css($theme['buttons'] ?? ButtonDesign::defaults($base));
}
/**
* The Google Fonts stylesheet for every family that comes from there, or null when none does.
* Chosen by the user; it means one request to a third party per page view.
*/
public function googleFontsUrl(array $theme): ?string
{
$families = [];
foreach ($theme['fonts'] as $font) {
if ('google' === $font['source'] && '' !== $font['family']) {
$families[] = sprintf('family=%s:wght@%s', str_replace(' ', '+', $font['family']), implode(';', $font['weights']));
}
}
return [] === $families ? null : 'https://fonts.googleapis.com/css2?'.implode('&', array_unique($families)).'&display=swap';
}
}
+3 -2
View File
@@ -5,6 +5,7 @@ namespace App\Controller;
use App\Content\CustomCode;
use App\Content\DemoContent;
use App\Content\DocumentValidator;
use App\Content\FontLibrary;
use App\Content\MenuRepository;
use App\Content\PageRepository;
use App\Content\PartialRepository;
@@ -28,7 +29,7 @@ use Symfony\Component\Security\Csrf\CsrfTokenManagerInterface;
#[Route('/%kant.admin_path%')]
final class EditorController extends AbstractController
{
public function __construct(private PageRepository $pages, private DocumentValidator $validator, private MenuRepository $menus, private PostRepository $posts, private Theme $theme, private StyleCompiler $styles, private RedirectRepository $redirects, private PartialRepository $partials, private CustomCode $code, private CsrfTokenManagerInterface $csrf, private RequestStack $requests)
public function __construct(private PageRepository $pages, private DocumentValidator $validator, private MenuRepository $menus, private PostRepository $posts, private Theme $theme, private StyleCompiler $styles, private RedirectRepository $redirects, private PartialRepository $partials, private CustomCode $code, private FontLibrary $fonts, private CsrfTokenManagerInterface $csrf, private RequestStack $requests)
{
}
@@ -435,7 +436,7 @@ final class EditorController extends AbstractController
$navigation[$slot] = $this->menus->resolve($menu['items'], (string) $page['path']);
}
return $this->render('page.html.twig', ['page' => [...$page, 'document' => $document], 'canonical' => '', 'editing' => true, 'navigation' => $navigation, 'areas' => $areas, 'sections' => $sections, 'needsTabs' => false, 'pageStyles' => $this->theme->css($theme).$this->styles->compileDocument($document), 'googleFonts' => $this->theme->googleFontsUrl($theme)]);
return $this->render('page.html.twig', ['page' => [...$page, 'document' => $document], 'canonical' => '', 'editing' => true, 'navigation' => $navigation, 'areas' => $areas, 'sections' => $sections, 'needsTabs' => false, 'pageStyles' => $this->theme->css($theme).$this->styles->compileDocument($document), 'localFonts' => $this->fonts->hasLocal($theme) ? $this->fonts->preload($theme) : []]);
}
if (!isset($body['expectedVersion']) || !is_int($body['expectedVersion']) || $body['expectedVersion'] < 0) {
throw new \InvalidArgumentException();
+9 -17
View File
@@ -70,8 +70,6 @@ final class PageController extends AbstractController
private function renderPage(Request $request, array $page, string $path, int $status = 200): Response
{
$styles = '';
$googleFonts = null;
$localFonts = [];
// The page decides which header and footer it gets - including none.
$areas = $this->areas($status >= 400 ? null : $page);
$theme = $this->theme->load();
@@ -88,13 +86,11 @@ final class PageController extends AbstractController
foreach ([...array_values($areas), ...array_values($sections)] as $extra) {
$styles .= $this->styles->compileDocument($extra).$this->code->compileDocument($extra);
}
// Liegen die Schriften auf dem eigenen Server, wird nichts von Google geholt - weder
// die Datei noch die IP-Adresse des Besuchers.
if ($this->fonts->hasLocal($theme)) {
$localFonts = $this->fonts->preload($theme);
} else {
$googleFonts = $this->theme->googleFontsUrl($theme);
}
// Schriften kommen ausschliesslich vom eigenen Server. Fehlen die Dateien, zeigt die
// Website die Ersatzschrift des Themes - nie ein Stylesheet von fonts.googleapis.com:
// das gaebe die IP-Adresse jedes Besuchers an einen Dritten weiter und haengt den
// Seitenaufbau an zwei fremde Verbindungen nacheinander.
$localFonts = $this->fonts->hasLocal($theme) ? $this->fonts->preload($theme) : [];
$response = $this->render('page.html.twig', [
'page' => $page,
'canonical' => $status >= 400 ? null : rtrim($this->siteOrigin, '/').$this->settings->publicPath($path, $this->settings->homePath()),
@@ -133,7 +129,6 @@ final class PageController extends AbstractController
// ist gar kein Bild, sondern der Hintergrund des ersten Abschnitts.
'heroBackground' => $this->heroBackground($areas['header'] ?? null, $page['document']),
'pageStyles' => $styles,
'googleFonts' => $googleFonts,
'localFonts' => $localFonts,
'styleBundle' => $this->bundle->url([] !== $localFonts),
], new Response(status: $status));
@@ -151,7 +146,7 @@ final class PageController extends AbstractController
$response->headers->set('X-Robots-Tag', 'noindex, follow');
}
return $this->shell($response, $wantsScript, $styles, null !== $googleFonts, $frames);
return $this->shell($response, $wantsScript, $styles, $frames);
}
/**
@@ -167,18 +162,15 @@ final class PageController extends AbstractController
* Nothing is added to the policy for an embed still waiting
* for consent.
*/
private function shell(Response $response, bool $allowScript = false, string $styles = '', bool $googleFonts = false, array $frameHosts = []): Response
private function shell(Response $response, bool $allowScript = false, string $styles = '', array $frameHosts = []): Response
{
$styleSources = ["'self'"];
if ('' !== $styles) {
$styleSources[] = sprintf("'sha256-%s'", base64_encode(hash('sha256', $styles, true)));
}
// Stylesheets und Schriftdateien kommen nur von hier. Kein fonts.googleapis.com, kein
// fonts.gstatic.com - die Regel steht in der Kopfzeile und nicht nur in der Vorlage.
$fontSources = ["'self'"];
if ($googleFonts) {
// Chosen deliberately: the stylesheet comes from Google and the files from its CDN.
$styleSources[] = 'https://fonts.googleapis.com';
$fontSources[] = 'https://fonts.gstatic.com';
}
$response->headers->set('Cache-Control', 'no-store');
$response->headers->set('X-Content-Type-Options', 'nosniff');
$response->headers->set('Referrer-Policy', 'strict-origin-when-cross-origin');
+3 -1
View File
@@ -4,6 +4,7 @@ namespace App\Controller;
use App\Content\CustomCode;
use App\Content\DocumentValidator;
use App\Content\FontLibrary;
use App\Content\MenuRepository;
use App\Content\PartialRepository;
use App\Content\StyleCompiler;
@@ -35,6 +36,7 @@ final class PartialController extends AbstractController
private Theme $theme,
private StyleCompiler $styles,
private CustomCode $code,
private FontLibrary $fonts,
private CsrfTokenManagerInterface $csrf,
) {
}
@@ -175,7 +177,7 @@ final class PartialController extends AbstractController
'needsTabs' => false,
'forms' => [],
'pageStyles' => $this->theme->css($theme).$this->styles->compileDocument($document),
'googleFonts' => $this->theme->googleFontsUrl($theme),
'localFonts' => $this->fonts->hasLocal($theme) ? $this->fonts->preload($theme) : [],
]);
}
@@ -51,12 +51,12 @@ final class AdminHeadersSubscriber implements EventSubscriberInterface
$headers->set('X-Content-Type-Options', 'nosniff');
$headers->set('Referrer-Policy', 'same-origin');
$headers->set('Permissions-Policy', 'accelerometer=(), camera=(), display-capture=(), geolocation=(), gyroscope=(), microphone=(), payment=(), usb=()');
// The preview must show the same typeface as the published page, so the font hosts are
// allowed here as well. Everything else stays as narrow as on the public side.
// Die Vorschau zeigt dieselbe Schrift wie die veroeffentlichte Seite - und die liegt,
// genau wie dort, auf diesem Server. Fremde Schrifthosts braucht sie nicht.
// The nonce only ever adds the one script it names; 'self' keeps applying to everything
// else, so nothing is loosened by it.
$nonce = $event->getRequest()->attributes->get('csp_nonce');
$script = is_string($nonce) && '' !== $nonce ? sprintf("'self' 'nonce-%s'", $nonce) : "'self'";
$headers->set('Content-Security-Policy', "default-src 'self'; script-src {$script}; style-src 'self' https://fonts.googleapis.com; font-src 'self' https://fonts.gstatic.com; img-src 'self' https:; object-src 'none'; base-uri 'none'; frame-ancestors 'none'; form-action 'self'");
$headers->set('Content-Security-Policy', "default-src 'self'; script-src {$script}; style-src 'self'; font-src 'self'; img-src 'self' https:; object-src 'none'; base-uri 'none'; frame-ancestors 'none'; form-action 'self'");
}
}
+51 -5
View File
@@ -2,25 +2,71 @@
namespace App\Twig;
use App\Content\FontLibrary;
use App\Content\Theme;
use App\Ops\Updater;
use Twig\Extension\AbstractExtension;
use Twig\TwigFunction;
/**
* The running version, for the administration shell.
* Fassung und offene Hinweise für die Verwaltungshülle.
*
* A function rather than a global, so the templates get exactly this one read-only answer and not
* a whole updater with an update() method on it.
* Funktionen statt Variablen, damit die Vorlagen genau diese Antworten bekommen und nicht einen
* ganzen Updater mit einem update() daran.
*/
final class VersionExtension extends AbstractExtension
{
public function __construct(private Updater $updater, private \Doctrine\DBAL\Connection $db)
public function __construct(private Updater $updater, private \Doctrine\DBAL\Connection $db, private FontLibrary $fonts, private Theme $theme)
{
}
public function getFunctions(): array
{
return [new TwigFunction('kant_version', $this->updater->version(...)), new TwigFunction('kant_update_version', $this->available(...))];
return [
new TwigFunction('kant_version', $this->updater->version(...)),
new TwigFunction('kant_update_version', $this->available(...)),
new TwigFunction('kant_admin_notices', $this->notices(...)),
];
}
/**
* Was auf jedem Verwaltungsbildschirm oben stehen soll, weil es einen Knopf braucht.
*
* Keine Zeile davon geht ins Netz: die verfügbare Fassung steht im Protokoll der täglichen
* Aufgabe, die fehlenden Schriften stehen als Dateien im Ordner. Ein Hinweis, der bei jedem
* Klick eine fremde Verbindung öffnet, wäre die Sorte Hinweis, die man abschaltet.
*
* @return list<array{kind: string, text: string, route: string, action: string, admin: bool}>
*/
public function notices(): array
{
$notices = [];
if (null !== $version = $this->available()) {
$notices[] = [
'kind' => 'update',
'text' => sprintf('Fassung %s ist verfügbar; installiert ist %s.', $version, $this->updater->version()),
'route' => 'admin_system',
'action' => 'Jetzt aktualisieren',
'admin' => true,
];
}
try {
$missing = $this->fonts->missing($this->theme->load());
} catch (\Throwable) {
// Eine Installation, die noch auf ihre Migrationen wartet, hat noch kein Theme.
$missing = [];
}
if ([] !== $missing) {
$notices[] = [
'kind' => 'fonts',
'text' => sprintf('Schriftdateien fehlen auf diesem Server: %s. Bis dahin zeigt die Website die Ersatzschrift.', implode(', ', $missing)),
'route' => 'admin_theme',
'action' => 'Schriften holen',
'admin' => false,
];
}
return $notices;
}
public function available(): ?string