<!DOCTYPE html>
<html lang="pt-BR">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="css/style.css" type="text/css" />
    <title>Home</title>
  </head>
  <body>
    <%- include('./partials/header') %>
    <main>
      <section id="container">
          <h2>Contos Dispon√≠veis</h2>
        <section
          id="cards"
          style="display: flex; flex-wrap: wrap; justify-content: space-evenly"
        >
          <% iuliadb.forEach(element => { %>
          <div class="card">
            <a href="/detalhes/<%= element.id %>">
              <!-- <h4><%= element.id %></h4> -->
           <div class="card-contents">
            <div id="name">
              <h3><%= element.nome %></h3>
            </div>
            <div class="year-card">
              <span class="card-body"><%= element.ano %></span>
            <p class="card-body"><%= element.desc_short %></p>
          </div>
          <div id="bottons">  
            <% if(button == 0) { %>
            <a href="/deletar/<%= element.id %>">
            <button type="button" class="btn-delete">Delete</button>
    </a>
    <% }else { %>
      <a href="/editar/<%= element.id %>">
        <button type="button" class="btn-delete">Update</button>
</a>
<% } %>
    </div>
            
          </a>
           </div>

          </div>
          
          <% }) %>
        </section>
      </section>
    </main>
    <%- include('./partials/footer') %>
  </body>
</html>
