Polish Pocket Home Screen name and Apple touch icons - #584
Conversation
Deploying mouseterm with
|
| Latest commit: |
165d003
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://8d997e28.mouseterm.pages.dev |
| Branch Preview URL: | https://pocket-app-marketing.mouseterm.pages.dev |
dormouse-bot
left a comment
There was a problem hiding this comment.
Reviewing as a draft — flagging anything that looks worth a quick fix. Mark ready for a full review.
The PNG swap itself is right: the new apple-touch-icon.png is 180 × 180, fully opaque, #43423d to all four corners (0 transparent pixels), so iOS's mask has nothing to double up on. Both copies are byte-identical. Four things below.
1. The checked-in SVG doesn't reproduce the PNG it's filed as the source for. website/public/apple-touch-icon.svg rendered at 180 × 180 gives transparent corners, a white ring, and an inset charcoal tile — the exact artifact this PR removes. Its outer bg-enlarged rect is fill:#ffffff with ry="202.29759", and the #43423d rounded-rect sits inset by roughly 55/1024 after its transform. So the shipped PNG must have come from a cropped or zoomed export region that nothing in the file records; the next person who regenerates from this "source" reintroduces the bug. Worth either baking the edge-to-edge background into the SVG so a plain full-viewBox render matches, or noting the export region beside it.
2. That SVG is a byte-copy of website/public/favicon.svg. Stripping sodipodi:/inkscape: editor attributes and the <sodipodi:namedview> block leaves the two files character-for-character identical (36,240 chars each) — the only real diffs are docname, inkscape:version, and the editor's zoom/window geometry. Nothing references apple-touch-icon.svg, and Vite copies public/ verbatim, so it ships 38 KB of unreferenced Inkscape source (guides, Icon Mask clip path, App Icon Guides symbol) to the deployed site. If the source needs to live somewhere, one copy plus a note that both icons derive from it beats a second near-identical file.
3. The manifest icons still have the old inset tile, so Android keeps the double boundary. lib/pocket/public/icon-192.png and icon-512.png are untouched and both are transparent at all four corners — 13,559/36,864 and 96,280/262,144 fully transparent pixels. Those are the icons entries the manifest points at, so the Chrome/Android Home Screen still composites an inset rounded tile inside the launcher's own mask. The PR title scopes to Apple, so this may be deliberate — but the "second boundary" problem is only half fixed.
4. docs/specs/pocket-app.md isn't updated. AGENTS.md: "When code covered by a spec changes, change the spec." Two rules in "Installable web app" are touched. It states "The manifest and icons must be checked-in source under lib/pocket/public/", and the icon's SVG source landed in website/public/ instead — either the placement or the rule wants adjusting. And the new Home Screen label is a two-places-must-agree invariant: short_name in the manifest and apple-mobile-web-app-title in lib/pocket/index.html have to stay equal or iOS and Android disagree about what the icon is called, which is exactly the kind of rule the spec conventions say to record. Heads-up that pocket-app.md is sitting exactly at its 4,050-word budget, so any addition needs node scripts/spec-lint.mjs --ratchet docs/specs/pocket-app.md in the same commit.
Happy to push a commit for any of these — say which.
How I checked
- Corner/alpha counts: decoded each PNG's IDAT directly and sampled
(0,0),(w-1,0),(0,h-1),(w-1,h-1)plus a full-image count of pixels withA == 0. - SVG render: headless Chromium screenshot of
website/public/apple-touch-icon.svgatwidth=180 height=180with a transparent default background. - SVG equality: stripped
\s(sodipodi|inkscape):[\w-]+="[^"]*"and the<sodipodi:namedview …/>element from both files, collapsed whitespace, compared. - Budget:
node scripts/spec-lint.mjs --ratchet docs/specs/pocket-app.mdleftscripts/spec-word-budgets.jsonunchanged, so 4,050 is already the rounded-up current size. pnpm lint:specsandpublic-docs-lintboth pass on this head.
|
Addressed the review in d86a819 and 165d003:
|
|
Verified 1 and 2 on 1 confirms, independently of your export. I re-rendered the saved SVG at 180 × 180 in headless Chromium — a different rasterizer than Inkscape, so this is a cross-check rather than a repeat — and the artifact is gone. The 2 confirms. The file is out of One thing worth putting in the thread since the spec won't carry it: the two-places-must-agree values do agree today — How I checked
|
Pocket’s Home Screen label used the generic short name “Pocket,” and the Apple touch icon included an inset rounded tile that acquired a second boundary when iOS masked it. Use “Dormouse” for the short name and explicit iOS title, while retaining “Dormouse Pocket” as the full app name.
Replace the website and Pocket Apple touch icons with matching 180 × 180 exports of the original mouse artwork on an edge-to-edge charcoal background. Keep the editable SVG in website/src/assets/apple-touch-icon.svg, outside the public assets.
Validation: Pocket production build passed, including worker and shell checks. A full-page Inkscape render of the saved SVG at 180 × 180 matches both shipped PNGs pixel for pixel; all pixels are opaque and all corners are charcoal (#43423d). git diff --check passed.