header#character-header.header.span-all
  img(src="https://s3.amazonaws.com/files.d20.io/images/277217218/yuDLFwlFjVStADz6M5aNLg/original.png" data-i18n-alt="Under the Neighborhood by Kyle Decker" role='heading' aria-level=1).header-image
  if headerType === 'character'
    .sentence.character-type.character-type--character(data-i18n-list='character sentence order')
      +adaptiveInput({name:'character name',type:'text',class:'underlined',role:'heading','aria-level':2}).character-name
      .input-label
        span(data-i18n='sentence the' data-list-item='the')
        +adaptiveInput({name:'playbook',type:'text',class:'underlined',' data-list-item':'playbook','data-i18n-placeholder':'playbook placeholder'})
      .input-label
        span(data-i18n='sentence who' data-list-item='who')
        +adaptiveInput({name:'descriptor',type:'text',class:'underlined',' data-list-item':'descriptor','data-i18n-placeholder':'descriptor placeholder'})
    .character-summary.character-type.character-type--character
      .generic-details.span-all
        each name, index in ['pronouns','age','appearance','homeworld','want']
          - const divObj = {};
          if index > 1
            - divObj.class='span-2';
          .input-label&attributes(divObj)
            +span({role:'heading','aria-level':5,'data-i18n':name})
            +adaptiveInput({name,type:'text',class:'underlined'})
      .headed-textarea.arc
        h5(data-i18n='character arc/flaw')
        +adaptiveTextarea({name:'arc flaw',class:'underlined'})
      +input-label({
        label:'adventure points',
        inputObj:{name:'ap',type:'number',class:'underlined'},
        divObj:{class:'stacked ap adventure-points'},
        spanObj:{role:'heading','aria-level':4}
      })
    .character-summary.character-type.character-type--mon
      +adaptiveInput({name:'character name',type:'text',class:'underlined',role:'heading','aria-level':2}).character-name
      +select-label({
        inputObj:{name:'signature stat',class:'underlined'},
        spanObj:{'data-i18n':'signature stat',role:'heading','aria-level':4}
      })
        +option({value:'','data-i18n':'select one'})
        each name in attributes
          +option({value:name,'data-i18n':name,class:name})
      .input-label
        +span({'data-i18n':'element',role:'heading','aria-level':4})
        +text({name:'element',class:'underlined'})