From fdd12c67262d181ebaa5a528b14dc41c7b9f9296 Mon Sep 17 00:00:00 2001
From: Chaim <chaim@marcus-law.co.il>
Date: Sat, 11 Apr 2026 19:30:02 +0000
Subject: [PATCH] Move background + conclusions below the issues on compose
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The right sidebar with "רקע לניתוח" and "מסקנות" was stealing
horizontal space and forced the editable cards (threshold claims,
issues, chair positions, now precedents) into a narrow column. Move
both cards into the main stack, after the issues list, so the chair
sees the decision points first and the surrounding context after.

Collapse the lg:grid-cols-[1fr_320px] layout into a single max-w-4xl
stack since there's no longer a sidebar. Bump the moved cards from
px-5 py-4 to px-6 py-5 to match the rest of the compose page's
card padding.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../app/cases/[caseNumber]/compose/page.tsx   | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

diff --git a/web-ui/src/app/cases/[caseNumber]/compose/page.tsx b/web-ui/src/app/cases/[caseNumber]/compose/page.tsx
index 78dc98d..ec2cff5 100644
--- a/web-ui/src/app/cases/[caseNumber]/compose/page.tsx
+++ b/web-ui/src/app/cases/[caseNumber]/compose/page.tsx
@@ -115,8 +115,7 @@ export default function ComposePage({
             </CardContent>
           </Card>
         ) : analysis.data ? (
-          <div className="grid gap-6 lg:grid-cols-[1fr_320px]">
-            {/* Main editable column */}
+          <div className="max-w-4xl">
             <div className="space-y-6">
               {/* Case-level general precedents */}
               <Card className="bg-surface border-rule shadow-sm">
@@ -190,13 +189,13 @@ export default function ComposePage({
                   </CardContent>
                 </Card>
               )}
-            </div>
 
-            {/* Side column: background prose + conclusions */}
-            <aside className="space-y-5">
+              {/* Background prose — moved below the issues so it reads as
+                  supporting context after the chair has seen the main
+                  decision points, not as a wall of text beside them. */}
               <Card className="bg-surface border-rule shadow-sm">
-                <CardContent className="px-5 py-4 space-y-5">
-                  <h2 className="text-navy text-base mb-0">רקע לניתוח</h2>
+                <CardContent className="px-6 py-5 space-y-5">
+                  <h2 className="text-navy text-xl mb-0">רקע לניתוח</h2>
                   <ProseSection
                     title="צד מיוצג"
                     content={analysis.data.represented_party}
@@ -218,15 +217,15 @@ export default function ComposePage({
 
               {analysis.data.conclusions?.trim() && (
                 <Card className="bg-gold-wash border-gold/40 shadow-sm">
-                  <CardContent className="px-5 py-4 space-y-2">
-                    <h2 className="text-gold-deep text-base mb-0">מסקנות</h2>
+                  <CardContent className="px-6 py-5 space-y-2">
+                    <h2 className="text-gold-deep text-xl mb-0">מסקנות</h2>
                     <p className="text-sm text-ink leading-relaxed whitespace-pre-line prose">
                       {analysis.data.conclusions.trim()}
                     </p>
                   </CardContent>
                 </Card>
               )}
-            </aside>
+            </div>
           </div>
         ) : null}
       </section>