From dca73b8990990f9df184eb742e6ca1a877a0c55a Mon Sep 17 00:00:00 2001
From: sebastjanartic <45803536-sebastjanartic@users.noreply.replit.com>
Date: Sat, 28 Feb 2026 21:02:32 +0000
Subject: [PATCH] Adjust text size and spacing in top stories section

Update font sizes, padding, and margins within the Top Stories component to ensure text fits within its container without horizontal scrolling.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 517dfa7b-26ac-463d-a6e1-a58c6df97188
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 8c471362-0d7a-4f1d-a270-58ae41f388c9
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/517dfa7b-26ac-463d-a6e1-a58c6df97188/drGbo1a
Replit-Helium-Checkpoint-Created: true
---
 client/src/pages/home.tsx | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/client/src/pages/home.tsx b/client/src/pages/home.tsx
index 07db5c4..daa027d 100644
--- a/client/src/pages/home.tsx
+++ b/client/src/pages/home.tsx
@@ -220,19 +220,19 @@ function NativeAdCard() {
 
 function TopStoriesList({ articles }: { articles: Article[] }) {
   return (
-    <div className="bg-card rounded-lg border border-card-border p-4 h-full" data-testid="sidebar-top-stories">
-      <h3 className="font-bold text-card-foreground text-sm mb-3 flex items-center gap-2">
-        <span className="w-1 h-4 bg-primary rounded-full" />
+    <div className="bg-card rounded-lg border border-card-border p-3 h-full" data-testid="sidebar-top-stories">
+      <h3 className="font-bold text-card-foreground text-xs mb-2 flex items-center gap-2">
+        <span className="w-1 h-3.5 bg-primary rounded-full" />
         Top-Storys
       </h3>
       <div className="space-y-0">
         {articles.slice(0, 5).map((article) => (
           <Link key={article.id} href={`/article/${article.slug}`}>
-            <div className="group cursor-pointer py-2.5 border-b border-card-border last:border-0" data-testid={`card-top-${article.id}`}>
-              <h4 className="text-sm font-medium text-card-foreground line-clamp-2 group-hover:text-primary transition-colors leading-snug">{article.title}</h4>
-              <div className="flex items-center gap-1.5 mt-1">
-                <span className="text-[11px] text-muted-foreground">{article.author}</span>
-                <span className="text-muted-foreground/50 text-[11px]">{timeAgo(new Date(article.publishedAt))}</span>
+            <div className="group cursor-pointer py-1.5 border-b border-card-border last:border-0" data-testid={`card-top-${article.id}`}>
+              <h4 className="text-xs font-medium text-card-foreground line-clamp-2 group-hover:text-primary transition-colors leading-snug">{article.title}</h4>
+              <div className="flex items-center gap-1.5 mt-0.5">
+                <span className="text-[10px] text-muted-foreground">{article.author}</span>
+                <span className="text-muted-foreground/50 text-[10px]">{timeAgo(new Date(article.publishedAt))}</span>
               </div>
             </div>
           </Link>