include fields.pug
.tabSheet.pcSheet
  div
    .bio
      +labelledUnderlined('Character Name:'): +input('text', 'character_name')
      +labelledUnderlined('Player Name:'): +input('text', 'player_name')
      +labelledUnderlined('Character Race:'): +input('text', 'race')
      +labelledUnderlined('Level:'): +input('number', 'level')
      +labelledUnderlined('Element of Harmony:'): +select('elementOfHarmony')
        +option('generosity')
        +option('honesty')
        +option('kindness')
        +option('laughter')
        +option('loyalty')
        +option('magic')
        +option('other')
    div(style='display: inline-block; width: 2.2in;')
      .friendshipTokens
        h1
          span F
          span R
          span I
          span E
          span N
          span D
          span S
          span H
          span I
          span P
        +input('number', 'friendshipTokens')(value='0')
      include explodingHooves.pug

  div
    .stamina
      div
        h1 Stamina:
        +fraction('stamina')
      div
        +labelledUnderlined('Damage Reduction:')(style='font-size: 1.5em;  max-width: 2in;'): +input('text', 'damageReduction')(style='width: 2.4in;')
    .traits
      .trait.body
        label.traitName Body
        +rollButton({
          attr: 'Body',
          result: 'body_equation',
          updowngrade: 'body_updowngrade',
          updowngrade_note: 'body_updowngrade_note'
        })
        +selectDice('body')
        +updowngrade("body")
        +input('hidden', 'body_equation')
      .trait.mind 
        label.traitName Mind
        +rollButton({
          attr: 'Mind',
          result: 'mind_equation',
          updowngrade: 'mind_updowngrade',
          updowngrade_note: 'mind_updowngrade_note'
        })
        +selectDice('mind')
        +updowngrade("mind")
        +input('hidden', 'mind_equation')
      .trait.charm
        label.traitName Charm
        +rollButton({
          attr: 'Charm',
          result: 'charm_equation',
          updowngrade: 'charm_updowngrade',
          updowngrade_note: 'charm_updowngrade_note'
        })
        +selectDice('charm')
        +updowngrade("charm")
        +input('hidden', 'charm_equation')

  div
    .talents
      h1 Talents:
      +repeating('talents')
        .talent
          +rollButton({
            attr: '@{' + 'name}',
            result: 'equation',
            notes: 'notes',
            updowngrade: 'updowngrade',
            updowngrade_note: 'updowngrade_note'
          })
          div(style="display: inline-block; vertical-align: top; width: 0.4in;")
            .talentIcon(style='font-size: 3em;')
          div(style="display: inline-block; width: 6.5in;")
            +labelledUnderlined('')(style='width: 2.5in;'): +input('text', 'name')(placeholder='Talent Name')
            +labelledUnderlined('Source:'): +selectTalentSource('source')
            +labelledUnderlined('Dice:'): +selectDice('dice')
            +labelledUnderlined('Trait'): +selectTrait('trait')
            +updowngrade('')
            .notes
              +labelledUnderlined('Notes:'): +input('text', 'notes')
          +input('hidden', 'equation')
  div
    .quirks
      h1 Quirks:
      +repeating('quirks')
        .quirk
          div(style="display: inline-block; vertical-align: top; width: 0.4in;")
            .quirkIcon(style='font-size: 2em;')
          div(style="display: inline-block; width: 6.5in;")
            +labelledUnderlined(''): +input('text', 'name')(placeholder='Quirk Name')
            +labelledUnderlined('Source:'): +selectQuirkSource('source')
            +labelledUnderlined('Notes'): +input('text', 'notes')

  div
    .reputations
      h1 Reputation:
      +repeating('reputations')
        .reputation
          .reputationIcon(style='font-size: 2em;')
          +labelledUnderlined('Faction/Individual'): +input('text', 'name')
          +labelledUnderlined('Level'): +select('level')
            +option('Esteemed (2x upgrade)', 2)
            +option('Friendly (1x upgrade)', 1)
            +option('Neutral', 0, true)
            +option('Unfriendly (1x downgrade)', -1)
            +option('Hostile (2x downgrade)', -2)
          +labelledUnderlined('Notes')(style='width: 3in;'): +input('text', 'notes')
    
  div
    .inlineBlock(style='margin-right: 1em; vertical-align: top; width: 48%;')
      h1 Appearance:
      +textarea('appearance')(style='height: 2in;')
    .inlineBlock(style='width: 48%;')
      h1 Background:
      +textarea('background')(style='height: 2in;')