<!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=0, initial-scale=1.0">
    <link rel="stylesheet" href="/css/style.css">
    <title>Catálogo Cervejeiro | Detalhes</title>
</head>
<body>
    <header>
        <nav>
            <div class="nav-left">
                <a href="/" class="nav-logo">CATÁLOGO CERVEJEIRO</a>
                <img src="/img/LOGO.png">
            </div>
            <div class="nav-right">
                <a href="/">Home</a> 
                <a href="/cadastro">Cadastrar</a>
                <a href="/quem-somos">Quem Somos</a>
            </div>
        </nav>
    
        <div class="header">
            <h1><%= cerveja.nome %></h1>
        </div>
    </header>
    <section class="detalhes">
        <section id="cerveja">
        <% if(cerveja.tipo == "IPA") {  %>
            <img src=/img/IPA.png>
        <% } else if(cerveja.tipo == "Ale") {  %>
            <img src=/img/Ale.png>
        <% } else if(cerveja.tipo == "Lager") {  %>
            <img src=/img/Lager.png>
        <% } else if(cerveja.tipo == "Pilsen") {  %>
            <img src=/img/Pilsen.png>
        <% } else if(cerveja.tipo == "Weiss") {  %>
            <img src=/img/Pilsen.png>
        <% } else if(cerveja.tipo == "Outro") { %>
            <img src=/img/Outro.png>
        <% } %>
        <div>
            <spam><%= cerveja.descricao %></spam>
        </div>
        </section>
        <div class="info-cerveja">
            <div>
                Tipo
                <spam id="tipo"><%= cerveja.tipo %></spam>
            </div>
            <div>
                IBU
                <spam><%= cerveja.ibu %></spam>
            </div>
            <div>
                Teor alcoólico
                <spam><%= cerveja.teoralcoolico %></spam>
            </div>
            <div>
                Fabricante
                <spam><%= cerveja.fabricante %></spam>
            </div>
            <div class="botoes-detalhes">
                <a href="/editar/<%= cerveja.id %>">  
                    <button>Editar</button>
                </a>
                <form action="/deletar/<%= cerveja.id %>" method="POST">  
                    <button onclick="return confirm('Tem certeza que quer deletar essa cerveja?');" type="submit">Deletar</button>
                </form>
            </div>
        </div>
    </section>
    <script src="/js/script.js"></script>
</body>
</html>