diff --git a/app/api/og/collection/[id]/route.tsx b/app/api/og/collection/[id]/route.tsx index 59c944bc..2dc481b3 100644 --- a/app/api/og/collection/[id]/route.tsx +++ b/app/api/og/collection/[id]/route.tsx @@ -3,7 +3,7 @@ /** * OG card for a public collection (`/c/`). * - * Renders a 1200×630 image with the collection title as the centrepiece, + * Renders a 1200×1200 (square) image with the collection title as the centrepiece, * an item-count line, and the cover image dimmed behind it when present * (flat cream otherwise). Matches the post/profile card aesthetic. * @@ -83,7 +83,7 @@ export async function GET(
{/* Eyebrow */} @@ -154,9 +154,9 @@ export async function GET( fontSize: title.length > 48 ? 60 : 76, fontWeight: 700, color: textPrimary, - lineHeight: 1.15, - marginTop: 24, - maxHeight: 320, + lineHeight: 1.2, + marginTop: 28, + maxHeight: 560, overflow: "hidden", }} > @@ -169,9 +169,9 @@ export async function GET( display: "flex", fontSize: 28, color: textSecondary, - lineHeight: 1.4, - marginTop: 24, - maxHeight: 120, + lineHeight: 1.45, + marginTop: 28, + maxHeight: 280, overflow: "hidden", }} > @@ -188,6 +188,7 @@ export async function GET( flexDirection: "row", alignItems: "center", justifyContent: "space-between", + marginTop: 48, }} >
@@ -202,7 +203,7 @@ export async function GET( ), { width: 1200, - height: 630, + height: 1200, fonts: [ { name: "Noto Sans", diff --git a/app/api/og/post/[id]/route.tsx b/app/api/og/post/[id]/route.tsx index d1d0d82d..277a7383 100644 --- a/app/api/og/post/[id]/route.tsx +++ b/app/api/og/post/[id]/route.tsx @@ -3,7 +3,7 @@ /** * OG card for a single post. * - * Renders a 1200×630 image with: + * Renders a 1200×1200 (square) image with: * * • The post caption (the quote) as the visual centrepiece, in * serif-toned weight so it reads as a passage rather than UI chrome. @@ -96,7 +96,7 @@ export async function GET(
{/* Caption — the centrepiece */}
160 ? 36 : 44, + fontSize: displayCaption.length > 180 ? 42 : 52, fontWeight: 700, color: textPrimary, - lineHeight: 1.35, - marginTop: 20, - maxHeight: 380, + lineHeight: 1.4, + marginTop: 24, + maxHeight: 720, overflow: "hidden", zIndex: 1, }} @@ -175,8 +175,9 @@ export async function GET( fontWeight: 700, color: textSecondary, letterSpacing: 4, + lineHeight: 1.35, textTransform: "uppercase", - marginTop: 28, + marginTop: 36, zIndex: 1, }} > @@ -193,6 +194,7 @@ export async function GET( flexDirection: "row", alignItems: "center", justifyContent: "space-between", + marginTop: 48, zIndex: 1, }} > @@ -271,7 +273,7 @@ export async function GET( ), { width: 1200, - height: 630, + height: 1200, fonts: [ { name: "Noto Sans", diff --git a/lib/og.ts b/lib/og.ts index ef622ed3..2f93374e 100644 --- a/lib/og.ts +++ b/lib/og.ts @@ -459,7 +459,7 @@ export function ogForPost(p: { openGraph: { title, description, - images: [{ url: imageUrl, width: 1200, height: 630, alt: reference }], + images: [{ url: imageUrl, width: 1200, height: 1200, alt: reference }], siteName: "Prabhupāda Says", }, twitter: { @@ -495,7 +495,7 @@ export function ogForCollection(c: { openGraph: { title, description, - images: [{ url: imageUrl, width: 1200, height: 630, alt: title }], + images: [{ url: imageUrl, width: 1200, height: 1200, alt: title }], siteName: "Prabhupāda Says", }, twitter: {