From 88df98f26978bc06d78fd00a13a55d02d398ce24 Mon Sep 17 00:00:00 2001
From: Samuel Enocsson <samuel.enocsson@consid.se>
Date: Thu, 21 May 2026 15:23:53 +0200
Subject: [PATCH] fix: place history chart in right grid column of expanded row
 (#7)

The dl + button + chart were 3 direct children of .player-detail (a
2-column grid). Auto-placement put the button in the right column,
forcing the chart to wrap to a second row in the left column.
Wrap dl + button in .player-detail-left so the chart occupies col 2.
---
 views/partials/player-history.ejs | 56 ++++++++++++++++---------------
 1 file changed, 29 insertions(+), 27 deletions(-)

diff --git a/views/partials/player-history.ejs b/views/partials/player-history.ejs
index 9f6b61f..3e082aa 100644
--- a/views/partials/player-history.ejs
+++ b/views/partials/player-history.ejs
@@ -4,33 +4,35 @@ const chartPdgaNumber = hasPlayer ? player.pdgaNumber : pdgaNumber;
 %>
 <div class="player-detail">
   <% if (hasPlayer) { %>
-  <dl class="detail-grid">
-    <div>
-      <dt>Current rating</dt>
-      <dd><%= player.rating ?? '—' %></dd>
-    </div>
-    <div>
-      <dt>Last month</dt>
-      <dd><%= player.lastMonthRating ?? '—' %></dd>
-    </div>
-    <div>
-      <dt>Change vs last month</dt>
-      <dd>
-        <% if (player.ratingChange != null) { %><%- include('delta-pill', { value: player.ratingChange }) %><% } else { %>—<% } %>
-      </dd>
-    </div>
-    <div>
-      <dt>Predicted next update</dt>
-      <dd><%= player.predictedRating ?? '—' %></dd>
-    </div>
-    <div>
-      <dt>Gap to predicted</dt>
-      <dd>
-        <% if (player.deltaPredicted != null) { %><%- include('delta-pill', { value: player.deltaPredicted, extraClass: 'delta-predicted-pill' }) %><% } else { %>—<% } %>
-      </dd>
-    </div>
-  </dl>
-  <button class="link-btn" onclick="showDebugInfo(<%= player.pdgaNumber %>)" style="margin-top: 4px;">View calculation details →</button>
+  <div class="player-detail-left">
+    <dl class="detail-grid">
+      <div>
+        <dt>Current rating</dt>
+        <dd><%= player.rating ?? '—' %></dd>
+      </div>
+      <div>
+        <dt>Last month</dt>
+        <dd><%= player.lastMonthRating ?? '—' %></dd>
+      </div>
+      <div>
+        <dt>Change vs last month</dt>
+        <dd>
+          <% if (player.ratingChange != null) { %><%- include('delta-pill', { value: player.ratingChange }) %><% } else { %>—<% } %>
+        </dd>
+      </div>
+      <div>
+        <dt>Predicted next update</dt>
+        <dd><%= player.predictedRating ?? '—' %></dd>
+      </div>
+      <div>
+        <dt>Gap to predicted</dt>
+        <dd>
+          <% if (player.deltaPredicted != null) { %><%- include('delta-pill', { value: player.deltaPredicted, extraClass: 'delta-predicted-pill' }) %><% } else { %>—<% } %>
+        </dd>
+      </div>
+    </dl>
+    <button class="link-btn" onclick="showDebugInfo(<%= player.pdgaNumber %>)" style="margin-top: 4px;">View calculation details →</button>
+  </div>
   <% } %>
 
   <% if (history && history.length > 0) { %>