Limit displayed new media outlets to a scrollable maximum of three items

Implement max-height and overflow-y: auto to the div wrapping the new outlets list in MainContent.tsx for "People", "Topics", and "Companies" categories.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: aabe2db1-f078-4501-aab5-be145ebc6b9a
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/aabe2db1-f078-4501-aab5-be145ebc6b9a/ETDmxYB
This commit is contained in:
kimjaehyeon0101
2025-10-13 09:12:35 +00:00
parent f9e2e49d8a
commit f021c8de88

View File

@ -226,7 +226,9 @@ export default function MainContent() {
<Sparkles className="h-4 w-4 text-blue-500" /> <Sparkles className="h-4 w-4 text-blue-500" />
<h3 className="text-sm font-semibold text-blue-600">NEW</h3> <h3 className="text-sm font-semibold text-blue-600">NEW</h3>
</div> </div>
{getSeparatedOutlets("People").newOutlets.map(renderOutletCard)} <div className="max-h-[200px] overflow-y-auto space-y-2 pr-1">
{getSeparatedOutlets("People").newOutlets.map(renderOutletCard)}
</div>
{getSeparatedOutlets("People").regularOutlets.length > 0 && ( {getSeparatedOutlets("People").regularOutlets.length > 0 && (
<div className="border-t border-gray-200 my-4"></div> <div className="border-t border-gray-200 my-4"></div>
)} )}
@ -249,7 +251,9 @@ export default function MainContent() {
<Sparkles className="h-4 w-4 text-blue-500" /> <Sparkles className="h-4 w-4 text-blue-500" />
<h3 className="text-sm font-semibold text-blue-600">NEW</h3> <h3 className="text-sm font-semibold text-blue-600">NEW</h3>
</div> </div>
{getSeparatedOutlets("Topics").newOutlets.map(renderOutletCard)} <div className="max-h-[200px] overflow-y-auto space-y-2 pr-1">
{getSeparatedOutlets("Topics").newOutlets.map(renderOutletCard)}
</div>
{getSeparatedOutlets("Topics").regularOutlets.length > 0 && ( {getSeparatedOutlets("Topics").regularOutlets.length > 0 && (
<div className="border-t border-gray-200 my-4"></div> <div className="border-t border-gray-200 my-4"></div>
)} )}
@ -272,7 +276,9 @@ export default function MainContent() {
<Sparkles className="h-4 w-4 text-blue-500" /> <Sparkles className="h-4 w-4 text-blue-500" />
<h3 className="text-sm font-semibold text-blue-600">NEW</h3> <h3 className="text-sm font-semibold text-blue-600">NEW</h3>
</div> </div>
{getSeparatedOutlets("Companies").newOutlets.map(renderOutletCard)} <div className="max-h-[200px] overflow-y-auto space-y-2 pr-1">
{getSeparatedOutlets("Companies").newOutlets.map(renderOutletCard)}
</div>
{getSeparatedOutlets("Companies").regularOutlets.length > 0 && ( {getSeparatedOutlets("Companies").regularOutlets.length > 0 && (
<div className="border-t border-gray-200 my-4"></div> <div className="border-t border-gray-200 my-4"></div>
)} )}