Ionosphere.tv
fix: increase column item height estimates to prevent overflow clipping
Text items: 58→78px (accounting for link row + margin)
Photos: added 8px margin buffer
Stats/headings/vod: added small buffers
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
+10
-5
+10
-5
apps/ionosphere/src/app/discussion/DiscussionContent.tsx
+10
-5
apps/ionosphere/src/app/discussion/DiscussionContent.tsx
···
81
81
// --- Height estimation ---
82
82
83
83
function estimateItemHeight(item: FlowItem, columnWidth?: number): number {
84
-
if (item.type === "stats") return 70;
85
-
if (item.type === "heading") return 28;
86
-
if (item.type === "vodDirectory") return 80;
84
+
if (item.type === "stats") return 76;
85
+
if (item.type === "heading") return 32;
86
+
if (item.type === "vodDirectory") return 86;
87
87
if (item.type === "item" && item.item.image_url) {
88
88
const imgWidth = (columnWidth || 240) - 18; // 18px left padding
89
89
const aspect = item.item.image_aspect || 1.33; // default 4:3
90
90
const imgHeight = Math.min(Math.round(imgWidth / aspect), 200); // cap at 200px
91
-
return 40 + imgHeight + 20; // header + image + text/links
91
+
return 44 + imgHeight + 28; // header + image + text/links + margin
92
+
}
93
+
// Text items: header(20) + text 2 lines(36) + links(16) + margin(6) = 78
94
+
if (item.type === "item") {
95
+
const hasLinks = item.item.talk_rkey || item.item.external_url || item.item.author_handle;
96
+
return hasLinks ? 78 : 62;
92
97
}
93
-
return 58;
98
+
return 62;
94
99
}
95
100
96
101
// --- Greedy column fill ---