crossmate

commit c9beaa643ce5ca3374387e3775b15d444fd3f156
parent 40a77c87e7ad561df0ee8e7606c2d8b52e331158
Author: Michael Camilleri <[email protected]>
Date:   Tue, 19 May 2026 10:31:12 +0900

Title the header scoreboard instead of centring it

Vertically centring the wrapped chip strip within the fixed-height header band
proved brittle: the flexible page frame collapsed to the chips' own height, so
the strip pinned to the top, and the only thing that ever 'fixed' it was an
incidental greedy background masking the real size. Rather than keep fighting
the layout, the iPhone scoreboard page now leads with a 'Players' subheading
that mirrors the iPad side panel (verticalBody); the wrapped FlowLayout chips
sit beneath it, top-anchored in a vertical ScrollView that scrolls once there
are enough players to overflow the band.

Co-Authored-By: Claude Opus 4.7 <[email protected]>

Diffstat:
M
Crossmate/Views/PuzzleView.swift
 | 
18
+++++++++++-------

1 file changed, 11 insertions(+), 7 deletions(-)
diff --git a/Crossmate/Views/PuzzleView.swift b/Crossmate/Views/PuzzleView.swift
@@ -652,16 +652,20 @@ private struct PuzzleScoreboard: View {
     }
 
     private var horizontalBody: some View {
-        // Chips flow left-to-right and wrap onto new lines. While the
-        // wrapped block fits the header band it is centred by the page
-        // frame; once it overflows it scrolls vertically instead.
-        ViewThatFits(in: .vertical) {
-            chipFlow
-            ScrollView(.vertical, showsIndicators: false) {
+        // A titled "Players" section mirroring the iPad side panel
+        // (verticalBody). It sizes to its content and sits top-anchored
+        // in a ScrollView, so it reads as a deliberate header section
+        // rather than a stray chip, and scrolls when there are enough
+        // players to overflow the band — no centring tricks required.
+        ScrollView(.vertical, showsIndicators: false) {
+            VStack(spacing: 6) {
+                Text("Players")
+                    .font(.subheadline.weight(.semibold))
                 chipFlow
             }
+            .frame(maxWidth: .infinity)
+            .padding(.vertical, 8)
         }
-        .frame(maxWidth: .infinity)
     }
 
     private func scoreChip(_ score: Score) -> some View {