<!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/stilo.css">
        <title>Detalhes</title>
    </head>
    <figure>
        <img  src = "img/logo.png" />
        
        </figure>
<figure>
          <img id="img" src="https://i.imgur.com/zRzXPvg.gif?noredirect" />

          </figure>
    <body>

        
       <article id="p">
            <section class="container stretch">
                
                <h1> 
                    <a id="titulo" href="/"></a>POKEDEX A EVOLUÇÃO</a>
                </h1>
                
            
            
            </section>
            <section class="botao">
                <p><a id="detail" href="/cadastro">Cadastro</a></p>
                <a id="home" href="/">Home</a>
            </section>
        
            <% if(aviso != ""){ %>
            <section id="message">
                <p class="sucesso">Pokemon cadastrado com sucesso!</p>
                <span id="close">&times;</span>

            </section>
            <% } %>
        
            <div class="container flex-start">
                <div class="item1">
            <div id="poke">
                <% lista.forEach(item => { %>
                   </div> 
                <img class="imagee" src="<%= item.imagem %>" alt="imagem1" >
            
               
                <p class="numeroo">Numero: <%= item.numero %></p> 
            
                <p class="nomee">Nome: <%= item.nome %> <br> </p> 
              
                <p class="tipoo">Tipo: <%= item.tipo %> <br> </p>
               
              
                <p class="alt">Altura: <%= item.altura %> <br> </p>
                
                <p class="pes">Peso: <%= item.peso %> <br> </p>
                
                <p class="gen">Genero: <%= item.genero %> <br> </p>

                <p class="cat">Categoria: <%= item.categoria %> <br> </p>

                <p class="hab">Habilidades: <%= item.habilidades %> <br> </p>
               
                <p class="mod">Modelo: <%= item.modelo %> <br> </p> 
               
                <p class="fraq">Fraquezas: <%= item.fraquezas %> <br> </p>

                <div class="container flex-start">
                    <div class="item1">
                            
                    </div>
                <a class="tip" href="/detalhes"><p>Viste a Pagina Para ver mais Pokemons</p></a>
                <% }) %> 
           
           
            </div>
        </article>
    </div>

        <script src="/js/script.js"></script>
    </body>
</html>