<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
    <nav>
        <article>
            <img src="/img/pokeball2.gif" class="img-fluid gif" alt="Animação PokeBola">
            <h1><a href="/">Pokedéx</a></h1>

        </article>
        <ul>
            <li>
                <a href="#">Home</a>
            </li>
            <li>
                <a href="/cadastro">Cadastro</a>
            </li>
            <!-- <li>
                <a href="#inscrever">Inscreva-se</a>
            </li> -->
        </ul>
    </nav>
       
    <header>
        <h1>
            <%= detailsPoke.nome%><span style="font-weight: 200"> - <%= detailsPoke.numero%> </span>
        </h1>
    </header>
    <section id="details">
        <img id="img-pokemon" src="<%= detailsPoke.imagem %>">
        <div id="infos">
            <p><%= detailsPoke.descricao%></p>
            <div id="info-datail">
                <div class='col'>
                    <h4>Altura:</h4>
                    <h3><%= detailsPoke.altura%></h3>
                    <h4>Peso:</h4>
                    <h3><%= detailsPoke.peso%></h3>
                </div>
                <div class='col'>
                    <h4>Categoria:</h4>
                    <h3><%= detailsPoke.categoria%></h3>
                    <h4>Habilidade:</h4>
                    <h3><%= detailsPoke.habilidade%></h3>
                </div>
            </div>
            <h3>Tipo:</h3>
            <h2><%= detailsPoke.tipo%></h2>
        </div>
        <!-- <main class="detalhes">
            
            <div class="<%=detailsPoke.tipo%> titulo detalhes"><%=detailsPoke.nome%></div>
            <div id="detalhes-card">
                <img src="<%= detailsPoke.imagem %>">
            <div class="detalhes-texto">
                <table>
                    <tr>
                        <td class="td-chave">Nome:</td>
                        <td class="td-info"><%= detailsPoke.nome %> - <%= detailsPoke.numero %></td>
                    </tr>
                </table>
                
            </div>
             </div>
        </main> -->
    </section>
 

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

    <footer>
        <p>
           &copy; Todos os Direitos Reservados. Projeto Desenvolvido por Valdenir S. Brito - < The future is blue /> <a href="https://blueedtech.com.br/" target="_blank"> BlueEdtech</a>
        </p>
    </footer>
       
</body>
</html>