<!-- views/partials/head.ejs -->
<meta charset="UTF-8">
<title>eLibrary VIT Chennai</title>

<!-- CSS (load bootstrap from a CDN) -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

<!-- views/partials/header.ejs -->
<%- include('partials/navbar') %>

<div class="container mt-4">
<h3>Genre</h3>

<% books.forEach(book => {%>
    <form method="post" action="/listresult" style="float: left;">
    <input type="hidden" name = "genre" value="<%=book.genre%> ">
    <button class="btn" type="submit" style="margin: 3px;">
        <%= book.genre %>
    </button>
    </form>
<% }) %>

</div>

<style type="text/css">
    .chip,
    .chip:visited,
    .chip:hover {
      color: black;
      background: #eef0f3;
      border: 0;
      padding: .2rem .4rem;
      text-overflow: ellipsis;
      text-decoration: none;
      border-color: black;
    }
  
</style>



