DIvers rework de CSS/LESS et améliorations de messages/layout
This commit is contained in:
@@ -0,0 +1,274 @@
|
||||
<section class="{{cssClass}} les-oublies-sheet personnage-sheet" autocomplete="off">
|
||||
<header class="sheet-header hero-banner">
|
||||
<img class="profile-img" data-edit="img" data-action="editImage" src="{{actor.img}}" title="{{actor.name}}" />
|
||||
<div class="header-fields hero-copy">
|
||||
<p class="sheet-kicker">Chronique d'un Oublié</p>
|
||||
<h1 class="sheet-title"><input name="name" type="text" value="{{actor.name}}" placeholder="Nom" {{#if isPlayMode}}disabled{{/if}} /></h1>
|
||||
<p class="sheet-subtitle">Petit Peuple, Songes, Cauchemar et destin de compagnie</p>
|
||||
<div class="sheet-actions">
|
||||
<button type="button" data-action="openInitiative">{{localize "LESOUBLIES.rolls.initiative"}}</button>
|
||||
<button type="button" data-action="openThreadHarvest">Récolte de fils</button>
|
||||
<button class="mode-button" type="button" data-action="toggleSheet">{{#if isEditMode}}{{localize "LESOUBLIES.ui.playMode"}}{{else}}{{localize "LESOUBLIES.ui.editMode"}}{{/if}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav class="sheet-tabs" aria-label="Navigation de la fiche">
|
||||
{{#each tabs as |tab|}}
|
||||
<button type="button" class="sheet-tab-button {{tab.cssClass}}" data-action="switchTab" data-tab="{{tab.id}}">
|
||||
<i class="{{tab.icon}}"></i>
|
||||
<span>{{tab.label}}</span>
|
||||
</button>
|
||||
{{/each}}
|
||||
</nav>
|
||||
|
||||
<section class="sheet-tab {{tabs.overview.cssClass}}" data-tab="overview">
|
||||
<div class="sheet-grid sheet-grid-2">
|
||||
<section class="sheet-card summary-card">
|
||||
<h2>{{localize "LESOUBLIES.ui.derivedOverview"}}</h2>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.taille"}}</label>
|
||||
<select name="system.size.value" {{#if isPlayMode}}disabled{{/if}}>
|
||||
{{#each choiceSets.personnageSizeOptions as |option|}}
|
||||
<option value="{{option.value}}" {{#if (eq option.value @root.system.size.value)}}selected{{/if}}>{{option.label}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
<span>{{derived.sizeLabel}}</span>
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.ui.vie"}}</label>
|
||||
<input name="system.hp.value" type="number" value="{{system.hp.value}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
<span>/ {{derived.hpMax}}</span>
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.ui.songes"}}</label>
|
||||
<input name="system.songes.value" type="number" value="{{system.songes.value}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
<span>{{system.songes.points}} / {{system.songes.max}} pts</span>
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.detteSonges"}}</label>
|
||||
<input name="system.songes.debt" type="number" value="{{system.songes.debt}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.creditSonges"}}</label>
|
||||
<input name="system.songes.xpCredit" type="number" value="{{system.songes.xpCredit}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.ui.cauchemar"}}</label>
|
||||
<input name="system.cauchemar.value" type="number" value="{{system.cauchemar.value}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
<span>{{system.cauchemar.points}} / {{system.cauchemar.max}} pts</span>
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.detteCauchemar"}}</label>
|
||||
<input name="system.cauchemar.debt" type="number" value="{{system.cauchemar.debt}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.creditCauchemar"}}</label>
|
||||
<input name="system.cauchemar.xpCredit" type="number" value="{{system.cauchemar.xpCredit}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.xp"}}</label>
|
||||
<input name="system.experience.value" type="number" value="{{system.experience.value}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.ecorces"}}</label>
|
||||
<input name="system.money.ecorces" type="number" value="{{system.money.ecorces}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.ombreDuTourment"}}</label>
|
||||
<input name="system.flagsNarratifs.ombreDuTourment" type="checkbox" {{checked system.flagsNarratifs.ombreDuTourment}} {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sheet-card creation-card">
|
||||
<h2>{{localize "LESOUBLIES.labels.identite"}}</h2>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.age"}}</label>
|
||||
<input name="system.biodata.age" type="number" value="{{system.biodata.age}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.sexe"}}</label>
|
||||
<input name="system.biodata.sexe" type="text" value="{{system.biodata.sexe}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.motsCles"}}</label>
|
||||
<input name="system.biodata.motscles" type="text" value="{{system.biodata.motscles}}" {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.capitaine"}}</label>
|
||||
<input name="system.flagsNarratifs.isCaptain" type="checkbox" {{checked system.flagsNarratifs.isCaptain}} {{#if isPlayMode}}disabled{{/if}} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sheet-card creation-card">
|
||||
<h2>{{localize "LESOUBLIES.ui.creation"}}</h2>
|
||||
<div class="creation-slots" data-creation-drop-zone>
|
||||
{{#each creationSlots as |slot|}}
|
||||
<article class="creation-slot {{#if slot.item}}is-filled{{else}}is-empty{{/if}}" data-drop-creation-type="{{slot.type}}">
|
||||
<div class="creation-slot-header">
|
||||
<div>
|
||||
<p class="creation-slot-kicker">{{slot.label}}</p>
|
||||
{{#if slot.item}}
|
||||
<strong class="creation-slot-name">{{slot.item.name}}</strong>
|
||||
{{else}}
|
||||
<strong class="creation-slot-name">—</strong>
|
||||
{{/if}}
|
||||
</div>
|
||||
{{#if slot.item}}
|
||||
<div class="item-controls">
|
||||
<button type="button" data-action="editItem" data-item-id="{{slot.item.id}}">{{localize "LESOUBLIES.ui.edit"}}</button>
|
||||
{{#unless @root.isPlayMode}}
|
||||
<button type="button" data-action="removeCreationItem" data-type="{{slot.type}}">{{localize "LESOUBLIES.ui.delete"}}</button>
|
||||
{{/unless}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="creation-slot-body">
|
||||
{{#if slot.item}}
|
||||
<img class="creation-slot-image" src="{{slot.item.img}}" alt="{{slot.item.name}}" />
|
||||
<p class="help-text">{{slot.filledHint}}</p>
|
||||
{{else}}
|
||||
<p class="help-text">{{slot.emptyHint}}</p>
|
||||
{{/if}}
|
||||
</div>
|
||||
</article>
|
||||
{{/each}}
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<label>{{localize "LESOUBLIES.labels.compagnie"}}</label>
|
||||
<select name="system.references.compagnieId" {{#if isPlayMode}}disabled{{/if}}>
|
||||
<option value="">—</option>
|
||||
{{#each choiceSets.companyOptions as |option|}}
|
||||
<option value="{{option.value}}" {{#if (eq option.value @root.system.references.compagnieId)}}selected{{/if}}>{{option.label}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
</div>
|
||||
<p class="help-text"><strong>{{localize "LESOUBLIES.labels.compagnie"}} :</strong> {{#if derived.compagnie}}{{derived.compagnie.name}}{{else}}—{{/if}}</p>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="sheet-tab {{tabs.skills.cssClass}}" data-tab="skills">
|
||||
<section class="sheet-card ledger-card">
|
||||
<div class="section-title-row">
|
||||
<h2>{{localize "LESOUBLIES.ui.competences"}}</h2>
|
||||
<button type="button" data-action="createItem" data-type="competence">+ {{localize "TYPES.Item.competence"}}</button>
|
||||
</div>
|
||||
{{#each skillGroups as |group|}}
|
||||
<div class="group-block">
|
||||
<div class="group-header">
|
||||
<h3>{{group.label}}</h3>
|
||||
<label class="profile-badge">
|
||||
<span>{{localize "LESOUBLIES.labels.profil"}}</span>
|
||||
<input name="system.profils.{{group.id}}" type="number" value="{{group.profileValue}}" {{#if @root.isPlayMode}}disabled{{/if}} />
|
||||
</label>
|
||||
</div>
|
||||
<div class="item-list">
|
||||
{{#each group.items as |entry|}}
|
||||
<article class="item-card">
|
||||
<div>
|
||||
<strong>{{entry.item.name}}</strong>
|
||||
<div>Base {{entry.item.system.base}} + {{group.label}} {{group.profileValue}} - {{localize "LESOUBLIES.labels.valeurFinale"}} {{entry.finalValue}}</div>
|
||||
</div>
|
||||
<div class="item-controls">
|
||||
<button type="button" data-action="rollSkill" data-item-id="{{entry.item.id}}">{{localize "LESOUBLIES.ui.roll"}}</button>
|
||||
<button type="button" data-action="editItem" data-item-id="{{entry.item.id}}">Edit</button>
|
||||
<button type="button" data-action="deleteItem" data-item-id="{{entry.item.id}}">Delete</button>
|
||||
</div>
|
||||
</article>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section class="sheet-tab {{tabs.actions.cssClass}}" data-tab="actions">
|
||||
<section class="sheet-card ledger-card">
|
||||
<div class="section-title-row">
|
||||
<h2>{{localize "LESOUBLIES.ui.combat"}}</h2>
|
||||
<div class="embed-buttons">
|
||||
<button type="button" data-action="openCombatPreset" data-preset="encourager">Encourager</button>
|
||||
<button type="button" data-action="openCombatPreset" data-preset="intimider">Intimider</button>
|
||||
<button type="button" data-action="openCombatPreset" data-preset="evaluer">Évaluer</button>
|
||||
<button type="button" data-action="openCombatPreset" data-preset="maitriser">Maîtriser</button>
|
||||
<button type="button" data-action="openCombatPreset" data-preset="seDeplacer">Se déplacer</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sheet-card ledger-card">
|
||||
<div class="section-title-row">
|
||||
<h2>{{localize "LESOUBLIES.ui.magie"}}</h2>
|
||||
<button type="button" data-action="createItem" data-type="sortilege">+ {{localize "TYPES.Item.sortilege"}}</button>
|
||||
</div>
|
||||
<div class="item-list">
|
||||
{{#each spells as |item|}}
|
||||
<article class="item-card">
|
||||
<div>
|
||||
<strong>{{item.name}}</strong>
|
||||
<div>{{item.system.tradition}} / {{item.system.polarity}} / coût {{item.system.cost}}</div>
|
||||
</div>
|
||||
<div class="item-controls">
|
||||
<button type="button" data-action="useSpell" data-item-id="{{item.id}}">Activer</button>
|
||||
<button type="button" data-action="editItem" data-item-id="{{item.id}}">Edit</button>
|
||||
<button type="button" data-action="deleteItem" data-item-id="{{item.id}}">Delete</button>
|
||||
</div>
|
||||
</article>
|
||||
{{/each}}
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section class="sheet-tab {{tabs.equipment.cssClass}}" data-tab="equipment">
|
||||
<section class="sheet-card ledger-card">
|
||||
<div class="section-title-row">
|
||||
<h2>{{localize "LESOUBLIES.ui.equipement"}}</h2>
|
||||
<div class="embed-buttons">
|
||||
<button type="button" data-action="createItem" data-type="arme">+ {{localize "TYPES.Item.arme"}}</button>
|
||||
<button type="button" data-action="createItem" data-type="armure">+ {{localize "TYPES.Item.armure"}}</button>
|
||||
<button type="button" data-action="createItem" data-type="equipement">+ {{localize "TYPES.Item.equipement"}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-list">
|
||||
{{#each weapons as |item|}}
|
||||
<article class="item-card">
|
||||
<div><strong>{{item.name}}</strong><div>{{localize "TYPES.Item.arme"}} - {{item.system.damage}}</div></div>
|
||||
<div class="item-controls"><button type="button" data-action="useWeapon" data-item-id="{{item.id}}">Attaque</button><button type="button" data-action="resolveWeaponDamage" data-item-id="{{item.id}}">Dégâts</button><button type="button" data-action="editItem" data-item-id="{{item.id}}">Edit</button><button type="button" data-action="deleteItem" data-item-id="{{item.id}}">Delete</button></div>
|
||||
</article>
|
||||
{{/each}}
|
||||
{{#each armors as |item|}}
|
||||
<article class="item-card">
|
||||
<div><strong>{{item.name}}</strong><div>{{localize "TYPES.Item.armure"}} - Prot {{item.system.protection}}</div></div>
|
||||
<div class="item-controls"><button type="button" data-action="editItem" data-item-id="{{item.id}}">Edit</button><button type="button" data-action="deleteItem" data-item-id="{{item.id}}">Delete</button></div>
|
||||
</article>
|
||||
{{/each}}
|
||||
{{#each equipment as |item|}}
|
||||
<article class="item-card">
|
||||
<div><strong>{{item.name}}</strong><div>{{localize "TYPES.Item.equipement"}} - {{item.system.category}}</div></div>
|
||||
<div class="item-controls"><button type="button" data-action="editItem" data-item-id="{{item.id}}">Edit</button><button type="button" data-action="deleteItem" data-item-id="{{item.id}}">Delete</button></div>
|
||||
</article>
|
||||
{{/each}}
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section class="sheet-tab {{tabs.notes.cssClass}}" data-tab="notes">
|
||||
<section class="sheet-card notes-card">
|
||||
<h2>{{localize "LESOUBLIES.ui.notes"}}</h2>
|
||||
<label>{{localize "LESOUBLIES.labels.description"}}</label>
|
||||
{{formInput systemFields.biodata.fields.description enriched=enriched.biodata.description value=system.biodata.description name="system.biodata.description" toggled=true}}
|
||||
<label>{{localize "LESOUBLIES.labels.notes"}}</label>
|
||||
{{formInput systemFields.biodata.fields.notes enriched=enriched.biodata.notes value=system.biodata.notes name="system.biodata.notes" toggled=true}}
|
||||
<label>{{localize "LESOUBLIES.labels.gmnotes"}}</label>
|
||||
{{formInput systemFields.biodata.fields.gmnotes enriched=enriched.biodata.gmnotes value=system.biodata.gmnotes name="system.biodata.gmnotes" toggled=true}}
|
||||
<label>{{localize "LESOUBLIES.labels.liensNarratifs"}}</label>
|
||||
{{formInput systemFields.visions enriched=enriched.visions value=system.visions name="system.visions" toggled=true}}
|
||||
{{#if activeCompanyPower}}
|
||||
<label>{{localize "LESOUBLIES.labels.pouvoirCompagnieActif"}}</label>
|
||||
<div class="help-text">{{activeCompanyPower.name}} — {{activeCompanyPower.system.activationCondition}}</div>
|
||||
{{/if}}
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
Reference in New Issue
Block a user