fvtt-les-oublies/templates/chat-confrontation-roll.hbs

<div class="les-oublies-chat-card confrontation-card">
  <header class="chat-card-header chat-card-header--confrontation">
    <div class="chat-card-banner chat-card-banner--confrontation">
      <img class="chat-card-portrait" src="{{actor.img}}" alt="{{actor.name}}" />
      <div class="chat-card-heading">
        <div class="chat-card-meta-row">
          <span class="chat-card-pill">{{localize "LESOUBLIES.rolls.confrontation"}}</span>
          <span class="chat-card-pill chat-card-pill--soft">{{localize "LESOUBLIES.rolls.confrontationType"}} · {{confrontationType}}</span>
        </div>
        <h3>{{attacker.label}} · {{defender.label}}</h3>
      </div>
      <div class="chat-card-outcome">
        <div class="chat-card-badge neutral">{{outcomeLabel}}</div>
      </div>
    </div>
  </header>

  <section class="chat-card-body confrontation-body">
    {{#if action}}
      <article class="chat-side-card">
        <div class="chat-side-head">
          <h2>{{action.title}}</h2>
          {{#if action.subtitle}}<span class="chat-side-mode">{{action.subtitle}}</span>{{/if}}
        </div>
        {{#if action.hint}}<p class="roll-formula"><strong>Rappel</strong> : {{action.hint}}</p>{{/if}}
        {{#if action.modifiers.labels.length}}
          <div class="chat-callouts">
            <div class="chat-callout">
              <span>Modificateurs</span>
              <strong>{{join action.modifiers.labels}}</strong>
            </div>
          </div>
        {{/if}}
        {{#if action.outcome}}
          {{#if action.outcome.success}}
            <div class="chat-callouts">
              <div class="chat-callout">
                <span>{{action.outcome.label}}</span>
                <strong>{{action.outcome.description}}</strong>
              </div>
            </div>
          {{/if}}
        {{/if}}
        {{#if action.damage}}
          <div class="chat-callouts">
            <div class="chat-callout">
              <span>Dégâts</span>
              <strong>{{action.damage.finalDamage}}</strong>
              {{#if action.damage.nonLethal}}<em>Non létal</em>{{/if}}
            </div>
            <div class="chat-callout">
              <span>Protection</span>
              <strong>{{action.damage.effectiveProtection}}</strong>
              <em>{{action.damage.targetLabel}}</em>
            </div>
          </div>
        {{/if}}
        {{#if action.notes}}<p class="roll-formula"><strong>Notes</strong> : {{action.notes}}</p>{{/if}}
      </article>
    {{/if}}

    <article class="chat-side-card {{#if attacker.success}}is-success{{else}}is-failure{{/if}}">
      <div class="chat-side-head">
        <h2>{{attacker.label}}</h2>
        <span class="chat-side-mode">{{attacker.rollModeLabel}}</span>
      </div>
      <div class="roll-summary-grid">
        <div><span>{{localize "LESOUBLIES.rolls.score"}}</span><strong>{{attacker.score}}</strong></div>
        <div><span>{{localize "LESOUBLIES.rolls.difficulty"}}</span><strong>{{numberFormat attacker.difficulty sign=true}}</strong></div>
        <div><span>{{localize "LESOUBLIES.rolls.natural"}}</span><strong>{{attacker.natural}}</strong></div>
        <div><span>{{localize "LESOUBLIES.rolls.final"}}</span><strong>{{attacker.final}}</strong></div>
      </div>
      <p class="roll-formula"><strong>{{localize "LESOUBLIES.rolls.resolution"}}</strong> : {{attacker.natural}} + {{attacker.score}} {{numberFormat attacker.difficulty sign=true}}{{#if attacker.finalModifier}} {{numberFormat attacker.finalModifier sign=true}}{{/if}} = {{attacker.final}}</p>
      <div class="dice-strip">
        {{#each attacker.dice as |die|}}
          <div class="die-chip {{#if (eq die.index @root.attacker.selectedDie.index)}}selected{{/if}}">
            <strong>{{die.typeLabel}}</strong>
            <span>{{die.breakdown}}</span>
            {{#if die.exploded}}<em>{{localize "LESOUBLIES.rolls.exploded"}}</em>{{/if}}
            {{#if die.sourceLabel}}<em>{{die.sourceLabel}}</em>{{/if}}
          </div>
        {{/each}}
      </div>
      <div class="chat-callouts">
        <div class="chat-callout">
          <span>{{localize "LESOUBLIES.rolls.result"}}</span>
          <strong>{{attacker.successLabel}}</strong>
          <em>{{attacker.selectedSummary}}</em>
        </div>
        <div class="chat-callout">
          <span>{{localize "LESOUBLIES.rolls.debt"}}</span>
          <strong>{{attacker.debt.label}}</strong>
        </div>
        {{#if attacker.spentResource}}
          <div class="chat-callout">
            <span>{{localize "LESOUBLIES.rolls.extraDie"}}</span>
            <strong>{{attacker.spentResource.label}}</strong>
          </div>
        {{/if}}
        {{#if attacker.automaticFailure}}
          <div class="chat-callout warning">
            <span>{{localize "LESOUBLIES.rolls.result"}}</span>
            <strong>{{localize "LESOUBLIES.rolls.naturalOne"}}</strong>
          </div>
        {{/if}}
      </div>
    </article>

    <article class="chat-side-card {{#if defender.success}}is-success{{else}}is-failure{{/if}}">
      <div class="chat-side-head">
        <h2>{{defender.label}}</h2>
        <span class="chat-side-mode">{{defender.rollModeLabel}}</span>
      </div>
      <div class="roll-summary-grid">
        <div><span>{{localize "LESOUBLIES.rolls.score"}}</span><strong>{{defender.score}}</strong></div>
        <div><span>{{localize "LESOUBLIES.rolls.difficulty"}}</span><strong>{{numberFormat defender.difficulty sign=true}}</strong></div>
        <div><span>{{localize "LESOUBLIES.rolls.natural"}}</span><strong>{{defender.natural}}</strong></div>
        <div><span>{{localize "LESOUBLIES.rolls.final"}}</span><strong>{{defender.final}}</strong></div>
      </div>
      <p class="roll-formula"><strong>{{localize "LESOUBLIES.rolls.resolution"}}</strong> : {{defender.natural}} + {{defender.score}} {{numberFormat defender.difficulty sign=true}}{{#if defender.finalModifier}} {{numberFormat defender.finalModifier sign=true}}{{/if}} = {{defender.final}}</p>
      <div class="dice-strip">
        {{#each defender.dice as |die|}}
          <div class="die-chip {{#if (eq die.index @root.defender.selectedDie.index)}}selected{{/if}}">
            <strong>{{die.typeLabel}}</strong>
            <span>{{die.breakdown}}</span>
            {{#if die.exploded}}<em>{{localize "LESOUBLIES.rolls.exploded"}}</em>{{/if}}
            {{#if die.sourceLabel}}<em>{{die.sourceLabel}}</em>{{/if}}
          </div>
        {{/each}}
      </div>
      <div class="chat-callouts">
        <div class="chat-callout">
          <span>{{localize "LESOUBLIES.rolls.result"}}</span>
          <strong>{{defender.successLabel}}</strong>
          <em>{{defender.selectedSummary}}</em>
        </div>
        <div class="chat-callout">
          <span>{{localize "LESOUBLIES.rolls.debt"}}</span>
          <strong>{{defender.debt.label}}</strong>
        </div>
        {{#if defender.spentResource}}
          <div class="chat-callout">
            <span>{{localize "LESOUBLIES.rolls.extraDie"}}</span>
            <strong>{{defender.spentResource.label}}</strong>
          </div>
        {{/if}}
        {{#if defender.automaticFailure}}
          <div class="chat-callout warning">
            <span>{{localize "LESOUBLIES.rolls.result"}}</span>
            <strong>{{localize "LESOUBLIES.rolls.naturalOne"}}</strong>
          </div>
        {{/if}}
      </div>
    </article>
  </section>
</div>