+1 -1

web/src/app.html

View file Reviewed

··· 14 14 <meta name="author" content="Tangled" /> 15 15 <meta name="robots" content="index, follow" /> 16 16 <link rel="icon" href="/logos/dolly.ico" sizes="48x48" /> 17 17 - <link rel="icon" href="/logos/dolly.svg" sizes="any" type="image/svg+xml" /> 17 17 + <link rel="icon" href="/favicon.svg" sizes="any" type="image/svg+xml" /> 18 18 <link rel="apple-touch-icon" href="/logos/dolly.png" /> 19 19 <link rel="preconnect" href="https://avatar.tangled.sh" /> 20 20 <link rel="preconnect" href="https://camo.tangled.sh" />

+22

web/src/routes/favicon.svg/+server.ts

View file Reviewed

··· 1 1 + import { dev } from "$app/environment"; 2 2 + import dolly from "../../../static/logos/dolly.svg?raw"; 3 3 + import type { RequestHandler } from "./$types"; 4 4 + 5 5 + // the logo is monochrome and tracks the color scheme, so we repaint the favicon 6 6 + // per environment to tell a local or next tab apart from production at a glance 7 7 + const devTint = "#d97706"; // --color-foreground-warning 8 8 + const nextTint = "#4338ca"; // --color-foreground-info 9 9 + 10 10 + export const prerender = false; 11 11 + 12 12 + export const GET: RequestHandler = ({ url }) => { 13 13 + const tint = dev ? devTint : url.hostname === "next.tangled.org" ? nextTint : null; 14 14 + const svg = tint ? dolly.replace(/color:\s*#[0-9a-f]{3,8};/gi, `color: ${tint};`) : dolly; 15 15 + 16 16 + return new Response(svg, { 17 17 + headers: { 18 18 + "content-type": "image/svg+xml", 19 19 + "cache-control": dev ? "no-store" : "public, max-age=3600" 20 20 + } 21 21 + }); 22 22 + };