<!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" />
    <link rel="shortcut icon" href="/img/bola.ico" />
    <title>Pokédex</title>
  </head>
  <body>
    <header>
      <nav>
        <img src="/img/logo.png" alt="" />
        <ul>
          <a href="/"><li>Pokédex</li></a>
          <a href="/cadastro"><li>Cadastro</li></a>
        </ul>
      </nav>
    </header>
    <main>
      <section id="descr">
        <div>
          <div><h2><%=pokemon.nome%> Nº<%=pokemon.numero%></h2></div>
          <div>
            <img src="<%=pokemon.imagem%>" alt="" />
            <p><%=pokemon.descricao%></p>
          </div>
          <div>
            <div>
              <% pokemon.tipo.forEach((tipo) => { %>
              <p class="tipos">Tipo - <%=tipo%></p>
              <% })%>
            </div>
            <div>
              <p class="tipos">Altura - <%=pokemon.altura%></p>
            </div>
            <div>
              <p class="tipos">Peso - <%=pokemon.peso%></p>
            </div>
            <div>
              <p class="tipos">Categoria - <%=pokemon.categoria%></p>
            </div>
            <div>
              <p class="tipos">Habilidade - <%=pokemon.habilidade%></p>
            </div>
          </div>
        </div>
      </section>
    </main>
    <footer>
      <p>&copy; Pokémon - Todos os direitos reservados - 2022</p>
    </footer>
    <script src="./js/script.js"></script>
  </body>
</html>
