daggerheart/templates/sheets/environment.hbs

<div>
    <header class="adversary-header-container">
        <div class="adversary-header flexrow">
            <img class="flex0" src="{{source.img}}" data-action="onEditImage" data-edit="img" title="{{source.name}}" height="64" width="64"/>
            <div class="adversary-title">
                {{#if this.editMode}}
                    <input class="title-text" name="name" type="text" value="{{source.name}}" placeholder="{{ localize 'Name' }}"/>
                {{else}}
                    <div class="title-text">{{source.name}}</div>
                {{/if}}
            </div>
        </div>
        <i class="fa-solid fa-wrench icon-button secondary {{#if this.editMode}}active{{/if}}" data-action="toggleSlider" style="position: absolute; right: 4px; top: 4px;"></i>
    </header>
    <section class="sheet-body">
        {{#if this.editMode}}
            <div>
                <h2>{{localize "DAGGERHEART.Sheets.Adversary.Description"}}</h2>
                <textarea name="system.description">{{source.system.description}}</textarea>
                <h2>{{localize "DAGGERHEART.Sheets.Environment.ToneAndFeel"}}</h2>
                <textarea name="system.toneAndFeel">{{source.system.toneAndFeel}}</textarea>
            </div>
            <div class="flexrow" style="align-items: baseline;">
                <div class="adversary-statistics-container">
                    <div class="form-group">
                        <label>{{localize "DAGGERHEART.Sheets.Adversary.Tier"}}</label>
                        <div class="form-fields">
                            <select name="system.tier">
                                {{selectOptions config.GENERAL.tiers selected=source.system.tier labelAttr="key"}}
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label>{{localize "DAGGERHEART.Sheets.Adversary.Type"}}</label>
                        <div class="form-fields">
                            <select name="system.type">
                                {{selectOptions config.ACTOR.adversaryTypes selected=source.system.type labelAttr="name" localize=true}}
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label>{{localize "DAGGERHEART.Sheets.Adversary.Difficulty"}}</label>
                        <div class="form-fields">
                            <input type="text" name="system.difficulty" value="{{source.system.difficulty}}" data-dtype="Number" />
                        </div>
                    </div>
                    <h2>{{localize "DAGGERHEART.Sheets.Environment.PotentialAdversaries"}}</h2>
                    <textarea name="system.potentialAdversaries">{{source.system.potentialAdversaries}}</textarea>
                </div>
                <div class="adversary-moves-container">
                    <h2 class="moves-edit-container">{{localize "DAGGERHEART.Sheets.Adversary.Moves"}} <i class="fa-solid fa-plus" data-action="addFeature"></i></h2>
                    {{#each data.features as |feature key|}}
                        <div class="chip-container">
                            <div class="chip-inner-container">
                                <img src="{{feature.img}}" />
                                <div class="move-title">{{feature.name}}</div>
                            </div>
                            <div class="chip-inner-container">
                                <button data-action="viewFeature" data-feature={{feature.uuid}}><i class="fa-solid fa-fw fa-search"></i></button>
                                <button data-action="removeFeature" data-feature={{feature.uuid}}><i class="fa-solid fa-trash"></i></button>
                            </div>
                        </div>
                    {{/each}}
                </div>
            </div>
        {{else}}
            <div class="motive-container">
                <div class="motive-title">
                    <span class="motive-title-value"><strong>{{localize "DAGGERHEART.Sheets.Adversary.Description"}}:</strong> {{source.system.description}}</span>
                </div>
                <div class="motive-title">
                    <span class="motive-title-value"><strong>{{localize "DAGGERHEART.Sheets.Environment.ToneAndFeel"}}:</strong> {{source.system.toneAndFeel}}</span>
                </div>
            </div>
            <div class="flexrow" style="align-items: baseline;">
                <div class="adversary-statistics-container">
                    <div class="statistic-section">
                        <div class="statistic-row">
                            <label class="statistic-title">{{localize "DAGGERHEART.Sheets.Adversary.Tier"}}:</label>
                            <span class="statistic-value">{{source.system.tier}}</span>
                        </div>
                        <div class="statistic-row">
                            <label class="statistic-title">{{localize "DAGGERHEART.Sheets.Adversary.Type"}}:</label>
                            <span class="statistic-value">{{this.data.type}}</span>
                        </div>
                    </div>
                    <div class="statistic-section">
                        <div class="statistic-row">
                            <label class="statistic-title">{{localize "DAGGERHEART.Sheets.Adversary.Difficulty"}}:</label>
                            <span class="statistic-value">{{source.system.difficulty}}</span>
                        </div>
                    </div>
                    <div class="statistic-section">

                            <label class="statistic-title">{{localize "DAGGERHEART.Sheets.Environment.PotentialAdversaries"}}:</label>
                            <span>{{source.system.potentialAdversaries}}</span>
                    </div>
                </div>
                <div class="adversary-moves-container">
                    <div class="moves-title">{{localize "DAGGERHEART.Sheets.Adversary.Moves"}}</div>
                    {{#each data.features as |feature index|}}
                        <div class="move-container" data-action="useFeature" data-feature="{{feature.uuid}}" data-action-type="{{feature.system.actionType}}">
                            <label class="moves-name">{{feature.name}} - {{feature.system.actionType}}</label>
                            <div class="move-description">{{{feature.system.description}}}</div>
                        </div>
                    {{/each}}
                </div>
            </div>
        {{/if}}
    </section>
</div>