daggerheart/templates/sheets/domainCard.hbs

<div>
    <header class="flexcol">
        <div class="title-container">
            <img class="flex0" src="{{source.img}}" data-edit="img" data-action="onEditImage" title="{{source.name}}" height="64" width="64"/>
            <div class="title-name">
                {{formInput fields.name value=source.name rootId=partId}}
            </div>
        </div>
        <nav class="sheet-tabs tabs">
            {{#each tabs as |tab|}}
                <a class="{{tab.cssClass}}" data-action="tab" data-group="{{tab.group}}" data-tab="{{tab.id}}">
                    <i class="{{tab.icon}}"></i>
                    <label>{{localize tab.label}}</label>
                </a>
            {{/each}}
        </nav>
    </header>

    <section class="sheet-body">
         <div class="tab {{this.tabs.general.cssClass}}" data-group="primary" data-tab="general">
            {{formField systemFields.type value=source.system.type label="Type" localize=true blank=""}}
            {{formField systemFields.foundation value=source.system.foundation label="Foundation" }}
            {{formField systemFields.domain value=source.system.domain label="Domain" localize=true blank=""}}
            {{formField systemFields.level value=source.system.level label="level" data-dtype="Number"}}
            {{formField systemFields.recallCost value=source.system.recallCost label="Recall Cost" data-dtype="Number"}}
            {{formField systemFields.effect value=source.system.effect label="Description" enriched=source.system.effect toggled=true}}
        </div>
        
        <div class="tab {{this.tabs.actions.cssClass}}" data-group="primary" data-tab="actions">
            <h2>{{localize "Actions"}} <i class="fa-solid fa-plus icon-button" data-action="addAction"></i></h2>
            <div class="flexrow">
                {{#each source.system.actions as |action index|}}
                    <div data-action="editAction" data-index="{{index}}" class="ability-chip">
                        <img src="{{action.img}}" />
                        <div>{{action.name}}</div>
                        <button data-action="removeAction" data-index="{{index}}"><i class="fa-solid fa-x"></i></button>
                    </div> 
                {{/each}}
            </div>
        </div>
    </section>
</div>

{{!-- <form class={{cssClass}} autocomplete="off">
    <header class="flexcol">
        <div class="flexrow">
            <img class="flex0" src="{{item.img}}" data-edit="img" title="{{item.name}}" height="64" width="64"/>
            <div class="title-name">
                <h2><input name="name" type="text" value="{{item.name}}" placeholder="{{ localize 'Name' }}"/></h2>
            </div>
        </div>
    </header>

    <section class="sheet-body">
        <div class="form-group">
            <label>{{localize "DAGGERHEART.Sheets.DomainCard.Category"}}</label>
            <div class="form-fields">
                <label>{{localize "DAGGERHEART.Sheets.DomainCard.Type"}}</label>
                <select name="system.type">
                    {{selectOptions config.DOMAIN.cardTypes selected=item.system.type labelAttr="name" localize=true blank=""}}
                </select>
                <label>{{localize "DAGGERHEART.Sheets.DomainCard.Foundation"}}</label>
                <input name="system.foundation" type="checkbox" {{checked item.system.foundation}} />
            </div>
        </div>
        <div class="form-group">
            <label>{{localize "DAGGERHEART.Sheets.DomainCard.Domain"}}</label>
            <div class="form-fields">
                <select name="system.domain">
                    {{selectOptions config.DOMAIN.domains selected=item.system.domain labelAttr="name" localize=true blank=""}}
                </select>
            </div>
        </div>
        <div class="form-group">
            <label>{{localize "DAGGERHEART.Sheets.DomainCard.Costs"}}</label>
            <div class="form-fields">
                <label>{{localize "DAGGERHEART.Sheets.DomainCard.Level"}}</label>
                <input name="system.level" value="{{item.system.level}}" type="text" data-dtype="Number" />
                <label>{{localize "DAGGERHEART.Sheets.DomainCard.RecallCost"}}</label>
                <input name="system.recallCost" value="{{item.system.recallCost}}" type="text" data-dtype="Number" />
            </div>
        </div>

        <div class="domain-card-description">
            <h2>{{localize "DAGGERHEART.Sheets.DomainCard.Description"}}</h2>
            {{editor item.system.effect target="system.effect" button=true}}
        </div>
    </section>


    <h2>{{localize "Actions"}} <i class="fa-solid fa-plus icon-button" data-action="addAction"></i></h2>
    <div class="flexrow">
        {{#each this.actions as |action index|}}
            <div data-action="editAction" data-index="{{index}}" class="ability-chip">
                <img src="{{action.img}}" />
                <div>{{action.name}}</div>
                <button data-action="removeAction" data-index="{{index}}"><i class="fa-solid fa-x"></i></button>
            </div> 
        {{/each}}
    </div>
</form>  --}}