roll20-character-sheets/5eShaped/precompiled/components/npc/abilities.html

<div class="shaped-row">
  <div class="col-16 center pad-r-sm">
    <button type="roll" name="roll_shaped_strength_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=<span data-i18n=STRENGTH>Strength</span> <span data-i18n=CHECK class=lowercase>Check</span>}} @{roll_info} {{roll1=[[@{shaped_d20} + @{strength_check_mod_formula}]]}} @{roll_setting} + @{strength_check_mod_formula}]]}} @{attacher_strength_check}" tabindex="-1">
      <div class="heading uppercase center" data-i18n="STR"></div>
      <div class="presentation mar-t-sm">
        <span name="attr_strength" class="center"></span>
        (<span name="attr_strength_mod_with_sign" class="center"></span>)
      </div>
    </button>
    <input type="hidden" name="attr_strength_mod">
    <div class="shaped-row center edit no-wrap">
      <div>
        <input type="number" name="attr_strength" class="no-border no-spin" accept="STR">
      </div>
      <div>+</div>
      <div>
        <input type="number" name="attr_strength_bonus" class="edit no-spin no-border" value="0" step="1">
      </div>
      <div>
        (<span name="attr_strength_mod_with_sign" class="center"></span>)
      </div>
    </div>
    <div class="edit shaped-row no-wrap vert-center small-label">
      <span data-i18n="CHECK"></span>
      <div>+</div>
      <div>
        <input type="number" name="attr_strength_check_bonus" class="no-spin no-border" value="0" step="1">
      </div>
      <div>=</div>
      <span class="mar-l-sm" name="attr_strength_check_mod"></span>
    </div>
  </div>
  <div class="col-16 center pad-l-sm pad-r-sm">
    <button type="roll" name="roll_shaped_dexterity_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=<span data-i18n=DEXTERITY>Dexterity</span> <span data-i18n=CHECK class=lowercase>Check</span>}} @{roll_info} {{roll1=[[@{shaped_d20} + @{dexterity_check_mod_formula}]]}} @{roll_setting} + @{dexterity_check_mod_formula}]]}} @{attacher_dexterity_check}" tabindex="-1">
      <div class="heading uppercase center" data-i18n="DEX"></div>
      <div class="presentation mar-t-sm">
        <span name="attr_dexterity" class="center"></span>
        (<span name="attr_dexterity_mod_with_sign" class="center"></span>)
      </div>
    </button>
    <input type="hidden" name="attr_dexterity_mod">
    <div class="shaped-row center edit no-wrap">
      <div>
        <input type="number" name="attr_dexterity" class="no-border no-spin" accept="DEX">
      </div>
      <div>+</div>
      <div>
        <input type="number" name="attr_dexterity_bonus" class="edit no-spin no-border" value="0" step="1">
      </div>
      <div>
        (<span name="attr_dexterity_mod_with_sign" class="center"></span>)
      </div>
    </div>
    <div class="edit shaped-row no-wrap vert-center small-label">
      <span data-i18n="CHECK"></span>
      <div>+</div>
      <div>
        <input type="number" name="attr_dexterity_check_bonus" class="no-spin no-border" value="0" step="1">
      </div>
      <div>=</div>
      <span class="mar-l-sm" name="attr_dexterity_check_mod"></span>
    </div>
  </div>
  <div class="col-16 center pad-l-sm pad-r-sm">
    <button type="roll" name="roll_shaped_constitution_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=<span data-i18n=CONSTITUTION>Constitution</span> <span data-i18n=CHECK class=lowercase>Check</span>}} @{roll_info} {{roll1=[[@{shaped_d20} + @{constitution_check_mod_formula}]]}} @{roll_setting} + @{constitution_check_mod_formula}]]}} @{attacher_constitution_check}" tabindex="-1">
      <div class="heading uppercase center" data-i18n="CON"></div>
      <div class="presentation mar-t-sm">
        <span name="attr_constitution" class="center"></span>
        (<span name="attr_constitution_mod_with_sign" class="center"></span>)
      </div>
    </button>
    <input type="hidden" name="attr_constitution_mod">
    <div class="shaped-row center edit no-wrap">
      <div>
        <input type="number" name="attr_constitution" class="no-border no-spin" accept="CON">
      </div>
      <div>+</div>
      <div>
        <input type="number" name="attr_constitution_bonus" class="edit no-spin no-border" value="0" step="1">
      </div>
      <div>
        (<span name="attr_constitution_mod_with_sign" class="center"></span>)
      </div>
    </div>
    <div class="edit shaped-row no-wrap vert-center small-label">
      <span data-i18n="CHECK"></span>
      <div>+</div>
      <div>
        <input type="number" name="attr_constitution_check_bonus" class="no-spin no-border" value="0" step="1">
      </div>
      <div>=</div>
      <span class="mar-l-sm" name="attr_constitution_check_mod"></span>
    </div>
  </div>
  <div class="col-16 center pad-l-sm pad-r-sm">
    <button type="roll" name="roll_shaped_intelligence_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=<span data-i18n=INTELLIGENCE>Intelligence</span> <span data-i18n=CHECK class=lowercase>Check</span>}} @{roll_info} {{roll1=[[@{shaped_d20} + @{intelligence_check_mod_formula}]]}} @{roll_setting} + @{intelligence_check_mod_formula}]]}} @{attacher_intelligence_check}" tabindex="-1">
      <div class="heading uppercase center" data-i18n="INT"></div>
      <div class="presentation mar-t-sm">
        <span name="attr_intelligence" class="center"></span>
        (<span name="attr_intelligence_mod_with_sign" class="center"></span>)
      </div>
    </button>
    <input type="hidden" name="attr_intelligence_mod">
    <div class="shaped-row center edit no-wrap">
      <div>
        <input type="number" name="attr_intelligence" class="no-border no-spin" accept="INT">
      </div>
      <div>+</div>
      <div>
        <input type="number" name="attr_intelligence_bonus" class="edit no-spin no-border" value="0" step="1">
      </div>
      <div>
        (<span name="attr_intelligence_mod_with_sign" class="center"></span>)
      </div>
    </div>
    <div class="edit shaped-row no-wrap vert-center small-label">
      <span data-i18n="CHECK"></span>
      <div>+</div>
      <div>
        <input type="number" name="attr_intelligence_check_bonus" class="no-spin no-border" value="0" step="1">
      </div>
      <div>=</div>
      <span class="mar-l-sm" name="attr_intelligence_check_mod"></span>
    </div>
  </div>
  <div class="col-16 center pad-l-sm pad-r-sm">
    <button type="roll" name="roll_shaped_wisdom_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=<span data-i18n=WISDOM>Wisdom</span> <span data-i18n=CHECK class=lowercase>Check</span>}} @{roll_info} {{roll1=[[@{shaped_d20} + @{wisdom_check_mod_formula}]]}} @{roll_setting} + @{wisdom_check_mod_formula}]]}} @{attacher_wisdom_check}" tabindex="-1">
      <div class="heading uppercase center" data-i18n="WIS"></div>
      <div class="presentation mar-t-sm">
        <span name="attr_wisdom" class="center"></span>
        (<span name="attr_wisdom_mod_with_sign" class="center"></span>)
      </div>
    </button>
    <input type="hidden" name="attr_wisdom_mod">
    <div class="shaped-row center edit no-wrap">
      <div>
        <input type="number" name="attr_wisdom" class="no-border no-spin" accept="WIS">
      </div>
      <div>+</div>
      <div>
        <input type="number" name="attr_wisdom_bonus" class="edit no-spin no-border" value="0" step="1">
      </div>
      <div>
        (<span name="attr_wisdom_mod_with_sign" class="center"></span>)
      </div>
    </div>
    <div class="edit shaped-row no-wrap vert-center small-label">
      <span data-i18n="CHECK"></span>
      <div>+</div>
      <div>
        <input type="number" name="attr_wisdom_check_bonus" class="no-spin no-border" value="0" step="1">
      </div>
      <div>=</div>
      <span class="mar-l-sm" name="attr_wisdom_check_mod"></span>
    </div>
  </div>
  <div class="col-16 center pad-l-sm">
    <button type="roll" name="roll_shaped_charisma_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=<span data-i18n=CHARISMA>Charisma</span> <span data-i18n=CHECK class=lowercase>Check</span>}} @{roll_info} {{roll1=[[@{shaped_d20} + @{charisma_check_mod_formula}]]}} @{roll_setting} + @{charisma_check_mod_formula}]]}} @{attacher_charisma_check}" tabindex="-1">
      <div class="heading uppercase center" data-i18n="CHA"></div>
      <div class="presentation mar-t-sm">
        <span name="attr_charisma" class="center"></span>
        (<span name="attr_charisma_mod_with_sign" class="center"></span>)
      </div>
    </button>
    <input type="hidden" name="attr_charisma_mod">
    <div class="shaped-row center edit no-wrap">
      <div>
        <input type="number" name="attr_charisma" class="no-border no-spin" accept="CHA">
      </div>
      <div>+</div>
      <div>
        <input type="number" name="attr_charisma_bonus" class="edit no-spin no-border" value="0" step="1">
      </div>
      <div>
        (<span name="attr_charisma_mod_with_sign" class="center"></span>)
      </div>
    </div>

    <div class="edit shaped-row no-wrap vert-center small-label">
      <span data-i18n="CHECK"></span>
      <div>+</div>
      <div>
        <input type="number" name="attr_charisma_check_bonus" class="no-spin no-border" value="0" step="1">
      </div>
      <div>=</div>
      <span class="mar-l-sm" name="attr_charisma_check_mod"></span>
    </div>
  </div>
</div>