From 26f5069aa2086a3d6527bce8ef77a7fc51ece16c Mon Sep 17 00:00:00 2001
From: JakeBreath <tolozacdcmo@gmail.com>
Date: Thu, 17 Sep 2026 14:32:24 -0500
Subject: [PATCH] Fix pool post cards rendering as a colored sliver

PostCard's Link is inline by default; wrapped in a div on the pool detail
page it stopped being blockified like a grid child, so its rating-tinted
border collapsed into a vertical line on the left. The card is now
block-level, and the pool grid only wraps blacklisted posts (for the red
ring), so normal cards render exactly like the Online grid.
---
 frontend/src/features/online/PostCard.tsx     |  2 +-
 .../src/features/pools/PoolDetailPage.tsx     | 29 +++++++++++--------
 2 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/frontend/src/features/online/PostCard.tsx b/frontend/src/features/online/PostCard.tsx
index c6982f6..e55e6c7 100644
--- a/frontend/src/features/online/PostCard.tsx
+++ b/frontend/src/features/online/PostCard.tsx
@@ -31,7 +31,7 @@ export function PostCard({
       to={`/detail/${post.id}`}
       state={from ? { from } : undefined}
       className={cn(
-        "group overflow-hidden rounded-lg border bg-ctp-base transition",
+        "group block overflow-hidden rounded-lg border bg-ctp-base transition",
         ratingBorder[post.rating] ?? "border-ctp-surface0",
       )}
     >
diff --git a/frontend/src/features/pools/PoolDetailPage.tsx b/frontend/src/features/pools/PoolDetailPage.tsx
index 1f84dba..d82d78a 100644
--- a/frontend/src/features/pools/PoolDetailPage.tsx
+++ b/frontend/src/features/pools/PoolDetailPage.tsx
@@ -268,23 +268,28 @@ export default function PoolDetailPage() {
               const blacklisted =
                 blacklistSet.size > 0 &&
                 postIsBlacklisted(post, blacklistSet).length > 0;
-              const card = (
-                <PostCard
-                  post={post}
-                  inLibrary={inLibrary.has(post.file.md5)}
-                  from={`${location.pathname}${location.search}`}
-                />
-              );
-              return blacklisted ? (
+              if (!blacklisted) {
+                return (
+                  <PostCard
+                    key={post.id}
+                    post={post}
+                    inLibrary={inLibrary.has(post.file.md5)}
+                    from={`${location.pathname}${location.search}`}
+                  />
+                );
+              }
+              return (
                 <div
                   key={post.id}
-                  className="rounded-lg ring-1 ring-ctp-red/50"
+                  className="min-w-0 rounded-lg ring-1 ring-ctp-red/50"
                   title="Matches your blacklist"
                 >
-                  {card}
+                  <PostCard
+                    post={post}
+                    inLibrary={inLibrary.has(post.file.md5)}
+                    from={`${location.pathname}${location.search}`}
+                  />
                 </div>
-              ) : (
-                <div key={post.id}>{card}</div>
               );
             })}
           </div>