From 080620a35cb38ec75e39766ec8e6632fd3fbae45 Mon Sep 17 00:00:00 2001
From: Syco21 <davhv12@gmail.com>
Date: Fri, 27 Mar 2026 21:46:18 +0100
Subject: [PATCH] change column layout

---
 src/components/PrintingRow/PrintingRow.jsx | 26 ++++++++++++----------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/src/components/PrintingRow/PrintingRow.jsx b/src/components/PrintingRow/PrintingRow.jsx
index 9b3ba3e..a81648c 100644
--- a/src/components/PrintingRow/PrintingRow.jsx
+++ b/src/components/PrintingRow/PrintingRow.jsx
@@ -32,22 +32,24 @@ function PrintingRow({ card_id, printing }) {
   return (
     <div
       style={{
-        display: 'flex',
-        justifyContent: 'space-between',
+        display: 'grid',
+        gridTemplateColumns: '80px 1fr 120px auto',
+        gap: '0.5rem',
         padding: '0.25rem 0',
-        opacity: loading ? 0.6 : 1,
-        alignItems: 'center'
+        alignItems: 'center',
+        opacity: loading ? 0.6 : 1
       }}
     >
-      {/* Left side: Set code, Set name, Rarity */}
-      <span style={{ minWidth: '80px', fontFamily: 'monospace' }}>
-        {printing.set_code}
-      </span>
-      <span>
-        {printing.set_name} {printing.rarity_name}
-      </span>
+      {/* Column 1: Set code */}
+      <span style={{ fontFamily: 'monospace' }}>{printing.set_code}</span>
 
-      {/* Right side: Amount buttons */}
+      {/* Column 2: Set name */}
+      <span>{printing.set_name}</span>
+
+      {/* Column 3: Rarity */}
+      <span>{printing.rarity_name}</span>
+
+      {/* Column 4: Amount controls */}
       <div>
         <button onClick={decrement} disabled={loading || currentAmount === 0}>–</button>
         <span style={{ margin: '0 0.5rem' }}>{currentAmount}</span>