foundry/Data/systems/pf2e/templates/actors/familiar-sheet.hbs

<form class="{{cssClass}}" autocomplete="off" spellcheck="false">
    <!-- HEADER -->
    <header class="familiar-sheet-header">
        <div class="image-container">
            <img class="actor-image" src="{{actor.img}}" data-edit="img" title="{{actor.name}}" />
            <a class="hover-icon" data-action="show-image"><i class="fa-solid fa-image fa-fw"></i></a>
        </div>

        <div class="header-content">
            <div class="charname">
                <input class=" charname-value" name="name" type="text" value="{{actor.name}}"
                    placeholder="{{localize "PF2E.NPC.Familiar"}}" spellcheck="false" />
                <label class="familiar-title">{{localize "TYPES.Actor.familiar"}}</label>
                {{#if data.master.id}}
                    <label class="familiar-title"> {{data.details.level.value}}</label>
                {{/if}}
            </div>
            <div class="sub-header">
                <div class="traits">
                    {{#each traits as |trait|}}
                        <span data-trait="{{trait.value}}" title="{{trait.description}}">{{localize trait.label}}</span>
                    {{/each}}
                    <span title="{{localize "PF2E.Size"}}">{{localize size}}</span>
                </div>
                <div>
                    <label for="{{actor._id}}-master"><strong>{{localize "PF2E.Familiar.Master"}}</strong></label>
                    <select id="{{actor._id}}-master" name="system.master.id">
                        {{#select master.id}}
                            <option value="">{{localize "PF2E.Familiar.SelectMaster"}}</option>
                            {{#each masters as |eligible idx|}}
                                <option value="{{eligible.id}}">{{eligible.name}}</option>
                            {{/each}}
                        {{/select}}
                    </select>
                </div>
            </div>
            <section class="details-section">
                <div class="hp-section">
                    <div class="label">
                        <i class="fa-solid fa-heart"></i>
                        <h4>{{localize "PF2E.HitPointsHeader"}}</h4>
                    </div>
                    <div class="value">
                        <input class="current-hp" id="{{actor._id}}-hit-points" type="number"
                            name="system.attributes.hp.value" value="{{data.attributes.hp.value}}" class="current-hp"
                            data-dtype="Number" />
                        <div>/ </div>
                        <div class="total-hp" title="{{data.attributes.hp.breakdown}}">{{data.attributes.hp.max}}</div>
                        <div class="temp-hp">
                            (+<input name="system.attributes.hp.temp" type="number" value="{{data.attributes.hp.temp}}" placeholder="0" />)
                        </div>
                    </div>
                    <div class="label">
                        <i class="fa-solid fa-heart-broken"></i>
                        <h4>{{localize "PF2E.condition.dying.name"}}</h4>
                    </div>
                    <div class="value dying-section">
                        {{#if data.attributes.dying.value}}
                            <a class="rollable roll-icon" data-action="recovery-check" title="{{localize "PF2E.Check.Specific.Recovery"}}">
                                <i class="fa-solid fa-dice-d20"></i>
                            </a>
                        {{/if}}
                        <a class="dots dying" title="{{localize "PF2E.condition.dying.summary"}}">
                            <span class="pips">{{> "systems/pf2e/templates/actors/partials/dying-pips.hbs"}}</span>
                        </a>
                    </div>
                </div>
                <div class="defenses-section">
                    {{#if data.master.id}}
                        <div class="defenses-list">
                            <div class="ac" title="{{data.attributes.ac.breakdown}}">
                                <div class="name">{{localize "PF2E.ArmorClassShortLabel"}}</div>
                                <div class="value"><i class="fa-solid fa-shield-alt"></i>{{numberFormat data.attributes.ac.value decimals=0 sign=false}}</div>
                            </div>
                            {{#each data.saves as |save|}}
                                <a class="saves save-name rollable" title="{{save.breakdown}}" data-save="{{save.slug}}">
                                    <div class="name">{{localize save.label}}</div>
                                    <div class="value">{{numberFormat save.value decimals=0 sign=true}}</div>
                                </a>
                            {{/each}}
                        </div>
                    {{/if}}
                </div>
            </section>
        </div>
    </header>
    <hr>
    <div class="main-section">
        <div class="skill-sidebar">
            <!-- SKILLS -->
            <div class="section-container">
                <div class="section-header">
                    <h4>{{localize "PF2E.Familiar.Skills"}}</h4>
                </div>
                <div class="section-body">
                    <div class="skills-content">
                        {{#if data.master.id}}
                            <div class="skills-list">
                                <div class="skill-name rollable perception" title="{{data.attributes.perception.breakdown}}" data-action="perception-check">
                                    <div class="score">{{numberFormat data.attributes.perception.value decimals=0 sign=true}}</div>
                                    <div class="name">{{localize "PF2E.Familiar.Perception"}}</div>
                                </div>
                            </div>
                            <div class="skills-list">
                                {{#each skills as |skill|}}
                                    <div class="skill-name rollable" title="{{skill.breakdown}}" data-skill="{{skill.slug}}">
                                        <div class="score">{{numberFormat skill.value decimals=0 sign=true}}</div>
                                        <div class="name">{{skill.label}}</div>
                                    </div>
                                {{/each}}
                            </div>
                            <div class="rollable skills-attack" title="{{data.attack.breakdown}}" data-attack-roll="">
                                <strong>{{localize "PF2E.Familiar.AttackRoll"}}</strong>
                                <span>{{numberFormat data.attack.value decimals=0 sign=true}}</span>
                            </div>
                        {{/if}}
                    </div>
                </div>
            </div>
        </div>
        <div class="main-container">
            <!-- FAMILIAR -->
            <div class="familiar-section section-container">
                <div class="section-header">
                    <h4>{{localize "PF2E.Familiar.Familiar"}}</h4>
                </div>
                <div class="section-body">
                    <div class="familiar-content">
                        <!-- Species Name -->
                        <div class="familiar-species">
                            <div class="detail">
                                <div class="detail-label" for="{{actor._id}}-species">{{localize "PF2E.Familiar.CreatureType"}}</div>
                                <input id="{{actor._id}}-species" type="text" name="system.details.creature.value"
                                    value="{{data.details.creature.value}}" placeholder="Rat, imp, leshy, etc." />
                            </div>
                        </div>
                        <!-- Master Ability Modifier -->
                        {{#if data.master.id}}
                            <div class="familiar-modifier">
                                <div class="detail">
                                    <div class="detail-label">{{localize "PF2E.Familiar.MasterSpellcastingAbility"}}</div>
                                    <select id="{{actor._id}}-spellcasting-ability" name="system.master.ability">
                                        {{#select data.master.ability}}
                                            {{#each abilities as |ability abbr|}}
                                                <option value="{{abbr}}">{{localize ability}}</option>
                                            {{/each}}
                                        {{/select}}
                                    </select>
                                </div>
                            </div>
                        {{/if}}
                    </div>
                    {{#if data.master.id}}
                        <div class="familiar-content">
                            <div class="detail">
                                <div class="detail-label">{{localize "PF2E.Familiar.TotalNumberFamiliarAbilities"}}</div>
                                <div>
                                    <h4>{{numberFormat familiarAbilities.value decimals=0}}</h4>
                                </div>
                            </div>
                        </div>
                        <div class="familiar-content">
                            <!-- Speed -->
                            <div class="familiar-senses">
                                <div class="detail">
                                    <div class="detail-label">{{localize "PF2E.Speed"}}</div>
                                    <ol class="tags speeds">
                                        {{#with data.attributes.speed as |landSpeed|}}
                                            <li class="tag tag_alt" title="{{landSpeed.breakdown}}">{{localize landSpeed.label}}
                                                ({{landSpeed.total}})</li>
                                        {{/with}}
                                        {{#each data.attributes.speed.otherSpeeds as |speed k|}}
                                            <li class="tag tag_alt {{k}}" title="{{speed.breakdown}}">
                                                {{localize speed.label}} ({{speed.total}})
                                            </li>
                                        {{/each}}
                                    </ol>
                                </div>
                            </div>
                            <!-- Senses -->
                            <div class="familiar-senses">
                                <div class="detail">
                                    <div class="detail-label">{{localize "PF2E.Senses"}}</div>
                                    <ol class="tags senses">
                                        {{#each data.traits.senses as |sense k|}}
                                            <li class="tag tag_alt {{k}}">
                                                {{localize sense.label}}
                                            </li>
                                        {{/each}}
                                    </ol>
                                </div>
                            </div>
                        </div>
                    {{/if}}
                </div>
            </div>

            <!-- ABILITIES -->
            <div class="section-container">
                <div class="section-header">
                    <h4>{{localize "PF2E.Familiar.AbilitiesLabel"}}</h4>
                    <div class="controls">
                        <a class="action-browse" data-action-category="familiar"><i class="fa-solid fa-search"></i> {{localize "PF2E.BrowseLabel"}}</a>
                    </div>
                </div>
                <div class="section-body">
                    <ol class="actions-list item-list">
                        {{#each familiarAbilities.items as |action|}}
                            {{> "systems/pf2e/templates/actors/npc/partials/action.hbs" action=action isEditable=../options.editable}}
                        {{/each}}
                    </ol>
                </div>
            </div>

            <!-- CONDITIONS -->
            {{#if document.itemTypes.condition}}
                <div class="section-container">
                    <div class="section-header">
                        <h4>{{localize "PF2E.ConditionsLabel"}}</h4>
                    </div>
                    <div class="section-body">
                        <ol class="effects-list item-list">
                            {{> "systems/pf2e/templates/actors/partials/effects.hbs" effects=document.conditions.active}}
                        </ol>
                    </div>
                </div>
            {{/if}}
            <!-- EFFECTS -->
            {{#if document.itemTypes.effect}}
                <div class="section-container">
                    <div class="section-header">
                        <h4>{{localize "PF2E.EffectsLabel"}}</h4>
                    </div>
                    <div class="section-body">
                        <ol class="effects-list item-list">
                            {{> "systems/pf2e/templates/actors/partials/effects.hbs" effects=document.itemTypes.effect}}
                        </ol>
                    </div>
                </div>
            {{/if}}
        </div>
    </div>
</form>