feat: update homepage template with start/abandon game UI

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

assets/styles/app.css

@@ -486,3 +486,42 @@ body {
     background: #f0fdf4;
     color: #16a34a;
 }
+
+/* ── Game actions ── */
+
+.game-actions {
+    display: flex;
+    justify-content: flex-end;
+    padding: 12px 40px 0;
+}
+
+.btn-abandon {
+    padding: 7px 16px;
+    background: none;
+    color: var(--text-muted);
+    border: 1.5px solid var(--border);
+    border-radius: 100px;
+    font-family: 'Inter', sans-serif;
+    font-size: 13px;
+    font-weight: 600;
+    cursor: pointer;
+    transition: border-color 0.15s, color 0.15s, background 0.15s;
+}
+
+.btn-abandon:hover {
+    border-color: #dc2626;
+    color: #dc2626;
+    background: #fef2f2;
+}
+
+.game-start-container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    min-height: calc(100vh - 64px - 80px);
+}
+
+.btn-start {
+    padding: 14px 32px;
+    font-size: 16px;
+}

templates/homepage/index.html.twig

@@ -1,9 +1,25 @@
 {% extends 'base.html.twig' %}
 
 {% block body %}
-    <div {{ react_component('GameGrid', {
+    {% if game %}
-        grid: grid,
+        <div class="game-actions">
-        width: width,
+            <form method="post" action="{{ path('app_game_abandon', {id: game.id}) }}">
-        middle: middle,
+                <input type="hidden" name="_token" value="{{ csrf_token('game_abandon') }}">
-    }) }}></div>
+                <button type="submit" class="btn btn-abandon">Abandonner</button>
+            </form>
+        </div>
+
+        <div {{ react_component('GameGrid', {
+            grid: grid,
+            width: width,
+            middle: middle,
+        }) }}></div>
+    {% else %}
+        <div class="game-start-container">
+            <form method="post" action="{{ path('app_game_start') }}">
+                <input type="hidden" name="_token" value="{{ csrf_token('game_start') }}">
+                <button type="submit" class="btn btn-primary btn-start">Commencer une partie</button>
+            </form>
+        </div>
+    {% endif %}
 {% endblock %}