From 2bf31d1826faa51e4149450af2c0f4fdf818ac55 Mon Sep 17 00:00:00 2001
From: Cho Young-Hwi <cyh76507707@gmail.com>
Date: Wed, 18 Mar 2026 11:25:21 +0000
Subject: [PATCH] [#302] Stack TVL and plot count on separate lines in card
 metadata

- Remove inline layout and | separator
- Each metadata value on its own line with whitespace-nowrap
- Rating summary on its own line below

Fixes #302

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/components/StoryCard.tsx | 21 +++++++++------------
 1 file changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/components/StoryCard.tsx b/src/components/StoryCard.tsx
index 74b6544a..eadf6f5b 100644
--- a/src/components/StoryCard.tsx
+++ b/src/components/StoryCard.tsx
@@ -68,19 +68,16 @@ export function StoryCard({
         </Link>
       </div>
 
-      {/* Metadata row below card */}
-      <div className="text-muted mt-2 flex flex-wrap items-center justify-between gap-x-2 gap-y-1 pl-[7px] pr-1 text-[10px]">
-        <div className="flex items-center gap-1">
-          {storyline.token_address && (
-            <>
-              <StoryCardTVL tokenAddress={storyline.token_address} />
-              <span>|</span>
-            </>
-          )}
-          <span>
-            {storyline.plot_count} {storyline.plot_count === 1 ? "plot" : "plots"} linked
+      {/* Metadata below card */}
+      <div className="text-muted mt-2 flex flex-col gap-0.5 pl-[7px] pr-1 text-[10px]">
+        {storyline.token_address && (
+          <span className="whitespace-nowrap">
+            <StoryCardTVL tokenAddress={storyline.token_address} />
           </span>
-        </div>
+        )}
+        <span className="whitespace-nowrap">
+          {storyline.plot_count} {storyline.plot_count === 1 ? "plot" : "plots"} linked
+        </span>
         <RatingSummary storylineId={storyline.storyline_id} />
       </div>
     </div>