Passe toutes les pages restantes en deux colonnes (créer à gauche, contenu à droite)
Généralise le principe déjà utilisé pour le tableau de bord et l'édition
d'objet à toutes les pages restantes : liste des jeux, écrans, éléments de
jeu, variables, nouvel objet, formulaire de données, tableau des données
d'un objet - colonne de gauche pour créer/agir, colonne de droite pour ce
qui existe déjà, chaque colonne défilant pour son propre compte.
Pour un formulaire qui doit rester UN SEUL <form> à cheval sur les deux
colonnes (nouvel objet : nom à gauche, champs à droite ; formulaire de
données : bouton Enregistrer à gauche, champs à droite), nouvelle classe
.formPassthrough ("display:contents") : le <form> ne devient pas lui-même
une boîte dans la mise en page flex, seul .twoCol à l'intérieur compte.
Supprime au passage .content-page/.formScroll/body.pageBody (le gabarit à
une colonne introduit au tour précédent, plus utilisé nulle part) et
.list/.listRow/.listRowFlex/.rowTitle/.rowSub/.rowActions/.addBtn (les
cartes à deux lignes remplacées par les tableaux denses et la nav
compacte) - du CSS mort plutôt que deux systèmes qui se chevauchent.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 5
parent
59247694d6
commit
2051b375ac
+20
-12
@@ -1,7 +1,7 @@
|
||||
{% extends "base.html" %}
|
||||
{% block title %}Nouvel objet — {{ game.name }}{% endblock %}
|
||||
{% block content_class %}content-page{% endblock %}
|
||||
{% block body_class %}pageBody{% endblock %}
|
||||
{% block content_class %}content-wide content-objectEdit{% endblock %}
|
||||
{% block body_class %}objectEditBody{% endblock %}
|
||||
{% block breadcrumb %}
|
||||
<li><a href="{{ url_for('game_dashboard', slug=game.slug) }}">{{ game.name }}</a></li>
|
||||
<li class="is-active"><a>Nouvel objet</a></li>
|
||||
@@ -9,19 +9,27 @@
|
||||
{% block content %}
|
||||
<h1 class="title">Définir un nouvel objet</h1>
|
||||
|
||||
<form method="post" class="formScroll" id="objectForm">
|
||||
<div class="formField">
|
||||
<label for="object_name">Nom de l'objet (ex. Personnage, Niveau, Question...)</label>
|
||||
<input type="text" id="object_name" name="object_name" required>
|
||||
<form method="post" id="objectForm" class="formPassthrough">
|
||||
<div class="twoCol">
|
||||
<div class="colLeft">
|
||||
<h2>Objet</h2>
|
||||
<div class="card">
|
||||
<div class="formField">
|
||||
<label for="object_name">Nom de l'objet (ex. Personnage, Niveau, Question...)</label>
|
||||
<input type="text" id="object_name" name="object_name" required>
|
||||
</div>
|
||||
<div class="actionsRow"><button type="submit" class="primary">Créer l'objet</button></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>Champs</h3>
|
||||
<div class="scrollArea">
|
||||
<div id="fieldsList"></div>
|
||||
<div class="colRight">
|
||||
<h2>Champs</h2>
|
||||
<div class="fieldsTableWrap" style="padding:10px;">
|
||||
<div id="fieldsList"></div>
|
||||
</div>
|
||||
<button type="button" class="button is-outlined is-fullwidth mt-2" id="btnAddField">+ Ajouter un champ</button>
|
||||
</div>
|
||||
<button type="button" class="button is-outlined is-fullwidth" id="btnAddField">+ Ajouter un champ</button>
|
||||
|
||||
<div class="actionsRow"><button type="submit" class="primary">Créer l'objet</button></div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<template id="fieldRowTemplate">
|
||||
|
||||
Reference in New Issue
Block a user