{{! Template pour l'onglet Effects des items - organisé par catégories }}
<div class="effects-container">

  {{#each effectCategories as |section sid|}}
    <div class="effect-category">
      <ul class="stat-list alternate-list">
        <li class="item flexrow list-item items-title-bg">
          <span class="item-name-label-header-long">
            <h3><label class="items-title-text">{{localize
                  section.label
                }}</label></h3>
          </span>
          <span class="item-field-label-short">
            <label class="short-label">{{localize
                "PRISMRPG.Label.source"
              }}</label>
          </span>
          <span class="item-field-label-medium">
            <label class="short-label">{{localize
                "PRISMRPG.Label.duration"
              }}</label>
          </span>
          <div class="item-filler">&nbsp;</div>
          <div class="item-controls item-controls-fixed">
            <a
              class="effect-control"
              data-action="create-effect"
              data-effect-type="{{section.type}}"
              title="{{localize 'DOCUMENT.Create' type="Effect"}}"
            >
              <i class="fas fa-plus"></i>
              {{localize "DOCUMENT.New" type="Effect"}}
            </a>
          </div>
        </li>

        {{#each section.effects as |effect|}}
          <li
            class="item flexrow list-item list-item-shadow"
            data-item-id="{{effect._id}}"
            data-effect-id="{{effect._id}}"
            data-parent-id="{{effect.parent.id}}"
          >
            <a
              class="item-edit item-name-img"
              data-action="effect-edit"
              title="Edit Effect"
            >
              <img class="sheet-competence-img" src="{{effect.img}}" />
            </a>
            <span class="item-name-label-long">{{effect.name}}</span>
            <span class="item-field-label-short">{{effect.sourceName}}</span>
            <span
              class="item-field-label-short"
            >{{effect.duration.label}}</span>

            <div class="item-filler">&nbsp;</div>
            <div class="item-controls effect-controls flexrow">
              <a
                class="effect-control item-edit"
                data-action="effect-edit"
                title="{{localize 'DOCUMENT.Update' type="Effect"}}"
              >
                <i class="fas fa-edit"></i>
              </a>
              <a
                class="effect-control"
                data-action="effect-delete"
                title="{{localize 'DOCUMENT.Delete' type="Effect"}}"
              >
                <i class="fas fa-trash"></i>
              </a>
            </div>
          </li>
        {{/each}}
      </ul>
    </div>
  {{/each}}

</div>