<div class="advancement">
    <p>{{localize "DND5E.AdvancementMigrationHint" name=item.name}}</p>
    <ol class="items-list">
        <li class="items-header flexrow">
            <h3 class="item-name flexrow">{{localize "DND5E.AdvancementTitle"}}</h3>
            <div class="item-controls flexrow">{{localize "DND5E.Add"}}</div>
        </li>
        {{#each advancements}}
        <li class="advancement-item item flexrow">
            <div class="item-name flexrow">
                <div class="item-image" style="background-image: url('{{this.icon}}')"></div>
                <h4>{{this.title}}</h4>
            </div>
            <div class="item-controls flexrow">
                <input type="checkbox" name="{{this.id}}" checked>
            </div>
            {{#if this.summary}}
            <div class="item-summary">
                {{{this.summary}}}
            </div>
            {{/if}}
        </li>
        {{/each}}
    </ol>
</div>
