<form class="monks-active-tiles sheet trigger-action" autocomplete="off" onsubmit="event.preventDefault();">
    <ol class="items-list history-list">
        <li class="item-header flexrow">
            <h3 class="item-name flexrow">{{ localize "MonksActiveTiles.history.Name" }}</h3>
            <div class="item-controls" style="flex: 0 0 160px;">{{ localize "MonksActiveTiles.history.Value" }}</div>
            <div class="item-controls flexrow"></div>
        </li>

        <ol class="item-list">
            {{#each variables}}
            <li class="item flexrow" data-id="{{@key}}">
                <div class="item-name flexrow">
                    <h4>{{@key}}</h4>
                </div>

                <div class="item-controls" style="flex: 0 0 160px;">
                    {{this}}
                </div>

                <div class="item-controls flexrow">
                    <a class="item-control item-delete" title="Delete Variable"><i class="fas fa-trash"></i></a>
                </div>
            </li>
            {{/each}}
        </ol>
    </ol>
    <footer class="sheet-footer flexrow">
        <button type="button" name="clear">
            <i class="fas fa-undo"></i> {{localize "MonksActiveTiles.ClearVariables"}}
        </button>
    </footer>
</form>