<!-- render the project title -->
<%= render :partial => "plan_title", locals: {plan: @plan} %>

<div class="content">
  <div class="tabbed-area">
    <!-- render navigation tabs for the project-->
    <ul class="tabs" role="tablist">
      <li id="details-tab" role="tab" aria-controls="details-panel" class="active">
        <a href="#details-panel" aria-selected="true"><%= _('Project Details') %></a>
      </li>
  
      <% @plan.template.phases.each do |phase| %>
        <li id="phase-#<%= phase.id %>-tab" role="tab" aria-controls="phase-#<%= phase.id %>-panel">
          <a href="<%= edit_plan_phase_path(@plan, phase) %>" aria-selected="false"><%= phase.title %></a>
        </li>
      <% end %>
  
      <li id="share-tab" role="tab" aria-controls="share-panel">
        <a href="<%= share_plan_path(@plan) %>" aria-selected="false"><%= _('Share') %></a>
      </li>
      <li id="download-tab" role="tab" aria-controls="download-panel">
        <a href="<%= show_export_plan_path(@plan) %>" aria-selected="false"><%= _('Download') %></a>
      </li>
    </ul>

    <!-- project details -->
    <div class="tab-panels" role="tabpanel">
      <div id="details-panel" class="tab-panel active" aria-hidden="false" aria-labelledby="details-tab">
        <% if @plan.editable_by?(current_user) %>
          <%= render partial: 'edit_details', locals: {plan: @plan, visibility: @visibility} %>
        <% else %>
          <%= render partial: 'show_details', locals: {plan: @plan, visibility: @visibility} %>
        <% end %>
      </div>
    </div>
</div>