Files
pictureFrame-webApp/templates/token/decline.html.twig
T
football2801 6c9959c00d
CI / test (push) Has been cancelled
fix(pwa): serve apple-touch-icon + favicons from root, add sizes hint
iOS Safari's Add-to-Home-Screen flow probes /apple-touch-icon.png at the
site root in addition to the <link rel> on the page. Those root paths
currently 302 through Symfony's auth firewall to /login, so iOS gets HTML
where it expects a PNG and falls back to whatever it cached from earlier
installs (the 1 KB placeholder icon). Dropping the real PNG (and the
-precomposed alias) directly in public/ makes nginx serve them as static
files, ahead of the firewall.

Also adds favicon.svg and a multi-size favicon.ico at the root for
browsers/bots that probe / paths instead of reading <link>, and adds
sizes="180x180" to every apple-touch-icon link so iOS doesn't have to
guess.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-15 00:48:01 -04:00

40 lines
1.8 KiB
Twig

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/svg+xml" href="/build/favicon.svg">
<link rel="icon" type="image/png" sizes="32x32" href="/build/icons/favicon-32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/build/icons/favicon-16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/build/icons/apple-touch-icon.png">
<title>Decline photo — WeVisto</title>
<style>
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,sans-serif;min-height:100dvh;background:#fdf6ee;color:#3a2e22;display:flex;align-items:flex-start;justify-content:center;padding:2rem 1rem}
.card{width:100%;max-width:420px}
h1{font-size:1.4rem;font-weight:700;margin-bottom:.25rem}
.sub{font-size:.875rem;color:#8a7060;margin-bottom:1.5rem}
.thumb{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;margin-bottom:1.5rem;background:#e8d9c4}
.btn{display:block;width:100%;padding:.875rem;border:none;border-radius:10px;font-size:1rem;font-weight:700;cursor:pointer;text-align:center;text-decoration:none;margin-bottom:.75rem}
.btn-danger{background:#d93025;color:#fff}
.btn-ghost{background:transparent;border:1.5px solid #e8d9c4;color:#8a7060}
</style>
</head>
<body>
<div class="card">
<h1>Decline this photo?</h1>
<p class="sub">It won't be added to any of your frames.</p>
<img class="thumb" src="/api/images/{{ token.image.id }}/thumbnail" alt="Shared photo">
<form method="post">
<button class="btn btn-danger" type="submit">Yes, decline</button>
</form>
{% if approveUuid %}
<a class="btn btn-ghost" href="/token/{{ approveUuid }}/approve">Actually, I want to add it</a>
{% endif %}
</div>
</body>
</html>