daggerheart/templates/sheets/class.hbs

<div>
    <header class="flexcol">
        <div class="flexrow">
            <img class="flex0" src="{{source.img}}" data-edit="img" data-action="onEditImage" title="{{source.name}}" height="64" width="64"/>
            <div class="flexcol">
                <h2 style="margin-bottom: 4px; margin-left: 8px;"><input name="name" type="text" value="{{source.name}}" placeholder="{{ localize 'Name' }}"/></h2>
                {{!-- <nav class="sheet-tabs tabs" data-group="primary">
                    <a class="item" data-tab="features" data-action="tabSwitch">{{localize "DAGGERHEART.Sheets.Class.Tabs.Features"}}</a>
                    <a class="item" data-tab="guide">{{localize "DAGGERHEART.Sheets.Class.Tabs.Guide"}}</a>
                </nav> --}}
                <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>
            </div>
        </div>
    </header>
    <section class="sheet-body flexcol">
        <div class="tab features {{this.tabs.features.cssClass}}" data-group="primary" data-tab="features">
            <div class="form-group">
                <label>{{localize "DAGGERHEART.Sheets.Class.Domains"}}</label>
                <div class="form-fields">
                    <input class="domain-input" value="{{domains}}" />
                </div>
            </div>
            {{formField systemFields.evasion value=source.system.evasion label=(localize "DAGGERHEART.Sheets.Class.Evasion")}}
            {{!-- <div class="form-group">
                <label>{{localize "DAGGERHEART.Sheets.Class.Evasion"}}</label>
                <div class="form-fields">
                    <input name="system.evasion" value="{{source.system.evasion}}" placeholder="Minor" type="text" data-dtype="Number" />
                </div>
            </div> --}}
            <div>
                <h2>{{localize "DAGGERHEART.Sheets.Class.ClassFeatures"}}</h2>
                <div>
                    {{#each source.system.features as |feature index|}}
                        <div class="feature-container">
                            <div class="feature-inner-container">
                                <img src="{{feature.img}}" />
                                <div class="feature-title">{{feature.name}}</div>
                            </div>
                            <div class="subclass-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>
            <div>
                <h2>{{localize "DAGGERHEART.Sheets.Class.Subclasses"}}</h2>
                <div>
                    {{#each source.system.subclasses as |subclass index|}}
                        <div class="feature-container">
                            <div class="feature-inner-container">
                                <img src="{{subclass.img}}" />
                                <div class="feature-title">{{subclass.name}}</div>
                            </div>
                            <div class="subclass-inner-container">
                                <button data-action="viewSubclass" data-subclass={{subclass.uuid}}><i class="fa-solid fa-fw fa-search"></i></button>
                                <button data-action="removeSubclass" data-subclass={{subclass.uuid}}><i class="fa-solid fa-trash"></i></button>
                            </div>
                        </div>
                    {{/each}}
                </div>
            </div>
        </div>
        <div class="tab guide {{this.tabs.guide.cssClass}}" data-group="primary" data-tab="guide">
            <div class="flexcol">
                <div class="guide-section flexrow flex1">
                    <div class="flex-col-centered">
                        <div class="guide-section-title-centered">{{localize "DAGGERHEART.Sheets.Class.Guide.Suggestions.Title"}}</div>
                        <fieldset class="drop-section">
                            <legend>
                                {{localize "DAGGERHEART.Sheets.Class.Guide.Suggestions.Traits.Title"}}
                            </legend>

                            <div class="form-group flexrow">
                                <label>{{localize "DAGGERHEART.Abilities.agility.name"}}</label>
                                <div class="form-fields flex0 trait-input">
                                    <input type="text" name="system.characterGuide.suggestedTraits.agility" value="{{source.system.characterGuide.suggestedTraits.agility}}" />
                                </div>
                            </div>
                            <div class="form-group flexrow">
                                <label>{{localize "DAGGERHEART.Abilities.strength.Name"}}</label>
                                <div class="form-fields flex0 trait-input">
                                    <input type="text" name="system.characterGuide.suggestedTraits.strength" value="{{source.system.characterGuide.suggestedTraits.strength}}" />
                                </div>
                            </div>
                            <div class="form-group flexrow">
                                <label>{{localize "DAGGERHEART.Abilities.Finesse.Name"}}</label>
                                <div class="form-fields flex0 trait-input">
                                    <input type="text" name="system.characterGuide.suggestedTraits.finesse" value="{{source.system.characterGuide.suggestedTraits.finesse}}" />
                                </div>
                            </div>
                            <div class="form-group flexrow">
                                <label>{{localize "DAGGERHEART.Abilities.Instinct.Name"}}</label>
                                <div class="form-fields flex0 trait-input">
                                    <input type="text" name="system.characterGuide.suggestedTraits.instinct" value="{{source.system.characterGuide.suggestedTraits.instinct}}" />
                                </div>
                            </div>
                            <div class="form-group flexrow">
                                <label>{{localize "DAGGERHEART.Abilities.Presence.Name"}}</label>
                                <div class="form-fields flex0 trait-input">
                                    <input type="text" name="system.characterGuide.suggestedTraits.presence" value="{{source.system.characterGuide.suggestedTraits.presence}}" />
                                </div>
                            </div>
                            <div class="form-group flexrow">
                                <label>{{localize "DAGGERHEART.Abilities.Knowledge.Name"}}</label>
                                <div class="form-fields flex0 trait-input">
                                    <input type="text" name="system.characterGuide.suggestedTraits.knowledge" value="{{source.system.characterGuide.suggestedTraits.knowledge}}" />
                                </div>
                            </div>
                        </fieldset>
                        <fieldset class="drop-section primary-weapon-section">
                            <legend class="levelup-legend">
                                {{localize "DAGGERHEART.Sheets.Class.Guide.SuggestedPrimaryWeaponTitle"}}
                            </legend>
                            
                            <div class="drop-section-body">
                                {{#if source.system.characterGuide.suggestedPrimaryWeapon}}
                                    <div data-action="viewItem" data-item="{{source.system.characterGuide.suggestedPrimaryWeapon.uuid}}" class="suggested-item suggested-primary-weapon">
                                        <img src="{{source.system.characterGuide.suggestedPrimaryWeapon.img}}" />
                                        <div>{{source.system.characterGuide.suggestedPrimaryWeapon.name}}</div>
                                        <i data-action="removePrimaryWeapon" class="fa-solid fa-trash icon-button"></i>
                                    </div>
                                {{/if}}
                            </div>
                        </fieldset>
                        <fieldset class="drop-section secondary-weapon-section">
                            <legend class="levelup-legend">
                                {{localize "DAGGERHEART.Sheets.Class.Guide.SuggestedSecondaryWeaponTitle"}}
                            </legend>
                            
                            <div class="drop-section-body">
                                {{#if source.system.characterGuide.suggestedSecondaryWeapon}}
                                    <div data-action="viewItem" data-item="{{source.system.characterGuide.suggestedSecondaryWeapon.uuid}}" class="suggested-item">
                                        <img src="{{source.system.characterGuide.suggestedSecondaryWeapon.img}}" />
                                        <div>{{source.system.characterGuide.suggestedSecondaryWeapon.name}}</div>
                                        <i data-action="removeSecondaryWeapon" class="fa-solid fa-trash icon-button"></i>
                                    </div>
                                {{/if}}
                            </div>
                        </fieldset>
                        <fieldset class="drop-section armor-section">
                            <legend class="levelup-legend">
                                {{localize "DAGGERHEART.Sheets.Class.Guide.SuggestedArmorTitle"}}
                            </legend>
                            
                            <div class="drop-section-body">
                                {{#if source.system.characterGuide.suggestedArmor}}
                                    <div data-action="viewItem" data-item="{{source.system.characterGuide.suggestedArmor.uuid}}" class="suggested-item">
                                        <img src="{{source.system.characterGuide.suggestedArmor.img}}" />
                                        <div>{{source.system.characterGuide.suggestedArmor.name}}</div>
                                        <i data-action="removeArmor" class="fa-solid fa-trash icon-button"></i>
                                    </div>
                                {{/if}}
                            </div>
                        </fieldset>
                    </div>
                    <div class="flex-col-centered">
                        <div class="guide-section-title-centered">{{localize "DAGGERHEART.Sheets.Class.Guide.Inventory.Title"}}</div>
                        <fieldset class="drop-section take-section">
                            <legend class="levelup-legend">
                                {{localize "DAGGERHEART.Sheets.Class.Guide.Inventory.Take"}}
                            </legend>
                            
                            <div class="drop-section-body">
                                {{#each source.system.inventory.take}}
                                    <div data-action="viewItem" data-item="{{this.uuid}}" class="suggested-item">
                                        <img src="{{this.img}}" />
                                        <div>{{this.name}}</div>
                                        <i data-action="removeItem" data-type="take" data-item="{{this.uuid}}" class="fa-solid fa-trash icon-button"></i>
                                    </div>
                                {{/each}}
                            </div>
                        </fieldset>
                        <fieldset class="drop-section choice-a-section">
                            <legend class="levelup-legend">
                                {{localize "DAGGERHEART.Sheets.Class.Guide.Inventory.ThenChoose"}}
                            </legend>
                            
                            <div class="drop-section-body">
                                {{#each source.system.inventory.choiceA}}
                                    <div data-action="viewItem" data-item="{{this.uuid}}" class="suggested-item">
                                        <img src="{{this.img}}" />
                                        <div>{{this.name}}</div>
                                        <i data-action="removeItem" data-type="choiceA" data-item="{{this.uuid}}" class="fa-solid fa-trash icon-button"></i>
                                    </div>
                                {{/each}}
                            </div>
                        </fieldset>
                        <fieldset class="drop-section choice-b-section">
                            <legend class="levelup-legend">
                                {{localize "DAGGERHEART.Sheets.Class.Guide.Inventory.AndEither"}}
                            </legend>
                            
                            <div class="drop-section-body">
                                {{#each source.system.inventory.choiceB}}
                                    <div data-action="viewItem" data-item="{{this.uuid}}" class="suggested-item">
                                        <img src="{{this.img}}" />
                                        <div>{{this.name}}</div>
                                        <i data-action="removeItem" data-type="choiceB" data-item="{{this.uuid}}" class="fa-solid fa-trash icon-button"></i>
                                    </div>
                                {{/each}}
                            </div>
                        </fieldset>
                    </div>
                    <div class="flex-col-centered">
                        <div class="guide-section-title-centered">{{localize "DAGGERHEART.Sheets.Class.Guide.Description.Title"}}</div>
                        <div class="choice-a-section">
                            <div class="inventory-title">{{localize "DAGGERHEART.Sheets.Class.Guide.Description.Explanation"}}</div>
                            <div class="form-group">
                                <label>{{localize "DAGGERHEART.Sheets.Class.Guide.Description.Clothes"}}</label>
                                <div class="form-fields">
                                    <input type="text" name="system.characterGuide.characterDescription.clothes" value="{{source.system.characterGuide.characterDescription.clothes}}" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label>{{localize "DAGGERHEART.Sheets.Class.Guide.Description.Eyes"}}</label>
                                <div class="form-fields">
                                    <input type="text" name="system.characterGuide.characterDescription.eyes" value="{{source.system.characterGuide.characterDescription.eyes}}" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label>{{localize "DAGGERHEART.Sheets.Class.Guide.Description.Body"}}</label>
                                <div class="form-fields">
                                    <input type="text" name="system.characterGuide.characterDescription.body" value="{{source.system.characterGuide.characterDescription.body}}" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label>{{localize "DAGGERHEART.Sheets.Class.Guide.Description.Color"}}</label>
                                <div class="form-fields">
                                    <input type="text" name="system.characterGuide.characterDescription.color" value="{{source.system.characterGuide.characterDescription.color}}" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label>{{localize "DAGGERHEART.Sheets.Class.Guide.Description.Attitude"}}</label>
                                <div class="form-fields">
                                    <input type="text" name="system.characterGuide.characterDescription.attitude" value="{{source.system.characterGuide.characterDescription.attitude}}" />
                                </div>
                            </div>
                        </div> 
                        <fieldset class="drop-section">
                            <legend class="levelup-legend">
                                {{localize "DAGGERHEART.Sheets.Class.Guide.Extra.Title"}}
                            </legend>

                            <div class="extra-section">
                                <div class="extra-title">{{localize "DAGGERHEART.Sheets.Class.Guide.Extra.Subtitle"}}</div>
                                <input class="extra-input" type="text" name="system.inventory.extra.title" value="{{source.system.inventory.extra.title}}" />
                                <textarea name="system.inventory.extra.description">{{source.system.inventory.extra.description}}</textarea>
                            </div>
                        </fieldset>
                    </div>
                </div>
                <div class="guide-section flexrow flex2">                 
                    <fieldset class="drop-section">
                        <legend>{{localize "DAGGERHEART.Sheets.Class.Guide.BackgroundQuestions.Title"}}</legend>

                        <div class="flex-col-centered">
                            {{#times 3}}
                                <div class="guide-section-title-centered">{{localize "DAGGERHEART.Sheets.Class.Guide.BackgroundQuestions.Question"}} {{add this 1}}</div>
                                <input type="text" name="system.characterGuide.backgroundQuestions.{{this}}" value="{{lookup ../source.system.characterGuide.backgroundQuestions this}}" />
                            {{/times}}
                        </div>
                    </fieldset>
                        
                    <fieldset class="drop-section">
                        <legend>
                            {{localize "DAGGERHEART.Sheets.Class.Guide.Connections.Title"}}
                        </legend>

                        <div class="flex-col-centered">
                            {{#times 3}}
                                <div class="guide-section-title-centered">{{localize "DAGGERHEART.Sheets.Class.Guide.Connections.Question"}} {{add this 1}}</div>
                                <input type="text" name="system.characterGuide.connections.{{this}}" value="{{lookup ../source.system.characterGuide.connections this}}" />
                            {{/times}}
                        </div>
                    </fieldset>
                </div>
            </div>
        </div>
    </section> 
</div>