Attic is a cozy space with lofty ambitions. attic.social

favicon proxy

dbushell.com 80acba46 a4794476

verified
+53 -1
+15 -1
src/css/components/bookmark.css
··· 32 32 } 33 33 34 34 & > :is(h2, h3, .flex) { 35 + grid-column: 1 / -1; 36 + } 37 + 38 + & > :is(h2, h3) { 35 39 font-size: var(--font-size-3); 36 - grid-column: 1/ -1; 37 40 38 41 & a { 42 + align-items: start; 43 + column-gap: 5px; 44 + display: flex; 45 + 39 46 &::after { 40 47 content: ""; 41 48 display: block; 42 49 inset: 0; 43 50 position: absolute; 51 + } 52 + 53 + & img { 54 + block-size: 20px; 55 + flex: 0 0 auto; 56 + inline-size: 20px; 57 + margin-block: 2px; 44 58 } 45 59 } 46 60 }
+6
src/routes/bookmarks/[did=did]/+page.svelte
··· 154 154 <article id={entry.cid} class="Bookmark"> 155 155 <h3> 156 156 <a href={entry.url} rel="noopener noreferrer" target="_blank"> 157 + <img 158 + alt="" 159 + width="16" 160 + height="16" 161 + src="/bookmarks/favicon/{new URL(entry.url).hostname}" 162 + /> 157 163 {entry.title} 158 164 </a> 159 165 </h3>
+32
src/routes/bookmarks/favicon/[hostname]/+server.ts
··· 1 + import { redirect } from "@sveltejs/kit"; 2 + import type { RequestHandler } from "./$types"; 3 + 4 + const copyHeaders = [ 5 + "Age", 6 + "Cache-Control", 7 + "Cotent-Type", 8 + "Date", 9 + "Last-Modified", 10 + ]; 11 + 12 + export const GET: RequestHandler = async (event) => { 13 + const url = URL.parse(`https://${event.params.hostname}`); 14 + if (url === null) { 15 + return redirect(303, "/images/favicon.svg"); 16 + } 17 + const response = await event.fetch( 18 + `https://twenty-icons.com/${url.hostname}/32`, 19 + ); 20 + if (response.ok === false) { 21 + return redirect(303, "/images/favicon.svg"); 22 + } 23 + if (response.headers.get("Content-Type") !== "image/png") { 24 + return redirect(303, "/images/favicon.svg"); 25 + } 26 + const headers = new Headers(); 27 + for (const name of copyHeaders) { 28 + const value = response.headers.get(name); 29 + if (value) headers.set(name, value); 30 + } 31 + return new Response(response.body, { headers }); 32 + };