Loads Bulma 1.0.2 in base.html (data-theme="dark" for its native dark palette) for every page that extends it, plus play.html directly. Converts every admin template — index, game dashboard, screens list, element types, object new/edit, data form/list — to real Bulma markup: navbar, breadcrumb component, box/card, field/control/input/select, table, notification, buttons, and a native Bulma modal for the data-row detail popup. Forge's own style.css keeps only what Bulma doesn't cover (the fixed-viewport builder/object-edit layouts, the element tree, canvas, flow-graph editor) and now acts as a secondary/override layer rather than a competing design system, matching how per-element inline customization already overrides widget defaults. screen_edit.html (the 3-panel screen builder) gets the same navbar/breadcrumb/button treatment plus its top rename form, but its flow-graph node editor, canvas and element tree keep their existing custom styling — several of their inputs have JS relying on exact DOM sibling structure (e.g. slider oninput reading nextElementSibling) or Bulma's own select/wrapper requirement, and reskinning them without a browser to verify against risked silently breaking the app's most complex feature. Buttons and headings there are still fully converted (safe, purely additive class changes). Verified: full test suite green, every route smoke-rendered 200 OK via the test client after the change.
95 lines
3.4 KiB
HTML
95 lines
3.4 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Nouvel objet — {{ game.name }}{% 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>
|
|
{% endblock %}
|
|
{% block content %}
|
|
<h1 class="title">Définir un nouvel objet</h1>
|
|
|
|
<form method="post" class="box" id="objectForm">
|
|
<div class="field">
|
|
<label class="label" for="object_name">Nom de l'objet (ex. Personnage, Niveau, Question...)</label>
|
|
<div class="control"><input class="input" type="text" id="object_name" name="object_name" required></div>
|
|
</div>
|
|
|
|
<h3 class="title is-6">Champs</h3>
|
|
<div id="fieldsList"></div>
|
|
<button type="button" class="button is-outlined is-fullwidth mb-4" id="btnAddField">+ Ajouter un champ</button>
|
|
|
|
<div class="field">
|
|
<button type="submit" class="button is-primary">Créer l'objet</button>
|
|
</div>
|
|
</form>
|
|
|
|
<template id="fieldRowTemplate">
|
|
<div class="fieldRowCard box">
|
|
<div class="columns">
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">Nom du champ</label>
|
|
<div class="control"><input class="input" type="text" name="field_name[]" placeholder="ex. nom, description, pv..." required></div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">Type</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="field_type[]" class="fieldTypeSelect">
|
|
{% for key, val in field_types.items() %}
|
|
<option value="{{ key }}">{{ val.label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="relationTarget field" style="display:none;">
|
|
<label class="label">Objet lié</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="field_relation[]">
|
|
{% for d in existing_definitions %}
|
|
<option value="{{ d.id }}">{{ d.name }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
{% if not existing_definitions %}
|
|
<p class="help">Aucun autre objet défini.</p>
|
|
{% endif %}
|
|
</div>
|
|
<div class="boundsTarget columns" style="display:none;">
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">Valeur mini</label>
|
|
<div class="control"><input class="input" type="number" step="any" name="field_min[]" placeholder="ex. 0"></div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">Valeur maxi</label>
|
|
<div class="control"><input class="input" type="number" step="any" name="field_max[]" placeholder="ex. 100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
<label class="label">Obligatoire ?</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="field_required[]">
|
|
<option value="0">Non</option>
|
|
<option value="1">Oui</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button type="button" class="button is-small is-danger btnRemoveField">🗑️ Retirer ce champ</button>
|
|
</div>
|
|
</template>
|
|
|
|
<script src="{{ url_for('static', filename='object_form.js') }}"></script>
|
|
{% endblock %}
|