<div class="template-editor-header">
  <h1 class="title">
    <% if @type == :pdf %>
      <%= t('projects.reports.wizard.first_step.values_editor.title_pdf', template: @template_name) %>
    <% else %>
      <%= t('projects.reports.wizard.first_step.values_editor.title_docx', template: @template_name) %>
    <% end %>
  </h1>
  <div class="collapse-buttons sci-btn-group pull-right">
     <button class="btn btn-light collapse-all">
        <i class="sn-icon sn-icon-up"></i>
        <%= t("projects.reports.wizard.second_step.collapse_all") %>
     </button>
     <button class="btn btn-light expand-all">
        <i class="sn-icon sn-icon-down"></i>
        <%= t("projects.reports.wizard.second_step.expand_all") %>
     </button>
  </div>
</div>
<div class="template-editor-description">
  <%= t('projects.reports.wizard.first_step.values_editor.description') %>
</div>

<%
  toc = yield :toc
  header = yield :header
  cover = yield :cover
  footer = yield :footer
%>

<% if toc.present? %>
  <div class="section">
    <h1>
      <i class="sn-icon sn-icon-down " data-toggle="collapse" href="#tocContainer" aria-expanded="false"></i>
      <%= t('projects.reports.wizard.first_step.values_editor.toc') %>
    </h1>
    <div class="values-container collapse in" id="tocContainer">
      <%= toc %>
    </div>
  </div>
<% end %>

<% if header.present? %>
  <div class="section">
    <h1>
      <i class="sn-icon sn-icon-down " data-toggle="collapse" href="#headerContainer" aria-expanded="false"></i>
      <%= t('projects.reports.wizard.first_step.values_editor.header') %>
    </h1>
    <div class="values-container collapse in" id="headerContainer">
      <%= yield header %>
    </div>
  </div>
<% end %>

<% if cover.present? %>
  <div class="section">
    <h1>
      <i class="sn-icon sn-icon-down " data-toggle="collapse" href="#coverContainer" aria-expanded="false"></i>
      <%= t('projects.reports.wizard.first_step.values_editor.cover') %>
    </h1>
    <div class="values-container collapse in" id="coverContainer">
      <%= cover %>
    </div>
  </div>
<% end %>

<% if footer.present? %>
  <div class="section">
    <h1>
      <i class="sn-icon sn-icon-down " data-toggle="collapse" href="#footerContainer" aria-expanded="false"></i>
      <%= t('projects.reports.wizard.first_step.values_editor.footer') %>
    </h1>
    <div class="values-container collapse in" id="footerContainer">
      <%= footer %>
    </div>
  </div>
<% end %>
