diff --git a/static/icon-180.png b/static/icon-180.png index 72d7204..c8449a6 100644 Binary files a/static/icon-180.png and b/static/icon-180.png differ diff --git a/static/icon-512.png b/static/icon-512.png index 6bb8b32..25c2b0c 100644 Binary files a/static/icon-512.png and b/static/icon-512.png differ diff --git a/tools/make_icons.py b/tools/make_icons.py index a29f4c6..58bac36 100644 --- a/tools/make_icons.py +++ b/tools/make_icons.py @@ -4,14 +4,17 @@ python3 tools/make_icons.py Writes static/icon-180.png (what iOS uses on the home screen) and -static/icon-512.png (Android / the web manifest): the white mark on a -transparent background, which iOS lays over black on the home screen. +static/icon-512.png (Android / the web manifest): the white mark on +the app's dark background color. iOS flattens a transparent PNG onto +white rather than black, which made the white-on-transparent mark +invisible on the home screen -- so the background needs to be baked +into the PNG itself. The PNGs are committed, so this only needs running if the logo changes. It rasterises with headless Chromium, which is a heavy thing to install for one job -- if you have librsvg to hand, this does the same: - rsvg-convert -w 512 -h 512 static/logo.svg -o static/icon-512.png + rsvg-convert -w 512 -h 512 --background-color '#0a0d14' static/logo.svg -o static/icon-512.png Otherwise: pip install playwright && playwright install chromium """ @@ -23,10 +26,11 @@ STATIC = Path(__file__).resolve().parent.parent / "static" LOGO = STATIC / "logo.svg" SIZES = (180, 512) MARGIN = 0.14 # breathing room, so iOS's rounded mask never clips it +BACKGROUND = "#0a0d14" # matches theme_color/background_color in the manifest PAGE = """ @@ -49,12 +53,12 @@ def main(): browser = p.chromium.launch(args=["--no-sandbox"]) for size in SIZES: inner = round(size * (1 - 2 * MARGIN)) - scratch.write_text(PAGE.format(size=size, inner=inner)) + scratch.write_text(PAGE.format(size=size, inner=inner, background=BACKGROUND)) page = browser.new_page(viewport={"width": size, "height": size}) page.goto(scratch.as_uri()) page.wait_for_timeout(120) # let the SVG paint target = STATIC / f"icon-{size}.png" - page.screenshot(path=target, omit_background=True) + page.screenshot(path=target) page.close() print(f"wrote {target} ({target.stat().st_size} bytes)") browser.close()