feat: update homepage template with start/abandon game UI

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
thibaud-leclere
2026-03-30 19:46:58 +02:00
parent a6b3a93d5c
commit 96adefbb1e
2 changed files with 60 additions and 5 deletions

View File

@@ -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;
}

View File

@@ -1,9 +1,25 @@
{% extends 'base.html.twig' %}
{% block body %}
<div {{ react_component('GameGrid', {
grid: grid,
width: width,
middle: middle,
}) }}></div>
{% if game %}
<div class="game-actions">
<form method="post" action="{{ path('app_game_abandon', {id: game.id}) }}">
<input type="hidden" name="_token" value="{{ csrf_token('game_abandon') }}">
<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 %}