daggerheart/templates/dialogs/dice-roll/damageSelection.hbs

<section class="damage-section-container">
    <header class="dialog-header">
        <h1>{{title}}</h1>
    </header>

    {{#if hasSelectedEffects}}
        <fieldset class="dialog-selection-container">
            <legend>{{localize "DAGGERHEART.GENERAL.Effect.plural"}}</legend>

            {{#each selectedEffects as |effect id|}}
                <div class="selection-chip {{#if effect.selected}}selected{{/if}}" data-action="toggleSelectedEffect" data-key="{{id}}" data-tooltip="{{this.description}}">
                    <span><i class="{{ifThen effect.selected "fa-solid" "fa-regular"}} fa-circle"></i></span>
                    <span class="label">{{effect.name}}</span>
                </div>
            {{/each}}
        </fieldset>
    {{/if}}
    
    {{#if damageOptions.groupAttack}}
        <fieldset class="group-attack-container">
            <legend>{{localize "DAGGERHEART.ACTIONS.Settings.groupAttack.label"}}</legend>

            <div class="group-attack-inner-container">
                <input type="text" data-dtype="Number" name="damageOptions.groupAttack.numAttackers" value="{{damageOptions.groupAttack.numAttackers}}" />

                <div class="group-attack-tools">
                    <select name="damageOptions.groupAttack.range">
                        {{selectOptions rangeOptions selected=damageOptions.groupAttack.range localize=true}}
                    </select>
                    <button data-action="updateGroupAttack"><i class="fa-solid fa-crosshairs"></i></button>
                </div>
            </div>
        </fieldset>
    {{/if}}
    
    {{#if @root.damageFormula}}
        {{#with @root.damageFormula}}
            <div class="damage-formula">
                <span class="damage-resource"><b>{{localize "DAGGERHEART.GENERAL.formula"}}:</b> {{roll.formula}}</span>
                <span class="damage-details">
                    {{localize "DAGGERHEART.GENERAL.damage"}}
                    {{#if damageTypes}}
                        {{#each damageTypes as | type | }}
                            {{#with (lookup @root.config.GENERAL.damageTypes type)}}
                                <i class="fa-solid {{icon}}"></i>
                            {{/with}}
                        {{/each}}
                    {{/if}}
                </span>
            </div>
            <div class="bonuses form-group flexrow">
                <input type="text" value="{{extraFormula}}" name="damageFormula.extraFormula" placeholder="{{localize "DAGGERHEART.GENERAL.situationalBonus"}}">
                <button class="critical-chip" data-action="toggleCritical">
                    <span><i class="{{#if @root.isCritical}}fa-solid{{else}}fa-regular{{/if}} fa-circle"></i></span>
                    <span class="label">{{localize "DAGGERHEART.GENERAL.criticalShort"}}</span>
                </button>
            </div>
        {{/with}}
    {{/if}}

    {{#each @root.resourceFormulas}}
        <div class="damage-formula">
            <span class="damage-resource"><b>{{localize "DAGGERHEART.GENERAL.formula"}}:</b> {{roll.formula}}</span>
            <span class="damage-details">
                {{#with (lookup @root.config.GENERAL.healingTypes applyTo)}}
                    {{localize label}}
                {{/with}}
            </span>
        </div>
        <div class="bonuses form-group flexrow">
            <input type="text" value="{{extraFormula}}" name={{concat "resourceFormulas." @key ".extraFormula"}} placeholder="{{localize "DAGGERHEART.GENERAL.situationalBonus"}}">
        </div>
    {{/each}}

    {{#unless (empty @root.modifiers)}}
        <fieldset class="modifier-container two-columns">
            <legend>{{localize "DAGGERHEART.GENERAL.Modifier.plural"}}</legend>
            {{#each @root.modifiers}}
                <span class="formula-label">{{ localize label }}</span>
                {{#if (hasProperty this "values")}}
                    <select name="modifiers.{{@key}}.value">
                        {{selectOptions values blank="" selected=value}}
                    </select>
                {{/if}}
                {{#if (hasProperty this "enabled")}}
                    <input type="checkbox" name="modifiers.{{@key}}.enabled" {{ checked enabled }}>
                {{/if}}
            {{/each}}
        </fieldset>
    {{/unless}}

    <div class="damage-section-controls">
        {{#if directDamage}}
            <select class="roll-mode-select" name="selectedMessageMode">
                {{selectOptions rollModes selected=selectedMessageMode valueAttr="action" labelAttr="label" localize=true}}
            </select>
        {{/if}}
        <button class="submit-btn" data-action="submitRoll">
            <i class="fa-solid fa-dice"></i>
            <span class="label">{{localize "DAGGERHEART.GENERAL.roll"}}</span>
        </button>
    </div>
</section>