+1 -1

app/lish/[did]/[publication]/[rkey]/TextBlock.tsx

··· 55 55 PubLeafletRichtextFacet.isHighlight, 56 56 ); 57 57 let className = ` 58 58 - ${id ? "scroll-mt-6 scroll-mb-10" : ""} 58 58 + ${id ? "scroll-mt-12 scroll-mb-10" : ""} 59 59 ${isBold ? "font-bold" : ""} 60 60 ${isItalic ? "italic" : ""} 61 61 ${isUnderline ? "underline" : ""}

+4

app/lish/[did]/[publication]/[rkey]/l-quote/[quote]/opengraph-image.ts

··· 10 10 let quotePosition = decodeQuotePosition(props.params.quote); 11 11 return getMicroLinkOgImage( 12 12 `/lish/${decodeURIComponent(props.params.did)}/${decodeURIComponent(props.params.publication)}/${props.params.rkey}/l-quote/${props.params.quote}#${quotePosition?.start.block.join(".")}_${quotePosition?.start.offset}`, 13 13 + { 14 14 + width: 660, 15 15 + height: 345, 16 16 + }, 13 17 ); 14 18 }

+5 -3

src/utils/getMicroLinkOgImage.ts

··· 1 1 import { headers } from "next/headers"; 2 2 3 3 - export async function getMicroLinkOgImage(path: string) { 4 4 - if (process.env.NODE_ENV === "development") return; 3 3 + export async function getMicroLinkOgImage( 4 4 + path: string, 5 5 + options?: { width?: number; height?: number }, 6 6 + ) { 5 7 const headersList = await headers(); 6 8 const hostname = headersList.get("x-forwarded-host"); 7 9 let protocol = headersList.get("x-forwarded-proto"); 8 10 let full_path = `${protocol}://${hostname}${path}`; 9 11 let response = await fetch( 10 10 - `https://pro.microlink.io/?url=${encodeURIComponent(full_path)}&screenshot=true&viewport.width=1400&viewport.height=733&meta=false&embed=screenshot.url&force=true`, 12 12 + `https://pro.microlink.io/?url=${encodeURIComponent(full_path)}&screenshot=true&viewport.width=${options?.width || 1200}&viewport.height=${options?.height || 733}&meta=false&embed=screenshot.url&force=true`, 11 13 { 12 14 headers: { 13 15 "x-api-key": process.env.MICROLINK_API_KEY!,