<!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="shortcut icon" href = "/img/icon.png" type="image/x-icon">
    <link href="/css/style.css" rel="stylesheet">
    <title> Detalhes </title>
</head>

<body>
    <%- include('./partials/header.ejs') %>
    <main>
        <div id="sub__header">
            <%= heroisDetalhes.nome %>
        </div>
        <section id="details_container">
            <img src="<%= heroisDetalhes.img %>" alt="imagem do personagem">
            <table> 
                <thead> 
                    <th colspan="2"> Detalhes  </th>
                </thead>
                <tbody> 
                    <tr> 
                        <td> Identidade  </td>
                        <td> <%= heroisDetalhes.identidade %>  </td>
                    </tr>
                    <tr>
                        <td> GÃªnero  </td>
                        <td> <%= heroisDetalhes.genero %> </td>
                    </tr>
                    <tr>
                        <td> Criadores </td>
                        <td> <%= heroisDetalhes.criadores %> </td>
                    </tr>
                </tbody>
                <tfoot> </tfoot>
            </table>    
        </section>
    </main>
</body>

</html>