From 96c032850dd975dbb3b213de79c02853cee73b90 Mon Sep 17 00:00:00 2001
From: evanpelle <evanpelle@gmail.com>
Date: Wed, 3 Jun 2026 20:51:28 -0700
Subject: [PATCH] Fix start game button regression in lobby modals

The Start Game button in SinglePlayerModal and HostLobbyModal was
scrolling away with the body instead of staying pinned at the bottom.

HostLobbyModal's body lacked overflow-y-auto/min-h-0, so the body
couldn't scroll independently and the footer scrolled off-screen.
SinglePlayerModal was missing the flex flex-col h-full wrapper entirely
(and had an unmatched closing div), so the footer never had a sticky
column to anchor to.

Restore the v31 layout: outer flex-col h-full, body is the scroll
container (flex-1 min-h-0 overflow-y-auto custom-scrollbar), footer is
shrink-0.
---
 src/client/HostLobbyModal.ts    |  4 +++-
 src/client/SinglePlayerModal.ts | 25 ++++++++++++-------------
 2 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/src/client/HostLobbyModal.ts b/src/client/HostLobbyModal.ts
index b3991e000..322cc68ad 100644
--- a/src/client/HostLobbyModal.ts
+++ b/src/client/HostLobbyModal.ts
@@ -289,7 +289,9 @@ export class HostLobbyModal extends BaseModal {
 
     return html`
       <div class="flex flex-col h-full">
-        <div class="flex-1 p-6 mx-auto w-full max-w-5xl">
+        <div
+          class="flex-1 min-h-0 overflow-y-auto custom-scrollbar p-6 mr-1 mx-auto w-full max-w-5xl"
+        >
           <game-config-settings
             class="block"
             .sectionGapClass=${"space-y-10"}
diff --git a/src/client/SinglePlayerModal.ts b/src/client/SinglePlayerModal.ts
index 10df43b81..994996ddd 100644
--- a/src/client/SinglePlayerModal.ts
+++ b/src/client/SinglePlayerModal.ts
@@ -254,7 +254,10 @@ export class SinglePlayerModal extends BaseModal {
     ];
 
     return html`
-      <div class="px-6 pt-4 pb-6 mx-auto w-full max-w-5xl">
+      <div class="flex flex-col h-full">
+        <div
+          class="flex-1 min-h-0 overflow-y-auto custom-scrollbar px-6 pt-4 pb-6 mr-1 mx-auto w-full max-w-5xl"
+        >
           <game-config-settings
             class="block"
             .sectionGapClass=${"space-y-6"}
@@ -338,18 +341,14 @@ export class SinglePlayerModal extends BaseModal {
         </div>
 
         <!-- Footer Action -->
-        <div class="p-6 border-t border-white/10 bg-black/20">
-          ${
-            hasLinkedAccount(this.userMeResponse) && this.hasOptionsChanged()
-              ? html`<div
-                  class="mb-4 px-4 py-3 rounded-xl bg-yellow-500/20 border border-yellow-500/30 text-yellow-400 text-xs font-bold uppercase tracking-wider text-center"
-                >
-                  ${translateText(
-                    "single_modal.options_changed_no_achievements",
-                  )}
-                </div>`
-              : null
-          }
+        <div class="p-6 border-t border-white/10 bg-black/20 shrink-0">
+          ${hasLinkedAccount(this.userMeResponse) && this.hasOptionsChanged()
+            ? html`<div
+                class="mb-4 px-4 py-3 rounded-xl bg-yellow-500/20 border border-yellow-500/30 text-yellow-400 text-xs font-bold uppercase tracking-wider text-center"
+              >
+                ${translateText("single_modal.options_changed_no_achievements")}
+              </div>`
+            : null}
           <o-button
             variant="primary"
             width="block"