daggerheart/templates/sheets/actors/character/header.hbs

<header class="character-header-sheet">
    <line-div></line-div>
    <div class="name-row">
        <h1 class='actor-name'>
            <input
                type='text'
                name='name'
                value='{{document.name}}'
                placeholder='Actor Name'
            />
        </h1>

        <div class='level-div'>
            <h3 class='label'>
                {{#if (or document.system.needsCharacterSetup document.system.levelData.canLevelUp)}}
                    <button
                        type="button"
                        class="level-button glow" data-tooltip="{{#if document.system.needsCharacterSetup}}{{localize "DAGGERHEART.APPLICATIONS.CharacterCreation.buttonTitle"}}{{else}}{{localize "DAGGERHEART.ACTORS.Character.levelUp"}}{{/if}}"
                        data-action="levelManagement"
                    >
                        <i class="fa-solid fa-angles-up"></i>
                    </button>
                {{/if}}
                {{localize 'DAGGERHEART.GENERAL.level'}}
                <input type="text" data-dtype="Number" class="level-value" value={{#if document.system.needsCharacterSetup}}0{{else}}{{document.system.levelData.level.changed}}{{/if}} {{#if document.system.needsCharacterSetup}}disabled{{/if}} />
            </h3>
        </div>
    </div>
    <div class="character-details">
        <div>
            {{#if document.system.class.value}}
                <span data-action="editDoc" data-item-uuid="{{document.system.class.value.uuid}}">{{document.system.class.value.name}}</span>
            {{else}}
                <span class="missing-header-feature" data-action="openPack" data-key="classes">{{localize 'TYPES.Item.class'}}</span>
            {{/if}}
            <span class="dot">•</span>
            {{#if document.system.class.subclass}}
                <span data-action="editDoc" data-item-uuid="{{document.system.class.subclass.uuid}}">{{document.system.class.subclass.name}}</span>
            {{else}}
                <span class="missing-header-feature" data-action="openPack" data-key="subclasses">{{localize 'TYPES.Item.subclass'}}</span>
            {{/if}}
            <span class="dot">•</span>
            {{#if document.system.community}}
                <span data-action="editDoc" data-item-uuid="{{document.system.community.uuid}}">{{document.system.community.name}}</span>
            {{else}}
                <span class="missing-header-feature" data-action="openPack" data-key="communities">{{localize 'TYPES.Item.community'}}</span>
            {{/if}}
            <span class="dot">•</span>
            {{#if document.system.ancestry}}
                <span data-action="editDoc" data-item-uuid="{{document.system.ancestry.uuid}}">{{document.system.ancestry.name}}</span>
            {{else}}
                <span class="missing-header-feature" data-action="openPack" data-key="ancestries">{{localize 'TYPES.Item.ancestry'}}</span>
            {{/if}}
        </div>

        {{#if document.system.multiclass.value}}
            <div class="multiclass">
                {{#if document.system.multiclass.value}}
                    <span data-action="editDoc"data-item-uuid="{{document.system.multiclass.value.uuid}}">{{document.system.multiclass.value.name}}</span>
                {{else}}
                    <span data-action="openPack" data-key="classes">{{localize 'DAGGERHEART.GENERAL.multiclass'}}</span>
                {{/if}}
                <span class="dot">•</span>
                {{#if document.system.multiclass.subclass}}
                    <span data-action="editDoc" data-item-uuid="{{document.system.multiclass.subclass.uuid}}">{{document.system.multiclass.subclass.name}}</span>
                {{else}}
                    <span class="missing-header-feature" data-action="openPack" data-key="subclasses">{{localize 'TYPES.Item.subclass'}}</span>
                {{/if}}
            </div>
        {{/if}}


    </div>

    <div class="character-row">
        <div class="hope-section">
            <h4>{{localize "DAGGERHEART.GENERAL.hope"}}</h4>
            {{#times document.system.resources.hope.max}}
                <span class='hope-value' data-action='toggleHope' data-value="{{add this 1}}">
                    {{#if (gte ../document.system.resources.hope.value (add this 1))}}
                        <i class='fa-solid fa-diamond'></i>
                    {{else}}
                        <i class='fa-regular fa-circle'></i>
                    {{/if}}
                </span>
            {{/times}}
        </div>
        {{#if document.system.class.value}}
            <div class="domains-section">
                {{#each document.system.domainData as |data|}}
                    <div class="domain">
                        <img src="{{data.src}}" alt="" data-tooltip="{{data.label}}" />
                    </div>
                {{/each}}
            </div>
        {{/if}}
        <div class="downtime-section">
            <button type="button" data-action="useDowntime" data-type="shortRest" data-tooltip="{{localize "DAGGERHEART.APPLICATIONS.Downtime.shortRest.title"}}">
                <i class="fa-solid fa-utensils"></i>
            </button>
            <button type="button" data-action="useDowntime" data-type="longRest" data-tooltip="{{localize "DAGGERHEART.APPLICATIONS.Downtime.longRest.title"}}">
                <i class="fa-solid fa-bed"></i>
            </button>
        </div>
    </div>

    <div class="character-traits">
        {{#each this.attributes as |attribute key|}} 
            <div class="trait" data-tooltip="<b>{{localize (concat 'DAGGERHEART.CONFIG.Traits.' key '.name') }}:</b><br>{{#each attribute.verbs}}{{this}}<br>{{/each}}" data-action="rollAttribute" data-attribute="{{key}}" data-value="{{attribute.value}}">
                <div class="trait-name"> 
                    <span>{{localize (concat 'DAGGERHEART.CONFIG.Traits.' key '.short')}}</span>
                    {{#if attribute.tierMarked}}
                        <i class='fa-solid fa-circle'></i>
                    {{else}}
                        <i class='fa-regular fa-circle'></i>
                    {{/if}}
                </div>
                <div class="trait-value">
                    {{#if (gt attribute.value 0)}}
                        <span>+{{attribute.value}}</span>
                    {{else}}
                        <span>{{attribute.value}}</span>
                    {{/if}}
                </div>
            </div>
        {{/each}}
    </div>

    {{#> 'systems/daggerheart/templates/sheets/global/tabs/tab-navigation.hbs' showSettings=showSettings }}
        {{#if ../showSettings}}
            <button type="button" data-action="openSettings" data-tooltip-text="{{localize "DAGGERHEART.UI.Tooltip.openSheetSettings"}}"><i class="fa-solid fa-wrench"></i></button>
        {{/if}}
    {{/'systems/daggerheart/templates/sheets/global/tabs/tab-navigation.hbs'}}
</header>