<div class="row mb-3">
  <div class="col-12">
    <h1>List of hardware</h1>
  </div>

  <div class="col-12">
    <p>
      <a href="/hardware/add">Add new hardware</a>
    </p>
  </div>
</div>

<div class="row mb-3">
  <% if hardware.length > 0 %>
    <div class="col-12">
      <table class="table table-hover table-responsive">
        <thead class="table-light">
          <tr>
            <th>Hardware name</th>
            <th>Type</th>
            <th>Date added</th>
            <th>Date modified</th>
          </tr>
        </thead>
        <tbody>
          <% hardware.each do |h| %>
            <tr>
              <td><a href="/hardware/<%= h.id %>"><%= h.name %></a></td>
              <td><%= h.type %></td>
              <td><%= date_format(h.created_at) %></td>
              <td><%= date_format(h.updated_at) %></td>
            </tr>
          <% end %>
        </tbody>
      </table>
    </div>
  <% else %>
    <div class="col-12">
      <p>I'm sorry, there doesn't appear to be any hardware added yet. Check again later!</p>
    </div>
  <% end %>
</div>
