MichilisandClaude Opus 5
e4eb1617d1
GSAP carries the counter roll-ups, the bandeja card physics, the dialog transitions and the three success moments FLOWS.md allows. Every one of them checks prefers-reduced-motion first and does nothing when it is set. boneyard and canvas-ui are not what SPEC.md's stack table says they are: on npm the names belong to two abandoned projects that do neither job. The skeletons were already ours; the two canvas spots are now sixty lines each with no dependency. DECISIONS.md records the substitution. The app installs, keeps a scan taken with no network in IndexedDB and sends it when there is one, falls back to a page that explains itself, and can push a deadline notice. Reading the log of what is queued is the source of truth, so the notice clears when the capture actually lands. The CSP now allows scripts by per-request nonce rather than by 'unsafe-inline'. That forced /offline to render per request: a prerendered page carries a build-time nonce no live policy matches, so its scripts were blocked and it never hydrated. Two crashes fixed on the way. web-push throws on a VAPID subject that is not https: or mailto:, and the code handed it APP_PUBLIC_URL, so any machine with push keys died at boot; a misconfigured optional channel now switches itself off and says why. And a subscription the push service answers 410 for is deleted rather than retried forever. Lighthouse on the production build: accessibility 100, best practices 96, SEO 100, performance 73. The performance number is not trustworthy on this machine and DECISIONS.md says why; total blocking time did fall from 17.6s to 1.7s once the hero canvas stopped drawing at full resolution every frame and the landing page stopped importing GSAP. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
55 lines
2.1 KiB
JavaScript
55 lines
2.1 KiB
JavaScript
/**
|
|
* Renders the app icons from one SVG so the set never drifts.
|
|
*
|
|
* node apps/web/scripts/generate-icons.mjs
|
|
*
|
|
* Chromium comes with Playwright, which the repository already has for the e2e suite, so
|
|
* this needs no image library. The output is committed: a build must not depend on a
|
|
* browser being installed.
|
|
*/
|
|
import { chromium } from '@playwright/test';
|
|
import { mkdir, writeFile } from 'node:fs/promises';
|
|
import { dirname, join } from 'node:path';
|
|
import { fileURLToPath } from 'node:url';
|
|
|
|
const PUBLIC_DIR = join(dirname(fileURLToPath(import.meta.url)), '..', 'public');
|
|
|
|
/** Deep teal, the accent from globals.css, with the check the product is built around. */
|
|
const svg = (size, padded) => `
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" viewBox="0 0 512 512">
|
|
<rect width="512" height="512" rx="${padded ? 0 : 112}" fill="#0d6b6b"/>
|
|
<path d="M148 268 L222 342 L364 178"
|
|
fill="none" stroke="#ffffff" stroke-width="46"
|
|
stroke-linecap="round" stroke-linejoin="round"
|
|
transform="translate(256 256) scale(${padded ? 0.72 : 1}) translate(-256 -256)"/>
|
|
</svg>`;
|
|
|
|
const TARGETS = [
|
|
{ file: 'icon-192.png', size: 192, padded: false },
|
|
{ file: 'icon-512.png', size: 512, padded: false },
|
|
// Maskable icons are cropped to a circle on Android, so the mark sits inside a safe area
|
|
// and the background reaches every corner.
|
|
{ file: 'icon-maskable-512.png', size: 512, padded: true },
|
|
{ file: 'apple-touch-icon.png', size: 180, padded: true },
|
|
];
|
|
|
|
const browser = await chromium.launch();
|
|
try {
|
|
await mkdir(PUBLIC_DIR, { recursive: true });
|
|
for (const target of TARGETS) {
|
|
const page = await browser.newPage({
|
|
viewport: { width: target.size, height: target.size },
|
|
deviceScaleFactor: 1,
|
|
});
|
|
await page.setContent(
|
|
`<body style="margin:0">${svg(target.size, target.padded)}</body>`,
|
|
);
|
|
const png = await page.screenshot({ omitBackground: true });
|
|
await writeFile(join(PUBLIC_DIR, target.file), png);
|
|
await page.close();
|
|
console.log(`wrote ${target.file}`);
|
|
}
|
|
} finally {
|
|
await browser.close();
|
|
}
|