Applique le gabarit sobre/compact/sans défilement à toutes les pages hors éditeur

Généralise le principe déjà en place pour l'édition d'objet (la page
n'occupe jamais plus que la hauteur de la fenêtre, seules ses zones
internes défilent) à toutes les pages restantes : liste des jeux, tableau
de bord d'un jeu, écrans, éléments de jeu, variables, nouvel objet,
formulaire de données, tableau des données d'un objet. Seuls l'éditeur
d'écran/d'élément et l'aperçu jouable restent en dehors (déjà exclus par
leur propre gabarit plein écran, ou pas concernés).

Nouveau gabarit générique à une colonne (body.pageBody + .content-page +
.scrollArea) sur le même principe que .content-objectEdit, plus une
variante .formScroll pour un formulaire long à défilement interne (liste
de champs d'un nouvel objet, formulaire de données) tout en gardant les
boutons d'action toujours visibles. Les listes/tableaux remplacés par le
format dense .fieldsTable (déjà utilisé pour le tableau de bord) pour
rester cohérent et afficher plus de lignes à l'écran.

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

templates/game_variables.html

@@ -1,6 +1,7 @@
 {% extends "base.html" %}
 {% block title %}Variables — {{ game.name }}{% endblock %}
-{% block content_class %}content-wide{% endblock %}
+{% block content_class %}content-page{% endblock %}
+{% block body_class %}pageBody{% endblock %}
 {% block breadcrumb %}
 <li><a href="{{ url_for('game_dashboard', slug=game.slug) }}">{{ game.name }}</a></li>
 <li class="is-active"><a>Variables</a></li>
@@ -10,9 +11,8 @@
 <p class="hint mb-4">Des propriétés/valeurs communes à tout le jeu (pas attachées à un objet de données précis) — utile par exemple pour une porte ouverte ou non, un niveau débloqué... Une variable peut être lue dans une "Condition de visibilité" (propriétés d'un élément) et modifiée par une action "Modifier une variable" (Logique de la scène).</p>
 
 <form method="post" action="{{ url_for('create_global_var', slug=game.slug) }}" class="card">
-  <h3>Nouvelle variable</h3>
   <div class="fieldRow">
-    <div class="formField">
+    <div class="formField" style="flex:1;">
       <label for="new-var-name">Nom</label>
       <input type="text" id="new-var-name" name="name" placeholder="ex. porte_ouverte" required autocomplete="off">
     </div>
@@ -33,34 +33,40 @@
 </form>
 
 <h2>Variables définies</h2>
+<div class="scrollArea">
 {% if variables %}
-<div class="list">
-  {% for v in variables %}
-  <form method="post" action="{{ url_for('global_var_edit', slug=game.slug, var_id=v.id) }}" id="varEditForm{{ v.id }}"></form>
-  <div class="listRow">
-    <div class="listRowFlex">
-      <div class="rowLink">
-        <div class="rowTitle">{{ v.name }}</div>
-        <div class="rowSub">valeur actuelle : {{ v.value if v.value is not none and v.value != '' else '(vide)' }}</div>
-      </div>
-      <div class="rowActions">
-        <select form="varEditForm{{ v.id }}" name="type" aria-label="Type de « {{ v.name }} »">
-          {% for key, val in variable_types.items() %}
-          <option value="{{ key }}" {{ 'selected' if v.type == key else '' }}>{{ val.label }}</option>
-          {% endfor %}
-        </select>
-        <input type="text" form="varEditForm{{ v.id }}" name="value" value="{{ v.value or '' }}" aria-label="Valeur de « {{ v.name }} »" style="width:120px;">
-        <button type="submit" form="varEditForm{{ v.id }}" class="smallBtn">Enregistrer</button>
-        <form method="post" action="{{ url_for('global_var_delete', slug=game.slug, var_id=v.id) }}"
-              onsubmit="return confirm('Supprimer la variable « {{ v.name }} » ? Toute condition de visibilité ou action qui la référence cessera de fonctionner.');">
-          <button type="submit" class="smallBtn danger">🗑️</button>
-        </form>
-      </div>
-    </div>
-  </div>
-  {% endfor %}
+{% for v in variables %}
+<form method="post" action="{{ url_for('global_var_edit', slug=game.slug, var_id=v.id) }}" id="varEditForm{{ v.id }}"></form>
+{% endfor %}
+<div class="fieldsTableWrap">
+  <table class="table is-fullwidth is-hoverable fieldsTable">
+    <thead><tr><th>Nom</th><th>Type</th><th>Valeur</th><th></th></tr></thead>
+    <tbody>
+      {% for v in variables %}
+      <tr>
+        <td>{{ v.name }}</td>
+        <td>
+          <select form="varEditForm{{ v.id }}" name="type" aria-label="Type de « {{ v.name }} »">
+            {% for key, val in variable_types.items() %}
+            <option value="{{ key }}" {{ 'selected' if v.type == key else '' }}>{{ val.label }}</option>
+            {% endfor %}
+          </select>
+        </td>
+        <td><input type="text" form="varEditForm{{ v.id }}" name="value" value="{{ v.value or '' }}" aria-label="Valeur de « {{ v.name }} »"></td>
+        <td class="fieldsTableActions">
+          <button type="submit" form="varEditForm{{ v.id }}" class="button is-small">Enregistrer</button>
+          <form method="post" action="{{ url_for('global_var_delete', slug=game.slug, var_id=v.id) }}"
+                onsubmit="return confirm('Supprimer la variable « {{ v.name }} » ? Toute condition de visibilité ou action qui la référence cessera de fonctionner.');">
+            <button type="submit" class="button is-small is-danger">🗑️</button>
+          </form>
+        </td>
+      </tr>
+      {% endfor %}
+    </tbody>
+  </table>
 </div>
 {% else %}
 <p class="hint">Aucune variable pour l'instant — crée la première ci-dessus.</p>
 {% endif %}
+</div>
 {% endblock %}