<h4>
  <%= link_to data_vault_path, class: 'grey-text tooltipped', style: 'position: relative; top: 4px;', data: {
        position: 'bottom',
        enterDelay: '500',
        tooltip: "Back to your Data Vault"
      } do %>
    <i class="material-icons">arrow_back</i>
  <% end %>
  Download your notebook
</h4>

<p>We offer the following download formats, with more coming soon.</p>

<div class="row">
  <div class="col s12 m4">
    <div class="hoverable card">
      <div class="card-content">
        <div class="card-title">
          <i class="material-icons blue-text right">file_download</i>
          Outline (TXT)
        </div>
        <div class="card-body">
          <blockquote>
            A human-readable format useful for turning your entire notebook into a text outline.
          </blockquote>
          <ul>
            <li><%= link_to "notebook.txt", notebook_outline_path %></li>
          </ul>
        </div>
      </div>
    </div>
  </div>

  <div class="col s12 m4">
    <div class="hoverable card">
      <div class="card-content">
        <div class="card-title">
          <i class="material-icons circle blue-text right">file_download</i>
          Excel (CSV)
        </div>
        <div class="card-body">
          <blockquote>
            A basic spreadsheet format that you can import into Excel, Google Sheets, or any other spreadsheet application.
          </blockquote>
          <ul>
            <% Rails.application.config.content_types[:all].each do |page_type| %>
              <li>
                <%= link_to "#{page_type.name.downcase.pluralize}.csv",
                            notebook_csv_path(model: page_type.name.downcase.pluralize) %>
              </li>
            <% end %>
          </ul>
        </div>
      </div>
    </div>
  </div>

  <div class="col s12 m4">
    <div class="hoverable card">
      <div class="card-content">
        <div class="card-title">
          <i class="material-icons circle blue-text right">file_download</i>
          JSON
        </div>
        <div class="card-body">
          <blockquote>
            JSON exports are recommended for developers and those looking to import their data into JSON-compatible software.
          </blockquote>
          <ul>
            <li><%= link_to "notebook.json", notebook_json_path %></li>
          </ul>
        </div>
      </div>
    </div>
  </div>

  <div class="col s12 m4">
    <div class="hoverable card">
      <div class="card-content">
        <div class="card-title">
          <i class="material-icons circle blue-text right">file_download</i>
          XML
        </div>
        <div class="card-body">
          <blockquote>
            XML exports are recommended for those looking to import their data into XML-compatible software.
          </blockquote>
          <ul>
            <li><%= link_to "notebook.xml", notebook_xml_path %></li>
          </ul>
        </div>
      </div>
    </div>
  </div>

  <div class="col s12 m4">
    <div class="hoverable card">
      <div class="card-content">
        <div class="card-title">
          <i class="material-icons circle blue-text right">file_download</i>
          YAML
        </div>
        <div class="card-body">
          <blockquote>
            YAML exports are a more human-readable format for importing into other applications.
          </blockquote>
          <ul>
            <li><%= link_to "notebook.yml", notebook_yml_path %></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
