krispire/spsays-training
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: ui fix

Browse Source
This commit is contained in:
gosangam
2026-06-15 17:15:38 +05:30
parent cb376f8497
commit 0608e2b6f6
3 changed files with 30 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/api/og/collection/[id]/route.tsx
+14 -13
View File
@@ -3,7 +3,7 @@
/**
* OG card for a public collection (`/c/<id>`).
*
* 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(
<div
style={{
width: 1200,
height: 630,
height: 1200,
display: "flex",
flexDirection: "column",
backgroundColor: hasImage ? "#1a1410" : "#faf5f0",
@@ -97,13 +97,13 @@ export async function GET(
alt=""
src={bgImageUrl}
width={1200}
height={630}
height={1200}
style={{
position: "absolute",
top: 0,
left: 0,
width: 1200,
height: 630,
height: 1200,
objectFit: "cover",
filter: "brightness(0.45)",
}}
@@ -114,7 +114,7 @@ export async function GET(
top: 0,
left: 0,
width: 1200,
height: 630,
height: 1200,
background:
"linear-gradient(to top, rgba(0,0,0,0.75), rgba(0,0,0,0.1))",
}}
@@ -130,7 +130,7 @@ export async function GET(
flex: 1,
display: "flex",
flexDirection: "column",
padding: 80,
padding: 96,
}}
>
{/* 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,
}}
>
<div style={{ fontSize: 24, color: textSecondary, display: "flex" }}>
@@ -202,7 +203,7 @@ export async function GET(
),
{
width: 1200,
height: 630,
height: 1200,
fonts: [
{
name: "Noto Sans",
app/api/og/post/[id]/route.tsx
+14 -12
View File
@@ -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(
<div
style={{
width: 1200,
height: 630,
height: 1200,
display: "flex",
flexDirection: "column",
backgroundColor: hasImage ? "#1a1410" : "#faf5f0",
@@ -111,13 +111,13 @@ export async function GET(
alt=""
src={bgImageUrl}
width={1200}
height={630}
height={1200}
style={{
position: "absolute",
top: 0,
left: 0,
width: 1200,
height: 630,
height: 1200,
objectFit: "cover",
filter: "brightness(0.45)",
}}
@@ -129,7 +129,7 @@ export async function GET(
top: 0,
left: 0,
width: 1200,
height: 630,
height: 1200,
background:
"linear-gradient(to top, rgba(0,0,0,0.75), rgba(0,0,0,0.1))",
}}
@@ -147,19 +147,19 @@ export async function GET(
flex: 1,
display: "flex",
flexDirection: "column",
padding: 80,
padding: 96,
}}
>
{/* Caption — the centrepiece */}
<div
style={{
display: "flex",
fontSize: displayCaption.length > 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",