<!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">
    <title>TheBest</title>
    <link rel="icon" type = " image / jpg " href="https://cdn-icons-png.flaticon.com/512/53/53205.png">
    <link rel="stylesheet" href="/css/style.css">
    <title>Deletar Musica</title>
  </head>
  <body>
    <header>
      <div class="content">
        <nav>
          <p class="brand">the<strong>Best</strong></p>
          <ul>
            <li><a href="/">Catálogo</a></li>
            <li><a href="/">Sobre nós</a></li>
            <li><a href="/criar">Cadastrar nova Musica</a></li>
            <li><a  href="/login"><button>Login</button></a></li>
          </ul>
        </nav>
        <div class="header-block">
          <div class="text">
            <h2>A musica perfeita para você</h2>
            <p>
              A musica perfeita para você ouvir a qualquer momento!
            </p>
          </div>
          <img src="https://store-images.s-microsoft.com/image/apps.29439.14275335401288852.0039a406-66bd-4b22-824e-f764f3eecfd1.df3bf2cf-8837-477d-8f2e-304b2cb64129?mode=scale&q=90&h=200&w=200&background=%23ffffff" alt="100" height="100" />
        </div>
      </div>
    </header>
       <h3>Delete sua Musica:</h3>
       
        <% if(message != "") {  %>
            <section id="message">
                <p><%= message %></p> <span id="close">&times;</span>
            </section>
        <% }  %>

        <section id="esp">
          <h1>espaço</h1>
        </section>
                
        
        <% if(musica != null) {  %>
        <section id="inscrever">
          
            <form action="/deletar/<%= musica.id %>" method="POST">
                <div>
                    <label for="nome">Digite o nome da Musica: </label>
                    <input type="text" name="nome" id="nome" placeholder="Nome da Musica" value="<%= musica.nome %>">
                </div>
            
                <div>
                    <label for="descricao">Digite a descrição da Musica: </label>
                    <input type="text" name="descricao" id="descricao" placeholder="Descrição" value="<%= musica.descricao %>">
                </div>
                <div>
                    <label for="imagem">Coloque o link para a imagem da Musica: </label>
                    <input type="text" name="imagem" id="imagem" placeholder="Link da imagem" value="<%= musica.imagem %>">
                </div>
            
                <button type="submit">DELETAR!</button>
            </form>
        </section>
        <% }  %>

        <footer>
            <div class="last">Catalogo 2021 - Sembre online</div>
        </footer>
    <script src="/js/script.js"></script>
</body>

</html>