<!DOCTYPE html>
<html lang="en">
  <head>
    <%- include('../partials/head',{variant: 'compact'}); %>
  </head>
  <body class="container">
    <header><%- include('../partials/header'); %></header>

    <main>
      <div class="jumbotron">
        <h1>Who am I</h1>
        <p>Hi everyone, I am Lennard</p>

        <h2>Friends list</h2>
        <p><%= tagline %></p>

        <ul>
          <% friends.forEach(function(friend) { %>
          <li>
            <strong><%= friend.name %></strong>
            working as a <strong><%= friend.department %></strong>, interested
            in <strong><%= friend.interest %></strong>
          </li>
          <% }); %>
        </ul>
      </div>
    </main>

    <footer><%- include('../partials/footer'); %></footer>
  </body>
</html>