<!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">
    <title>Pokedex</title>
</head>

<body>

    <header>
        <div>
            <nav id="menu">
                    <a id="btnCadastro" href="/cadastro" pull-right>CADASTRO</a>
                </ul>
            </nav>
        </div>
    </header>

    <h1>Projeto Pokedex</h1>

    <h2>POKEMONS CADASTRADOS NA SUA POKEDEX:</h2>
    <main class="grid">
        <article>
        <section id="pokecard">
            <% pokedex.forEach((item, index)=> { %>
                <a href="/detalhes/<%= index %>">
                    <img src="<%= item.imagem %>" alt="">
                    <h2>
                        <%= item.nome %>
                    </h2>
                    <h4>
                        <%= item.tipo %>
                    </h4>
                </a>
                <% }) %>
        </section>
        </article>
    </main>

    <footer>Projeto desenvolvido por Caroline Jeunon - Aluna Blue EdTech.</footer>  

</body>

</html>