<form class="{{cssClass}}" autocomplete="off"> <header class="sheet-header"> <img class="profile-img" src="{{item.img}}" data-edit="img" title="{{item.name}}"/> <div class="header-fields"> <h1 class="charname"><input name="name" type="text" value="{{item.name}}" placeholder="Name"/></h1> <div class="resource"> <label>Quantity</label> <input type="text" name="data.quantity" value="{{data.quantity}}" data-dtype="Number"/> </div> <div class="resource"> <label>Weight</label> <input type="text" name="data.weight" value="{{data.weight}}" data-dtype="Number"/> </div> </div> </header> {{!-- Sheet Tab Navigation --}} <nav class="sheet-tabs tabs" data-group="primary"> <a class="item" data-tab="description">Description</a> <a class="item" data-tab="attributes">Attributes</a> </nav> {{!-- Sheet Body --}} <section class="sheet-body"> {{!-- Description Tab --}} <div class="tab" data-group="primary" data-tab="description"> {{editor content=data.description target="data.description" button=true owner=owner editable=editable}} </div> {{!-- Attributes Tab --}} <div class="tab attributes" data-group="primary" data-tab="attributes"> <header class="attributes-header flexrow"> <span class="attribute-key">Attribute Key</span> <span class="attribute-value">Value</span> <span class="attribute-label">Label</span> <span class="attribute-dtype">Data Type</span> <a class="attribute-control" data-action="create"><i class="fas fa-plus"></i></a> </header> <ol class="attributes-list"> {{#each data.attributes as |attr key|}} <li class="attribute flexrow" data-attribute="{{key}}"> <input class="attribute-key" type="text" name="data.attributes.{{key}}.key" value="{{key}}"/> {{#if attr.isCheckbox}} <label class="attribute-value checkbox"><input type="checkbox" name="data.attributes.{{key}}.value" {{checked attr.value}}/></label> {{else}} <input class="attribute-value" type="text" name="data.attributes.{{key}}.value" value="{{attr.value}}" data-dtype="{{attr.dtype}}"/> {{/if}} <input class="attribute-label" type="text" name="data.attributes.{{key}}.label" value="{{attr.label}}"/> <select class="attribute-dtype" name="data.attributes.{{key}}.dtype"> {{#select attr.dtype}} {{#each ../dtypes as |t|}} <option value="{{t}}">{{t}}</option> {{/each}} {{/select}} </select> <a class="attribute-control" data-action="delete"><i class="fas fa-trash"></i></a> </li> {{/each}} </ol> </div> </section> </form>