foundry-Slamother/templates/actor/actor-sheet.html

<form class="{{cssClass}} flexcol" autocomplete="off">

  {{!-- Sheet Header --}}
  <header class="char-header header-grid">

    <div class="header-fields header-grid">
      {{!-- The grid classes are defined in scss/global/_grid.scss. To use,
            use both the "grid" and "grid-Ncol" class where "N" can be any number
            from 1 to 12 and will create that number of columns.  --}}
      {{!-- The grid classes are defined in scss/global/_grid.scss. To use,
          use both the "grid" and "grid-Ncol" class where "N" can be any number
          from 1 to 12 and will create that number of columns.  --}}

      <div class="header">
        <!-- <img class="moshlogo" src="https://images.squarespace-cdn.com/content/5e97675644a24d569352fe17/1587070346832-RKM533ZN7XN778HQEBUW/Mothership-M-Logo-White.png?content-type=image%2Fpng" data-i18n-title="Mothership Logo" title="[Mothership Logo]"> -->
        <img class="moshlogo" src="{{img}}" data-edit="img" title="{{name}}" height="150"
          width="150" />

        <div class="headergrid">
          <!-- <img class="profile-img" src="{{actor.img}}" data-edit="img" title="{{actor.name}}" height="150" width="150"/> -->

          <!-- PLAYER NAME -->
          <div class="headernamegrid">
            <div class="headerinputtext">NAME</div>
            <div class="headerinputfield charname"><input name="name" class="noborder" type="text"
                value="{{name}}" placeholder="Name" /></div>
          </div>
          <div class="">
            <div class="headerinputtext">Credits</div>
            <div class="headerinputfield charname"><input name="data.credits.value" class="noborder" type="text"
              value="{{data.credits.value}}" placeholder="" /></div>
          </div>

          <!-- CLASS -->
          <div class="">
            <div class="headerinputtext">CLASS</div>
            <div class="headerinputfield charname"><input name="data.class.value" class="noborder" type="text"
                value="{{data.class.value}}" placeholder="" /></div>
          </div>

          <!-- RANK -->
          <div class="">
            <div class="headerinputtext">RANK</div>
            <div class="headerinputfield charname"><input name="data.rank.value" class="noborder" type="text"
                value="{{data.rank.value}}" placeholder="" /></div>
          </div>

          <!-- XP -->
          <div class="">
            <div class="headerinputtext">XP</div>
            <div class="headerinputfield charname"><input name="data.xp.value" class="noborder" type="text"
                value="{{data.xp.value}}" placeholder="" /></div>
          </div>

          <!-- LEVEL -->
          <div class="">
            <div class="headerinputtext">LEVEL</div>
            <div class="headerinputfield charname"><input name="data.attributes.level.value" class="noborder"
                type="text" value="{{data.attributes.level.value}}" placeholder="" /></div>
          </div>

        </div>
      </div>

      <div class="health grid grid-1col" style="margin-top: 0;">
        <div class="grid">
          <!-- Health -->
          <div class="resource healthspread minmaxtopstat">
            <label for="data.health.value" class="resource-label minmaxtext">Health</label>

            <div class="minmaxwrapper">
              <input class="maxhealth-input darkGreyText" type="text" name="data.health.value" value="{{data.health.value}}"
                data-dtype="Number" />
              <div class="slant"></div>
              <input class="maxhealth-input darkGreyText" type="text" name="data.health.max"
                value="{{data.health.max}}" data-dtype="Number" />
            </div>

            <div class="healthmaxtext">Current</div>
            <div class="healthmaxtext">Maximum</div>
          </div>

          <!-- Hits -->
          <div class="resource healthspread minmaxtopstat">
            <label for="data.hits.value" class="resource-label minmaxtext">Hits</label>

            <div class="minmaxwrapper">
              <input class="maxhealth-input darkGreyText" type="text" name="data.hits.value" value="{{data.hits.value}}"
                data-dtype="Number" />
              <div class="slant"></div>
              <input class="maxhealth-input darkGreyText" type="text" name="data.hits.max"
                value="{{data.hits.max}}" data-dtype="Number" />
            </div>

            <div class="healthmaxtext">Current</div>
            <div class="healthmaxtext">Maximum</div>
          </div>

          {{#if data.settings.useCalm}}
          <!-- Calm -->
          <div class="resource healthspread minmaxtopstat">
            <label for="data.other.stress.value" class="resource-label minmaxtext rollable calm-roll">Calm</label>

            <div class="minmaxwrapper">
              <input class="maxhealth-input darkGreyText" type="text" name="data.other.stress.value" value="{{data.other.stress.value}}"
                data-dtype="Number" />
              <div class="slant" style="transform: skewX(0deg);"></div>
              <input class="maxhealth-input darkGreyText" type="text" name="data.other.stress.min"
                value="{{data.other.stress.min}}" data-dtype="Number" />
            </div>

            <div class="healthmaxtext">Current</div>
            <div class="healthmaxtext">Maximum</div>
          </div>
          {{else}}
          <!-- Stress -->
          <div class="resource healthspread minmaxtopstat">
            <label for="data.other.stress.value" class="resource-label minmaxtext rollable stress-roll">Stress</label>

            <div class="minmaxwrapper">
              <input class="maxhealth-input darkGreyText" type="text" name="data.other.stress.value" value="{{data.other.stress.value}}"
                data-dtype="Number" />
              <div class="slant" style="transform: skewX(0deg);"></div>
              <input class="maxhealth-input darkGreyText" type="text" name="data.other.stress.min"
                value="{{data.other.stress.min}}" data-dtype="Number" />
            </div>

            <div class="healthmaxtext">Current</div>
            <div class="healthmaxtext">Minimum</div>
          </div>
          {{/if}}

          <!-- Resolve -->
          <div class="resource healthspread minmaxtopstat">
            <label for="data.other.stress.value" class="resource-label minmaxtext">Resolve</label>

            <div class="valuewrapper">
              <input class="maxhealth-input darkGreyText" type="text" name="data.other.resolve.value" value="{{data.other.resolve.value}}"
                data-dtype="Number" />
            </div>
          </div>

        </div>

        <!-- CLASS -->
        <div class="" style="margin-left: 17px; margin-right: 13px;">
          <div class="resource-label">STRESS & PANIC</div>
          <textarea name="data.stressdesc.value" rows="2" class="textarea-input" type="text"
            data-target="data.stressdesc.value" placeholder="">{{data.stressdesc.value}}</textarea>
        </div>


      </div>

      <div class="abilities">
        <!-- <div class="grid grid-2col"> -->
          <!-- STRESS -->
          <!-- <div class="resource mainstat">
            <div class="stresslabel">
              <div class="ability-mod stresstext">STRESS</div>
            </div>
            <input class="smallcircle-input" type="text" name="data.other.stress.value"
              value="{{data.other.stress.value}}" data-dtype="Number" />
          </div> -->

          <!-- RESOLVE -->
          <!-- <div class="resource mainstat">
            <div class="stresslabel">
              <div class="ability-mod stresstext">RESOLVE</div>
            </div>
            <input class="smallcircle-input" type="text" name="data.other.resolve.value"
              value="{{data.other.resolve.value}}" data-dtype="Number" />
          </div> -->
        <!-- </div> -->

        <div class="grid grid-1col widegap">
          <!-- Strength -->
          <div class="mainstatwrapper">
            <div class="resource mainstat">
              <div class="mainstatlabel">
                <span class="ability-mod stat-roll rollable mainstattext" data-key="strength"
                  data-label="Strength">STRENGTH</span>
              </div>
              <input class="circle-input" type="text" name="data.stats.strength.value"
                value="{{data.stats.strength.value}}" data-dtype="Number" />
            </div>
            <input class="mainstatmod-input" type="text" name="data.stats.strength.mod"
              value="{{data.stats.strength.mod}}" data-dtype="Number" />
            <div class="mainstatmod-title">mod</div>
          </div>

          <!-- Speed -->
          <div class="mainstatwrapper">
            <div class="resource mainstat">
              <div class="mainstatlabel">
                <span class="ability-mod stat-roll rollable mainstattext" data-key="speed" data-roll="d100"
                  data-label="Speed">SPEED</span>
              </div>
              <input class="circle-input" type="text" name="data.stats.speed.value" value="{{data.stats.speed.value}}"
                data-dtype="Number" />
            </div>
            <input class="mainstatmod-input" type="text" name="data.stats.speed.mod" value="{{data.stats.speed.mod}}"
              data-dtype="Number" />
            <div class="mainstatmod-title">mod</div>
          </div>

          <!-- Intellect -->
          <div class="mainstatwrapper">
            <div class="resource mainstat">
              <div class="mainstatlabel">
                <span class="ability-mod stat-roll rollable mainstattext" data-key="intellect" data-roll="d100"
                  data-label="Intellect">INTELLECT</span>
              </div>
              <input class="circle-input" type="text" name="data.stats.intellect.value"
                value="{{data.stats.intellect.value}}" data-dtype="Number" />
            </div>
            <input class="mainstatmod-input" type="text" name="data.stats.intellect.mod"
              value="{{data.stats.intellect.mod}}" data-dtype="Number" />
            <div class="mainstatmod-title">mod</div>
          </div>

          <!-- Combat -->
          <div class="mainstatwrapper">
            <div class="resource mainstat">
              <div class="mainstatlabel">
                <span class="ability-mod stat-roll rollable mainstattext" data-key="combat" data-roll="d100"
                  data-label="Combat">COMBAT</span>
              </div>
              <input class="circle-input" type="text" name="data.stats.combat.value" value="{{data.stats.combat.value}}"
                data-dtype="Number" />
            </div>
            <input class="mainstatmod-input" type="text" name="data.stats.combat.mod" value="{{data.stats.combat.mod}}"
              data-dtype="Number" />
            <div class="mainstatmod-title">mod</div>
          </div>
        </div>
      </div>
      <!-- SAVES -->
      <div class="saves grid grid-1col savebackground">
        <!-- Sanity -->
        <div class="resource flex-group-center">
          <span class="ability-mod stat-roll rollable savetext" data-roll="d100" data-label="Sanity" data-key="sanity"
            data-target="{{data.stats.sanity.value}}">SANITY</span>
          <input class="square-input" type="text" name="data.stats.sanity.value" value="{{data.stats.sanity.value}}"
            data-dtype="Number" />
        </div>
        <!-- Fear -->
        <div class="resource flex-group-center">
          <span class="ability-mod stat-roll rollable savetext" data-roll="d100" data-key="fear"
            data-target="{{data.stats.fear.value}}" data-label="Fear">FEAR</span>
          <input class="square-input" type="text" name="data.stats.fear.value" value="{{data.stats.fear.value}}"
            data-dtype="Number" />
        </div>
        <!-- Body -->
        <div class="resource flex-group-center">
          <span class="ability-mod stat-roll rollable savetext" data-roll="d100" data-key="body"
            data-target="{{data.stats.body.value}}" data-label="Body">BODY</span>
          <input class="square-input" type="text" name="data.stats.body.value" value="{{data.stats.body.value}}"
            data-dtype="Number" />
        </div>
        <!-- Armor -->
        <div class="resource flex-group-center">
          <span class="ability-mod stat-roll rollable savetext" data-roll="d100" data-key="armor"
            data-target="{{data.stats.armor.value}}" data-label="Armor">ARMOR</span>
          <input class="square-input" type="text" name="data.stats.armor.value" value="{{data.stats.armor.value}}"
            data-dtype="Number" />
        </div>
      </div>

    </div>
  </header>

  {{!-- Sheet Tab Navigation --}}
  <nav class="mosh sheet-tabs tabs" data-group="primary">
    <a class="tab-select" data-tab="skills">Skills</a>
    <a class="tab-select" data-tab="weapons">Weapons</a>
    <a class="tab-select" data-tab="items">Items</a>
    <a class="tab-select" data-tab="description">Bio</a>
    <a class="tab-select" data-tab="notes">Notes</a>

  </nav>

  {{!-- Sheet Body --}}
  <section class="sheet-body">

    {{!-- Biography Tab --}}
    <div class="tab biography" data-group="primary" data-tab="description">
      {{editor content=data.biography target="data.biography" button=true owner=owner editable=editable}}
    </div>
    {{!-- Notes Tab --}}
    <div class="tab biography" data-group="primary" data-tab="notes">
      {{editor content=data.notes target="data.notes" button=true owner=owner editable=editable}}
    </div>
    {{!-- Owned Items Tab --}}
    <div class="tab items" data-group="primary" data-tab="items">
      <!-- ARMOR -->
      <ol class="items-list">
        <li class="item flexrow item-header">
          <div class="item-image"></div>
          <div class="skill-stat">Armor Name</div>
          <div class="skill-stat" style="flex-grow: 0.5;">Save Bonus</div>
          <div class="skill-stat">Features</div>
          <div class="skill-stat" style="flex-grow: 0.5;">Equipped</div>
          <div class="item-controls">
            <a class="item-control item-create" title="Create Armor" data-type="armor"><i class="fas fa-plus"></i> Add
              Armor</a>
          </div>
        </li>
        {{#each armors as |armor id|}}
        <li class="item flexrow dropitem" data-item-id="{{armor._id}}">
          <div class="item-image"><img src="{{armor.img}}" title="{{armor.name}}" width="24" height="24" /></div>
          <h4 class="skill-name list-roll description-roll">{{armor.name}}</h4>
          <div class="skill-stat" style="flex-grow: 0.5;">{{armor.data.bonus}}%</div>
          <div class="skill-stat">{{armor.data.features}}</div>
          <div class="skill-stat item-equip" style="flex-grow: 0.5;"><input type="checkbox" name="armor.data.equipped" data-dtype="Boolean"
              {{checked armor.data.equipped}} /></div>
          <div class="item-controls">
            <a class="item-control item-edit" title="Edit Armor"><i class="fas fa-edit"></i></a>
            <a class="item-control item-delete" title="Delete Armor"><i class="fas fa-trash"></i></a>
          </div>
        </li>
        {{/each}}
      </ol>
      <!-- ITEMS -->
      <ol class="items-list">
        <li class="item flexrow item-header">
          <div class="item-image"></div>
          <div class="skill-stat" style="flex-grow: 1.5;">Item Name</div>
          <div class="skill-stat">Quantity</div>
          {{#if data.settings.hideWeight}}
          {{else}}
          <div class="skill-stat">Weight</div>
          {{/if}}
          <div class="skill-stat">Value</div>
          <div class="item-controls">
            <a class="item-control item-create" title="Create Item" data-type="item"><i class="fas fa-plus"></i> Add
              Item</a>
          </div>
        </li>
        {{#if data.settings.hideWeight}}
          {{#each gear as |item id|}}
          <li class="item flexrow dropitem" data-item-id="{{item._id}}">
            <div class="item-image"><img src="{{item.img}}" title="{{item.name}}" width="24" height="24" /></div>
            <h4 class="skill-name list-roll description-roll" style="flex-grow: 1.5;">{{item.name}}</h4>
            <div class="skill-stat list-roll item-quantity">{{item.data.quantity}}</div>
            <div class="skill-stat">{{item.data.cost}}</div>
            <div class="item-controls">
              <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
              <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
            </div>
          </li>
          {{/each}}
        {{else}}
          {{#each gear as |item id|}}
          <li class="item flexrow dropitem" data-item-id="{{item._id}}">
            <div class="item-image"><img src="{{item.img}}" title="{{item.name}}" width="24" height="24" /></div>
            <h4 class="skill-name list-roll description-roll" style="flex-grow: 1.5;">{{item.name}}</h4>
            <div class="skill-stat list-roll item-quantity">{{item.data.quantity}}</div>
            <div class="skill-stat">{{item.data.weight}}</div>
            <div class="skill-stat">{{item.data.cost}}</div>
            <div class="item-controls">
              <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
              <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
            </div>
          </li>
          {{/each}}
        {{/if}}
      </ol>
      {{#unless data.settings.hideWeight}}
      <div class="item flex-group-left item-header">
        <div class="skill-stat" style="flex-grow: 1.5;">Carrying Capacity: {{data.weight.capacity}}</div>
        <div class="skill-stat">Current Weight: {{data.weight.current}}</div>
      </div>
      {{/unless}}

    </div>
    {{!-- Owned Skills Tab --}}
    <div class="tab items" data-group="primary" data-tab="skills">
      <!-- SKILLS -->
      <ol class="items-list">
        <li class="item flexrow item-header">
          <div class="skill-stat">Skill Name</div>
          <div class="skill-stat">Skill Rank</div>
          <div class="skill-stat">Skill Bonus</div>

          <div class="item-controls">
            <a class="item-control skill-create" title="Create Skill" data-type="skill"><i class="fas fa-plus"></i> Add
              Skill</a>
          </div>
        </li>
        {{#each skills as |skill id|}}
        <li class="item flexrow dropitem" data-item-id="{{skill._id}}">
          <!-- <div class="item-image"><img src="{{skill.img}}" title="{{skill.name}}" width="24" height="24"/></div> -->
          <div class="skill-name skill-roll list-roll">{{skill.name}}</div>
          <div class="skill-stat">{{skill.data.rank}}</div>
          <div class="skill-stat">{{skill.data.bonus}}</div>
          <div class="item-controls">
            <a class="item-control skill-edit" title="Edit Skill"><i class="fas fa-edit"></i></a>
            <a class="item-control item-delete" title="Delete Skill"><i class="fas fa-trash"></i></a>
          </div>
        </li>
        {{/each}}
      </ol>
    </div>
    {{!-- Owned Weapons Tab --}}
    <div class="tab items" data-group="primary" data-tab="weapons">
      <!-- WEAPONS -->
      <ol class="items-list">
        <li class="item flexrow item-header">
          <div class="item-image"></div>
          <div class="skill-stat" style="flex-grow: 2;">Weapon Name</div>
          <div class="skill-stat">Damage</div>
          <div class="skill-stat">Ammo</div>
          <div class="skill-stat">Shots</div>
          <div class="skill-stat">S/M/L</div>
          <div class="item-controls">
            <a class="item-control weapon-create" title="Create Weapon" data-type="weapon"><i class="fas fa-plus"></i>
              Add</a>
          </div>
        </li>
        {{#each weapons as |weapon id|}}
        <li class="item flexrow dropitem" data-item-id="{{weapon._id}}">
          <!-- <div class="item-image"><img src="{{skill.img}}" title="{{skill.name}}" width="24" height="24"/></div> -->
          <div class="item-image"><img src="{{weapon.img}}" title="{{weapon.name}}" width="24" height="24" /></div>
          <div class="skill-name weapon-roll list-roll" style="flex-grow: 2;">{{weapon.name}}</div>
          <div class="skill-stat">{{weapon.data.damage}}</div>
          {{#if weapon.data.useAmmo}}
          <div class="skill-stat weapon-ammo list-roll">{{weapon.data.ammo}}</div>
          {{else}}
          <div class="skill-stat">N/A</div>
          {{/if}}
          {{#if weapon.data.shots}}
          <div class="skill-stat">{{weapon.data.curShots}}/{{weapon.data.shots}} <i
              class="fas fa-sync weapon-reload list-roll"></i></div>
          {{else}}
          <div class="skill-stat">N/A</div>
          {{/if}}
          {{#if weapon.data.ranges.medium}}
          <div class="skill-stat">{{weapon.data.ranges.short}}/{{weapon.data.ranges.medium}}/{{weapon.data.ranges.long}}
          </div>
          {{else}}
          <div class="skill-stat">CQC</div>
          {{/if}}
          <div class="item-controls">
            <a class="item-control weapon-edit" title="Edit Weapon"><i class="fas fa-edit"></i></a>
            <a class="item-control item-delete" title="Delete Weapon"><i class="fas fa-trash"></i></a>
          </div>
        </li>
        {{/each}}
      </ol>
    </div>
  </section>
</form>